1.展示效果
该实现基于这三篇文章:
安卓Toolbar的使用demo—自定义标题栏
基于toolbar实现滑动菜单以及实现圆形头像(NavigationView)
悬浮按钮和可交互提示的使用
2.实现过程
(1)添加依赖
implementation 'androidx.recyclerview:recyclerview:1.0.0'
//加载网络图片
implementation 'com.github.bumptech.glide:glide:4.9.0'
(2)修改activity_main.xml,添加RecyclerView
<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/drawerLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- 避免被RecyclerView遮住-->
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!--自定义标题栏-->
<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar"
android:background="#969C99"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|enterAlways|snap"
/> <!--当向上滚动时,toolbar会一起向上隐藏,否则会显示-->
</com.google.android.material.appbar.AppBarLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
/>
<!-- 悬浮按钮-->
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="16dp"
android:src="@drawable/yes"
app:elevation="8dp"
/>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
<!--滑动自定义菜单-->
<com.google.android.material.navigation.NavigationView
android:id="@+id/navView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="start"
app:menu="@menu/nav_menu"
app:headerLayout="@layout/nav_header"/>
</androidx.drawerlayout.widget.DrawerLayout>
(3)新建封装类Fruit
public class Fruit {
private String name;
private int imageId;
public Fruit(String name,int imageId) {
this.name = name;
this.imageId=imageId;
}
public int getImageId() {
return imageId;
}
public void setImageId(int imageId) {
this.imageId = imageId;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}
(4)在layout文件夹新建fruit_item.xml
<?xml version="1.0" encoding="utf-8"?>
<com.google.android.material.card.MaterialCardView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_margin="5dp"
app:cardCornerRadius="4dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="@+id/fruitImage"
android:layout_width="match_parent"
android:layout_height="100dp"
android:scaleType="centerCrop"/><!--指定图片的缩放模式-->
<TextView
android:id="@+id/fruitName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_margin="5dp"
android:textSize="16sp"/>
</LinearLayout>
</com.google.android.material.card.MaterialCardView>
(5)新建FruitAdapter类
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;
import androidx.annotation.NonNull;
import androidx.cardview.widget.CardView;
import androidx.recyclerview.widget.RecyclerView;
import com.bumptech.glide.Glide;
import java.util.List;
public class FruitAdapter extends RecyclerView.Adapter<FruitAdapter.ViewHolder> {
private Context mContext;
private List<Fruit> mFruitList;
@NonNull
@Override
public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
if (mContext==null){
mContext=parent.getContext();
}
View view= LayoutInflater.from(mContext).inflate(R.layout.fruit_item,parent,false);
return new ViewHolder(view);
}
@Override
public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
Fruit fruit=mFruitList.get(position);
holder.fruitName.setText(fruit.getName());
Glide.with(mContext).load(fruit.getImageId()).into(holder.fruitImage);
}
@Override
public int getItemCount() {
return mFruitList.size();
}
static class ViewHolder extends RecyclerView.ViewHolder{
CardView cardView;
ImageView fruitImage;
TextView fruitName;
public ViewHolder(View view){
super(view);
cardView=(CardView)view;
fruitImage=view.findViewById(R.id.fruitImage);
fruitName=view.findViewById(R.id.fruitName);
}
}
public FruitAdapter(List<Fruit>fruitList){
mFruitList=fruitList;
}
}
(6)修改MainActivity.java
import androidx.annotation.NonNull;
import androidx.appcompat.app.ActionBar;
import androidx.appcompat.app.AppCompatActivity;
import androidx.appcompat.widget.Toolbar;
import androidx.core.view.GravityCompat;
import androidx.drawerlayout.widget.DrawerLayout;
import androidx.recyclerview.widget.GridLayoutManager;
import androidx.recyclerview.widget.RecyclerView;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.Toast;
import com.google.android.material.floatingactionbutton.FloatingActionButton;
import com.google.android.material.navigation.NavigationView;
import com.google.android.material.snackbar.Snackbar;
import java.util.ArrayList;
import java.util.List;
import java.util.Random;
/**
* 悬浮按钮和交互提示
*/
public class MainActivity extends AppCompatActivity {
private DrawerLayout mDrawerLayout;
private Fruit[]fruits={new Fruit("苹果",R.drawable.nav_icon),
new Fruit("香蕉",R.drawable.t2),
new Fruit("西瓜",R.drawable.t5),
new Fruit("小丸子",R.drawable.touxiang),
new Fruit("小花",R.drawable.t8),
new Fruit("笨笨",R.drawable.t3),
};
private List<Fruit>fruitList=new ArrayList<>();
private FruitAdapter adapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar=findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
mDrawerLayout=findViewById(R.id.drawerLayout);
NavigationView navigationView=findViewById(R.id.navView);
FloatingActionButton fab=findViewById(R.id.fab);
fab.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Snackbar.make(v,"删除",Snackbar.LENGTH_SHORT)
.setAction("取消", new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this,"已取消",Toast.LENGTH_SHORT).show();
}
}).show();
}
});
ActionBar actionBar=getSupportActionBar();
if (actionBar!=null){
actionBar.setDisplayHomeAsUpEnabled(true);
actionBar.setHomeAsUpIndicator(R.drawable.menu);
}
// navigationView.setCheckedItem(R.id.navCall);//默认选中
navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem menuItem) {
switch (menuItem.getItemId()){
case R.id.navCall:
Toast.makeText(MainActivity.this,"电话",Toast.LENGTH_SHORT).show();
break;
case R.id.navFriends:
Toast.makeText(MainActivity.this,"朋友",Toast.LENGTH_SHORT).show();
break;
case R.id.navLocation:
Toast.makeText(MainActivity.this,"地址",Toast.LENGTH_SHORT).show();
break;
case R.id.nav_email:
Toast.makeText(MainActivity.this,"邮箱",Toast.LENGTH_SHORT).show();
break;
case R.id.navTask:
Toast.makeText(MainActivity.this,"任务",Toast.LENGTH_SHORT).show();
break;
}
mDrawerLayout.closeDrawers();
return true;
}
});
iniFruits();
RecyclerView recyclerView=findViewById(R.id.recyclerView);
GridLayoutManager layoutManager=new GridLayoutManager(this,2);
recyclerView.setLayoutManager(layoutManager);
adapter=new FruitAdapter(fruitList);
recyclerView.setAdapter(adapter);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.toolbar,menu);
return true;
}
@Override
public boolean onOptionsItemSelected(@NonNull MenuItem item) {
switch (item.getItemId()){
case R.id.backup:
Toast.makeText(this,"备份",Toast.LENGTH_SHORT).show();
break;
case R.id.delete:
Toast.makeText(this,"删除",Toast.LENGTH_SHORT).show();
break;
case R.id.settings:
Toast.makeText(this,"设置",Toast.LENGTH_SHORT).show();
break;
case R.id.back:
Toast.makeText(this,"返回",Toast.LENGTH_SHORT).show();
break;
case android.R.id.home:
mDrawerLayout.openDrawer(GravityCompat.START);
break;
}
return true;
}
private void iniFruits(){
fruitList.clear();
for (int i=0;i<50;i++){
Random random=new Random();
int index=random.nextInt(fruits.length);
fruitList.add(fruits[index]);
}
}
}