android仿微信demo————微信发现界⾯实现
⽂章⽬录
在前⾯的⽂章⾥实现了微信消息,通讯录界⾯,它们的都需要在服务器中动态获取,⽽这⼀篇主要实现发现界⾯的实现,由于数据不需要从服务器中获取(静态的),所有实现相对⽐较简单
微信发现界⾯实现
微信发现界⾯跟之前的两个界⾯是⼀样的都是listview(微信消息,通讯录界⾯),那么既然是listview,⽆⾮就是给listview⼀个布局,然后再fragmeng中初始化数据,并设置⼀个适配器,但是我们观察微信,会发现微信发现界⾯有不同的分割线,如下
那么要怎么实现呢?很简单,细的分割线我们可以再ListView组件上添加分割线的属性来指定⾃定义的分割线,粗的分割条只需再ListView 对应的布局上添加⼀个View组件来填充即可,那么问题来了,我们怎么知道要⽤细的,还是粗的分割线呢?可以在适配器上进⾏判断
在find_fragment布局⽂件添加如下代码
l
<LinearLayout android="/apk/res/android"
layout_width="match_parent"
layout_height="match_parent"
background="#E0E0E0">
<ListView
id="@+id/listView"
layout_width="match_parent"
layout_height="wrap_content"
background="@color/white"
divider="@drawable/find_list_divider_line"
dividerHeight="1.5px"/>
</LinearLayout>
上⾯代码在fragment布局中添加⼀个listview,并给listview设置⾃定义的分割线,下⾯给出
创建⾃定义分割线find_list_l
find_list_l
<?xml version="1.0" encoding="utf-8"?>
<layer-list android="/apk/res/android">
<item
left="55dp"
right="0dp">
<shape shape="rectangle">
<solid color="#33000000"/>
</shape>
</item>
</layer-list>
诗歌意象layer-list⽂件创建在之前的⽂章已经演⽰过,就不再演⽰了
创建listview对应的item布局
l
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android="/apk/res/android"
layout_width="match_parent"
layout_height="match_parent"
orientation="vertical">
<LinearLayout
也英语layout_width="match_parent"
layout_height="wrap_content"
orientation="horizontal">
<ImageView
id="@+id/pic"
layout_width="wrap_content"
layout_height="match_parent"
padding="10dp"/>
<TextView
id="@+id/title"
layout_width="wrap_content"
layout_height="match_parent"
gravity="center_vertical"
padding="10dp"
textColor="#336598"
textSize="16sp"/>
<View
id="@+id/fill"
layout_width="180dp"
layout_height="match_parent"/>
<ImageView
id="@+id/pic1"
layout_width="wrap_content"
layout_height="match_parent"
src="@drawable/tab_ttings_presd"/>
</LinearLayout>
<View
id="@+id/divider"
layout_width="match_parent"
layout_height="8dp"
background="#E0E0E0"/>
<View
id="@+id/divider1"
layout_width="match_parent"
layout_height="63dp"
background="#E0E0E0"/>
</LinearLayout>
上⾯布局除了包括每⼀个列表需要的图⽚,⽂字组件外,还包括了View组件实现不同的分割线(在适配器进⾏判断该不该显⽰)
修改fragment.java代码
ample.wxchatdemo;
import android.app.Fragment;
英语拼写import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ListView;
ample.wxchatdemo.adapter.findSortAdapter;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
public class FindFragment extends Fragment {
/* 声明组件*/
private ListView listView;
//定义⼀个map集合存放数据
private List<Map<String,String>> list =new ArrayList<>();
//准备图⽚
cmdprivate int[] pic =new int[]{
R.drawable.friend_img,R.drawable.video_img,
R.drawable.scan_img,R.drawable.shark_img,
R.drawable.look_img,R.drawable.arch_img,
语文学习的重要性R.drawable.direct_eding_img,R.drawable.shopping_img,
R.drawable.game_img,R.drawable.small_routine_img,
};
//准备⽂字
private String data[]=new String[]
{"朋友圈 ","视频号 ","扫⼀扫 ",
"摇⼀摇 ","看⼀看 ","搜⼀搜 ",
"直播和附近","购物 ","游戏 ","⼩程序 "};
//准备图⽚
private int[] pic1 =new int[]{
R.drawable.tab_img,R.drawable.tab_img,R.drawable.tab_img,R.drawable.tab_img,
R.drawable.tab_img,R.drawable.tab_img,R.drawable.tab_img,R.drawable.tab_img,
R.drawable.tab_img,R.drawable.tab_img
};
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState){
View view = inflater.inflate(R.layout.find_fragment, container,fal);
/*初始化组件*/
listView =(ListView) view.findViewById(R.id.listView);
//初始化数据
initData();
/*创建⾃定义适配器,并设置给listview*/
findSortAdapter adapter =new findSortAdapter(getActivity().getApplicationContext(), list);
listView.tAdapter(adapter);
return view;
}
private void initData(){
for(int i=0;i<data.length;i++){
Map<String,String> map =new HashMap<>();
map.put("pic",String.valueOf(pic[i]));
map.put("title",data[i]);
map.put("pic1",String.valueOf(pic1[i]));
list.add(map);//将map放到list集合中
}
}
}
上⾯代码主要就是准备图⽚和⽂字,并进⾏初始化组件,然后把图⽚和⽂字封装在集合⾥传给适配器再设置给listview
右下腹部隐痛
在上⾯说过,显⽰不同分割线是在适配器上进⾏判断的,所有我们要⾃定义⼀个适配器并继承BaAdapter 创建⾃定义适配器findSortAdapter.java
findSortAdapter.java
ample.wxchatdemo.adapter;
t.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaAdapter;
import android.widget.ImageView;
虎皮鸡蛋import android.widget.TextView;
ample.wxchatdemo.R;
import java.util.List;
import java.util.Map;
public class findSortAdapter extends BaAdapter{
private ViewHolder viewHolder;
private List<Map<String, String>> data = null;
private Context mContext;
public findSortAdapter(Context mContext, List<Map<String, String>> data){
this.mContext = mContext;
this.data = data;
}
public int getCount(){
return this.data.size();
}
public Object getItem(int position){
(position);
}
public long getItemId(int position){
return position;
}
public View getView(final int position, View view, ViewGroup arg2){
if(view == null){
viewHolder =new ViewHolder();
//获取listview对应的item布局
view = LayoutInflater.from(mContext).inflate(R.layout.find_item, null);
//初始化组件
viewHolder.pic =(ImageView) view.findViewById(R.id.pic);
viewHolder.title =(TextView) view.findViewById(R.id.title);
viewHolder.pic1 =(ImageView) view.findViewById(R.id.pic1);
viewHolder.divider =(View) view.findViewById(R.id.divider);
viewHolder.divider1 =(View) view.findViewById(R.id.divider1);
河虾做法
view.tTag(viewHolder);
}el{
viewHolder =(ViewHolder) Tag();
}
if(position ==0|| position ==1|| position ==3|| position ==5||
position ==6|| position ==8){
Map<String, String> map = (position);
viewHolder.pic.tImageResource(Integer.("pic")));
viewHolder.title.("title"));
viewHolder.pic1.tImageResource(Integer.("pic1")));
viewHolder.divider.tVisibility(View.VISIBLE);