一、功能说明
1、在模仿微信的基础门户页面中的某个tab页面中添加recycleview
2、对该列表页面添加点击跳转设计
二、核心代码与实现效果
1 添加recycleview
1.1 布局
1.1.1 在某一个tab页面（联系人页面）中添加recycleview控件
1.1.2 另外添加一个layout文件，为recycleview中的每个item进行样式设计
1.2 创建Adapter类，可将数据绑定到recycleview中对应的Item上
public class MyAdapter extends RecyclerView.Adapter <MyAdapter.MyViewHolder>{
//定义存储数据和运行环境的变量
private List<Map<String,Object>> mydata;
private Context mycontext;
//获取数据和运行环境
public MyAdapter(List<Map<String,Object>> data, Context context){
mydata=data;
mycontext=context;
}
@NonNull
@Override
public MyViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view= LayoutInflater.from(mycontext).inflate(R.layout.fra_lx_two_item,parent,false);
MyViewHolder holder=new MyViewHolder(view);
return holder;
}
@Override
public void onBindViewHolder(@NonNull MyAdapter.MyViewHolder holder, int position) {
//获取点击位置的对应数据
String name=mydata.get(position).get("i_name").toString();
int image=Integer.parseInt(mydata.get(position).get("i_image").toString());
//将此数据显示到item中
holder.textView.setText(name);
holder.imageView.setImageResource(image);
}
@Override
public int getItemCount() {
return mydata.size();
}
public class MyViewHolder extends RecyclerView.ViewHolder {
private TextView textView;
private ImageView imageView;
public MyViewHolder(@NonNull View itemView) {
super(itemView);
//获取item中的控件id
textView=itemView.findViewById(R.id.text_hhh);
imageView=itemView.findViewById(R.id.image_hhh);
}
}
}1.3 修改tab页面对应的Fragment类
public class Fragmentlx extends Fragment {
//获取recyclerView对象并且实例化适配器
private RecyclerView recyclerView;
private MyAdapter myAdapter;
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
//return inflater.inflate(R.layout.fra_lx, container, false);
View view;
//存所有控件的视图
view=inflater.inflate(R.layout.fra_lx_two, container, false);
//调用recycleview控件
recyclerView=view.findViewById(R.id.recycleView);
//创建数据
String[] names={"爸爸","妈妈","姐姐","弟弟","二叔","张三","李四","王五","刘雯","刘星"};
int[] images={R.drawable.baba,R.drawable.mama,R.drawable.jiejie,R.drawable.didi,R.drawable.ershu,
R.drawable.zs,R.drawable.ls,R.drawable.ww,R.drawable.lw,R.drawable.lx};
String[] phones={"13420827777","13423459999","18920203433","13712930000","13611119898",
"17238389999","17326357489","13482930203","13619872034","18923458976"};
String[] regions={"广东 佛山","广东 佛山","广东 佛山","广东 佛山","广东 佛山","湖北 武汉","湖北 武汉",
"北京","上海","广东 深圳"};
String[] tags={"家人","家人","家人","家人","家人",
"同学","同学","同学","同学","同学"};
List<Map<String,Object>> items=new ArrayList<Map<String,Object>>();
for(int i=0;i<names.length;i++){
Map<String,Object> item=new HashMap<String, Object>();
item.put("i_name",names[i]);
item.put("i_image",images[i]);
item.put("i_phone",phones[i]);
item.put("i_region",regions[i]);
item.put("i_tag",tags[i]);
items.add(item);
}
//创建RecycleView实例和设置Adapter
Context context=getContext();
myAdapter=new MyAdapter(items,context);
LinearLayoutManager manager=new LinearLayoutManager(context);
manager.setOrientation(recyclerView.VERTICAL);
recyclerView.setLayoutManager(manager);
recyclerView.setAdapter(myAdapter);
return view;
}
}1.4 效果如下图：
2 实现点击跳转设计
2.1 添加详情页面布局
2.2 对Adapter类进行修改
主要修改onBindViewHolder方法中的代码：
public void onBindViewHolder(@NonNull MyAdapter.MyViewHolder holder, int position) {
String name=mydata.get(position).get("i_name").toString();
int image=Integer.parseInt(mydata.get(position).get("i_image").toString());
//获取详情页面中某个联系人的对应数据
String phone=mydata.get(position).get("i_phone").toString();
String region=mydata.get(position).get("i_region").toString();
String tag=mydata.get(position).get("i_tag").toString();
holder.textView.setText(name);
holder.imageView.setImageResource(image);
//添加点击事件
holder.textView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//点击后跳转到联系人详情页
Intent intent=new Intent(mycontext,LianxiDetails.class);
//向intent传值
intent.putExtra("details",name);
intent.putExtra("image",image);
intent.putExtra("phone",phone);
intent.putExtra("region",region);
intent.putExtra("tag",tag);
intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
//开始跳转
mycontext.startActivity(intent);
}
});
}2.3 添加详情页面的Activity
public class LianxiDetails extends AppCompatActivity {
TextView dName,textView1,textView2,textView3;
ImageView dImage;
Button button_r;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_lianxi_details);
//获取上一个Actvity传过来的intent
Intent intent=getIntent();
dName=findViewById(R.id.textDetail);
dImage=findViewById((R.id.imageDetail));
//根据intent获取得到的数据设置item控件的值
dImage.setImageResource(intent.getIntExtra("image",R.drawable.wode));
dName.setText(intent.getStringExtra("details"));
textView1=findViewById(R.id.phone);
textView2=findViewById(R.id.region2);
textView3=findViewById(R.id.wxtag2);
textView1.setText(intent.getStringExtra("phone"));
textView2.setText(intent.getStringExtra("region"));
textView3.setText(intent.getStringExtra("tag"));
button_r=findViewById(R.id.returnButton);
}
}2.4 效果如下图
| 点击item | 详情页面 |
 |
 |
| 点击item | 详情页面 |
 |
 |