此篇综合运用自定义ActionBar、ContextMenu、PopupWindow、Fragment、ViewPager 以及RecyclerView等实现微信页面效果。
同时这也是中国大学慕课移动终端应用开发的网课作业15，我会持续更新我的作业
说明
说明1
这个说小不小的作品花了我两天的时间，时间花费的颇多。如果我的作品对您有所帮助的话，您的关注或是赞，都是对我的莫大支持。如果引用我的作品，请注明出处。
我尽可能符合了作业的题目要求，但是有些内容由于作业要求的组件或是方法达不到微信的界面效果，我进行相应的替换，在此说明。
说明2
内容较多，我准备分成三篇博客进行叙述分别为：
安卓作业----慕课移动应用开发作业15之模仿实现微信界面效果(一)
安卓作业----慕课移动应用开发作业15之模仿实现微信界面效果(二)
安卓作业----慕课移动应用开发作业15之模仿实现微信界面效果(三)
说明3
此篇是第二篇，主要介绍项目的框架搭建，即包括大体的框架，使得界面有个雏形。fragment具体的实现部分我将放在第三篇博客中
效果图
废话说了那么多，先上效果图，如果各位看官还满意，那就继续读下去吧。
代码部分
有些部分会暂时性报错，但是等把第三篇的代码都放进去，就不会报错了。
1.添加项目依赖
implementation 'com.android.support:design:28.0.0'
implementation 'com.android.support:recyclerview-v7:28.0.0'
2.MainActivity.java
public class MainActivity extends AppCompatActivity {
private MyActionBar mActionBar;
private TabLayout mTabLayout;
private ViewPager mViewPager;
private TabLayout.Tab mTab1,mTab2,mTab3,mTab4;
private ArrayList<Fragment> mFragments;
private MyFragmentAdapter mFragmentAdapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
getSupportActionBar().hide();
init();
FragmentManager fm = getSupportFragmentManager();
//实力化适配器
mFragmentAdapter = new MyFragmentAdapter(fm,0,mFragments);
//设置适配器
mViewPager.setAdapter(mFragmentAdapter);
mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
switch (position){
case 0:
mActionBar.setVisibility(View.VISIBLE);
mActionBar.setTabName("微信");
break;
case 1:
mActionBar.setVisibility(View.VISIBLE);
mActionBar.setTabName("通讯录");
break;
case 2:
mActionBar.setVisibility(View.VISIBLE);
mActionBar.setTabName("发现");
break;
case 3:
mActionBar.setVisibility(View.GONE);
break;
}
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
//设置tab
initTab();
}
private void initTab(){
mTabLayout.setupWithViewPager(mViewPager);
mTabLayout.setSelectedTabIndicator(0);
mTab1 = mTabLayout.getTabAt(0);
mTab2 = mTabLayout.getTabAt(1);
mTab3 = mTabLayout.getTabAt(2);
mTab4 = mTabLayout.getTabAt(3);
mTab1.setCustomView(R.layout.tab1_item);
mTab2.setCustomView(R.layout.tab2_item);
mTab3.setCustomView(R.layout.tab3_item);
mTab4.setCustomView(R.layout.tab4_item);
}
private void init(){
mFragments = new ArrayList<>();
mFragments.add(new Tab1Fragment(MainActivity.this));
mFragments.add(new Tab2Fragment(MainActivity.this));
mFragments.add(new Tab3Fragment(MainActivity.this));
mFragments.add(new Tab4Fragment(MainActivity.this));
mActionBar = findViewById(R.id.my_action_bar);
mActionBar.setTabName("微信");//初始标题为微信
mViewPager = findViewById(R.id.my_view_page);
mTabLayout = findViewById(R.id.my_tab_layout);
}
}
3.主布局文件 activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:tools="http://schemas.android.com/tools"
tools:context="com.example.course15.MainActivity"
android:orientation="vertical">
<com.example.course15.layouts.MyActionBar
android:id="@+id/my_action_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#eee"
android:orientation="vertical">
<androidx.viewpager.widget.ViewPager
android:id="@+id/my_view_page"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#ccc"/>
<com.google.android.material.tabs.TabLayout
android:paddingTop="5dp"
android:paddingBottom="5dp"
android:id="@+id/my_tab_layout"
android:background="#eee"
android:layout_width="match_parent"
android:layout_height="55dp" />
</LinearLayout>
</LinearLayout>
4.自定义actionBar MyActionBar.java
public class MyActionBar extends RelativeLayout {
private View mView;//标题栏
private View mViewMenuWindow;//点击menu后出来的弹窗
private TextView mTextViewTabName;
private ImageView mImageViewFind,mImageViewMenu;
private Context mContext;
private PopupWindow mPopupWindow;
private LinearLayout mLayout1,mLayout2,mLayout3,mLayout4,mLayout5;
public MyActionBar(Context context) {
super(context);
this.mContext = context;
init(context);
}
public MyActionBar(Context context, AttributeSet attrs) {
super(context, attrs);
this.mContext = context;
init(context);
}
private void init(Context context){
LayoutInflater inflater = LayoutInflater.from(context);
mView = inflater.inflate(R.layout.my_action_bar_layout, null);
addView(mView);
initView();
}
//初始化页面布局元素
private void initView(){
mTextViewTabName = mView.findViewById(R.id.text_tab_name);
mImageViewFind = mView.findViewById(R.id.image_find);
mImageViewMenu = mView.findViewById(R.id.image_menu);
mImageViewFind.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
closeMenuWindow();
Toast.makeText(mContext,"点击了发现",Toast.LENGTH_SHORT).show();
}
});
mImageViewMenu.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
showMenuWindow();
}
});
}
/**
* 暴露出去的方法，设置自定义bar的标题
* */
public void setTabName(String name){
mTextViewTabName.setText(name);
}
/**
* 关闭子菜单
* */
public void closeMenuWindow(){
if (mPopupWindow!=null){
mPopupWindow.dismiss();
}
}
/**
* 显示子菜单
* */
private void showMenuWindow(){
mViewMenuWindow = LayoutInflater.from(mContext).inflate(R.layout.menu_window_layout,null);
initLayout();
mPopupWindow = new PopupWindow(mViewMenuWindow);
mPopupWindow.setWidth(400);
mPopupWindow.setHeight(580);
mPopupWindow.showAsDropDown(mImageViewMenu);
}
/**
* 初始化子菜单的布局元素
* */
private void initLayout(){
mLayout1 = mViewMenuWindow.findViewById(R.id.menu_item1);
mLayout2 = mViewMenuWindow.findViewById(R.id.menu_item2);
mLayout3 = mViewMenuWindow.findViewById(R.id.menu_item3);
mLayout4 = mViewMenuWindow.findViewById(R.id.menu_item4);
mLayout5 = mViewMenuWindow.findViewById(R.id.menu_item5);
mLayout1.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(mContext,"发起群聊",Toast.LENGTH_SHORT).show();
mPopupWindow.dismiss();
}
});
mLayout2.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(mContext,"添加朋友",Toast.LENGTH_SHORT).show();
mPopupWindow.dismiss();
}
});
mLayout3.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(mContext,"扫一扫",Toast.LENGTH_SHORT).show();
mPopupWindow.dismiss();
}
});
mLayout4.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(mContext,"收付款",Toast.LENGTH_SHORT).show();
mPopupWindow.dismiss();
}
});
mLayout5.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(mContext,"帮助与反馈",Toast.LENGTH_SHORT).show();
mPopupWindow.dismiss();
}
});
}
}
5.自定义actionBar布局 my_action_bar_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ddd">
<TextView
android:id="@+id/text_tab_name"
android:text="微信"
android:textSize="20dp"
android:textColor="#000"
android:paddingTop="10dp"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:layout_width="wrap_content"
android:layout_height="45dp"/>
<ImageView
android:id="@+id/image_find"
android:src="@drawable/find"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_centerVertical="true"
android:layout_toLeftOf="@id/image_menu"
android:layout_marginRight="30dp"/>
<ImageView
android:id="@+id/image_menu"
android:src="@drawable/add"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="20dp"/>
</RelativeLayout>
6.自定义popupwindow布局 menu_window_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="120dp"
android:layout_height="300dp"
android:background="@drawable/background2">
<LinearLayout
android:id="@+id/menu_item1"
style="@style/menu_layout1">
<ImageView
android:src="@drawable/img1"
style="@style/menu_image"/>
<TextView
android:text="发起群聊"
style="@style/menu_text"/>
</LinearLayout>
<LinearLayout
android:id="@+id/menu_item2"
style="@style/menu_layout1">
<ImageView
android:src="@drawable/img2"
style="@style/menu_image"/>
<TextView
android:text="添加朋友"
style="@style/menu_text"/>
</LinearLayout>
<LinearLayout
android:id="@+id/menu_item3"
style="@style/menu_layout1">
<ImageView
android:src="@drawable/img3"
style="@style/menu_image"/>
<TextView
android:text="扫一扫"
style="@style/menu_text"/>
</LinearLayout>
<LinearLayout
android:id="@+id/menu_item4"
style="@style/menu_layout1">
<ImageView
android:src="@drawable/img4"
style="@style/menu_image"/>
<TextView
android:text="收付款"
style="@style/menu_text"/>
</LinearLayout>
<LinearLayout
android:id="@+id/menu_item5"
style="@style/menu_layout1"
android:paddingBottom="-10dp">
<ImageView
android:src="@drawable/img5"
style="@style/menu_image"/>
<TextView
android:text="帮助与反馈"
style="@style/menu_text"/>
</LinearLayout>
</LinearLayout>
7.Tab1Fragment.java
public class Tab1Fragment extends Fragment {
private RecyclerView mRecyclerView;
private ChatAdapter mChatAdapter;
private ArrayList<ChatMsg> mChatMsgs;
private Context mContext;
private String TAG = "Tab1FragmentTag";
public Tab1Fragment(Context context) {
// Required empty public constructor
this.mContext = context;
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.tab1_layout,container,false);
initChatMsg();
mRecyclerView = v.findViewById(R.id.recycle_view_chat);
mRecyclerView.setLayoutManager(new LinearLayoutManager(mContext));
mChatAdapter = new ChatAdapter(mContext,mChatMsgs);
mRecyclerView.setAdapter(mChatAdapter);
return v;
}
private void initChatMsg(){
mChatMsgs = new ArrayList<>();
mChatMsgs.add(new ChatMsg("小明1","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明2","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明3","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明4","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明5","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明6","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明7","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明8","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明9","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明10","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明11","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明12","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明13","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明14","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明15","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明16","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明17","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明18","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明19","今晚打老虎"));
mChatMsgs.add(new ChatMsg("小明20","今晚打老虎"));
}
@Override
public boolean onContextItemSelected(@NonNull MenuItem item) {
switch (item.getItemId()){
case R.id.item1_toFirst:
mChatAdapter.toFirstItem(mChatAdapter.getPosition());
case R.id.item2_delete:
mChatAdapter.deleteItem(mChatAdapter.getPosition());
}
return super.onContextItemSelected(item);
}
}
8.Tab1Fragment 对应布局 tab1_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.recyclerview.widget.RecyclerView
android:background="#fff"
android:id="@+id/recycle_view_chat"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</RelativeLayout>
9.Tab2Fragment.java
public class Tab2Fragment extends Fragment {
private Context mContext;
private RecyclerView mRecyclerView; //定义recycle view
private ContactAdapter mContactAdapter; //定义适配器
private ContactItemDecoration mContactItemDecoration; //定义装饰
private ArrayList<ContactMsg> mContactMsgs; //定义数据
public Tab2Fragment(Context context) {
// Required empty public constructor
mContext = context;
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.tab2_layout,container,false);
initData();
mRecyclerView = v.findViewById(R.id.recycler_view_contact);
mRecyclerView.setLayoutManager(new LinearLayoutManager(mContext));
mContactAdapter = new ContactAdapter(mContext,mContactMsgs);
mRecyclerView.setAdapter(mContactAdapter);
mContactItemDecoration = new ContactItemDecoration(mContext,mContactMsgs);
mRecyclerView.addItemDecoration(mContactItemDecoration);
return v;
}
private void initData(){
mContactMsgs = new ArrayList<>();
mContactMsgs.add(new ContactMsg("0",R.drawable.contact_img1,"新的朋友"));
mContactMsgs.add(new ContactMsg("0",R.drawable.contact_img2,"群聊"));
mContactMsgs.add(new ContactMsg("0",R.drawable.contact_img3,"标签"));
mContactMsgs.add(new ContactMsg("0",R.drawable.contact_img4,"公众号"));
mContactMsgs.add(new ContactMsg("A","爱丽丝"));
mContactMsgs.add(new ContactMsg("A","爱德华"));
mContactMsgs.add(new ContactMsg("A","爱马仕"));
mContactMsgs.add(new ContactMsg("B","贝多芬"));
mContactMsgs.add(new ContactMsg("C","蔡徐坤"));
mContactMsgs.add(new ContactMsg("C","晨光文具店"));
mContactMsgs.add(new ContactMsg("D","冬冬"));
mContactMsgs.add(new ContactMsg("D","冬兵的机械臂"));
mContactMsgs.add(new ContactMsg("D","东北大哥"));
mContactMsgs.add(new ContactMsg("D","东北水饺老板"));
mContactMsgs.add(new ContactMsg("F","福禄娃"));
mContactMsgs.add(new ContactMsg("H","荷马"));
mContactMsgs.add(new ContactMsg("H","黄飞鸿"));
mContactMsgs.add(new ContactMsg("K","可口可乐"));
mContactMsgs.add(new ContactMsg("K","柯南"));
mContactMsgs.add(new ContactMsg("M","杭州马爸爸"));
mContactMsgs.add(new ContactMsg("M","深圳马爸爸"));
mContactMsgs.add(new ContactMsg("Q","擎天柱"));
}
}
10.Tab2Fragment 对应布局 tab2_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.recyclerview.widget.RecyclerView
android:background="#fff"
android:id="@+id/recycler_view_contact"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</RelativeLayout>
11.Tab3Fragment.java
public class Tab3Fragment extends Fragment {
private Context mContext;
private RecyclerView mRecyclerView; //定义recycle view
private FindAdapter mFindAdapter; //定义适配器
private FindItemDecoration mFindItemDecoration; //定义装饰
private ArrayList<FindMsg> mFindMsgs; //定义数据
public Tab3Fragment(Context context) {
// Required empty public constructor
mContext = context;
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.tab3_layout,container,false);
initData();
mRecyclerView = v.findViewById(R.id.recycler_view_find);
mRecyclerView.setLayoutManager(new LinearLayoutManager(mContext));
mFindAdapter = new FindAdapter(mContext,mFindMsgs);
mRecyclerView.setAdapter(mFindAdapter);
mFindItemDecoration = new FindItemDecoration(mContext,mFindMsgs);
mRecyclerView.addItemDecoration(mFindItemDecoration);
return v;
}
private void initData(){
mFindMsgs = new ArrayList<>();
mFindMsgs.add(new FindMsg(0,R.drawable.find_img1,"朋友圈"));
mFindMsgs.add(new FindMsg(1,R.drawable.find_img2,"扫一扫"));
mFindMsgs.add(new FindMsg(1,R.drawable.find_img3,"摇一摇"));
mFindMsgs.add(new FindMsg(2,R.drawable.find_img4,"看一看"));
mFindMsgs.add(new FindMsg(2,R.drawable.find_img5,"搜一搜"));
mFindMsgs.add(new FindMsg(3,R.drawable.find_img6,"附近的人"));
mFindMsgs.add(new FindMsg(4,R.drawable.find_img7,"购物"));
mFindMsgs.add(new FindMsg(4,R.drawable.find_img8,"游戏"));
mFindMsgs.add(new FindMsg(5,R.drawable.find_img9,"小程序"));
}
}
12.Tab3Fragment 对应布局 tab3_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#eee">
<androidx.recyclerview.widget.RecyclerView
android:background="#fff"
android:id="@+id/recycler_view_find"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</RelativeLayout>
13.Tab4Fragment.java
public class Tab4Fragment extends Fragment {
private Context mContext;
private RecyclerView mRecyclerView; //定义recycle view
private FindAdapter mFindAdapter; //定义适配器
private FindItemDecoration mFindItemDecoration; //定义装饰
private ArrayList<FindMsg> mFindMsgs; //定义数据
public Tab4Fragment(Context context) {
// Required empty public constructor
mContext = context;
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.tab4_layout,container,false);
initData();
mRecyclerView = v.findViewById(R.id.recycle_view_me);
mRecyclerView.setLayoutManager(new LinearLayoutManager(mContext));
mFindAdapter = new FindAdapter(mContext,mFindMsgs);
mRecyclerView.setAdapter(mFindAdapter);
mFindItemDecoration = new FindItemDecoration(mContext,mFindMsgs);
mRecyclerView.addItemDecoration(mFindItemDecoration);
return v;
}
private void initData(){
mFindMsgs = new ArrayList<>();
mFindMsgs.add(new FindMsg(1,R.drawable.me_img1,"支付"));
mFindMsgs.add(new FindMsg(2,R.drawable.me_img2,"收藏"));
mFindMsgs.add(new FindMsg(2,R.drawable.me_img3,"相册"));
mFindMsgs.add(new FindMsg(2,R.drawable.me_img4,"卡包"));
mFindMsgs.add(new FindMsg(2,R.drawable.me_img5,"表情"));
mFindMsgs.add(new FindMsg(3,R.drawable.me_img6,"设置"));
}
}
14.Tab4Fragment 对应布局 tab4_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#eee">
<RelativeLayout
android:background="#fff"
android:layout_width="match_parent"
android:layout_height="25dp">
<ImageView
android:layout_alignParentRight="true"
android:layout_marginTop="5dp"
android:layout_marginRight="10dp"
android:src="@drawable/me_camera"
android:layout_width="25dp"
android:layout_height="25dp"/>
</RelativeLayout>
<LinearLayout
android:background="#fff"
android:layout_width="match_parent"
android:layout_height="120dp"
android:orientation="horizontal">
<RelativeLayout
android:layout_marginLeft="10dp"
android:layout_width="100dp"
android:layout_height="100dp">
<ImageView
android:src="@drawable/me_head"
android:layout_centerInParent="true"
android:layout_width="65dp"
android:layout_height="65dp">
</ImageView>
</RelativeLayout>
<RelativeLayout
android:layout_marginLeft="5dp"
android:layout_width="0dp"
android:layout_height="100dp"
android:layout_weight="1">
<TextView
android:id="@+id/text_chat_title"
android:layout_width="wrap_content"
android:layout_marginTop="20dp"
android:text="Hobwards"
android:textSize="22dp"
android:textColor="#000"
android:layout_height="wrap_content"/>
<TextView
android:id="@+id/text_chat_content"
android:layout_marginTop="10dp"
android:layout_below="@id/text_chat_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="微信号：000000x"
android:textSize="12dp"
android:textColor="#999"/>
<ImageView
android:layout_alignParentRight="true"
android:layout_marginTop="60dp"
android:layout_marginRight="40dp"
android:src="@drawable/me_2d"
android:layout_width="15dp"
android:layout_height="15dp"/>
<ImageView
android:layout_marginRight="10dp"
android:layout_alignParentRight="true"
android:layout_marginTop="60dp"
android:src="@drawable/right"
android:layout_width="15dp"
android:layout_height="15dp"/>
</RelativeLayout>
</LinearLayout>
<androidx.recyclerview.widget.RecyclerView
android:background="#fff"
android:id="@+id/recycle_view_me"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
15.在res目录下新建color目录
tab_text_color_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_selected="true" android:color="#4CAF50" />
<item android:color="#333"/>
</selector>
16.在res目录下的drawable目录下新建四个图片选择文件tab1_selector.xml,tab2_selector.xml,tab3_selector.xml,tab4_selector.xml
内容都是差不多的，只写一个
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_selected="true"
android:drawable="@drawable/tab1_2"/>
<item android:drawable="@drawable/tab1_1"/>
</selector>
17.写tab的布局文件
也是四个，命名格式也是一样的，只写其中一个
tab1_item.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="@drawable/tab1_selector"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_centerHorizontal="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
android:text="微信"
android:textSize="12dp"
android:textColor="@color/tab_text_color_selector"/>
</RelativeLayout>
18.Fragment适配器 MyFragmentAdapter.java
public class MyFragmentAdapter extends FragmentPagerAdapter {
ArrayList<Fragment> mFragments;
public MyFragmentAdapter(@NonNull FragmentManager fm, int behavior) {
super(fm, behavior);
}
public MyFragmentAdapter(@NonNull FragmentManager fm, int behavior, ArrayList<Fragment> fragments) {
super(fm, behavior);
mFragments = fragments;
}
@NonNull
@Override
public Fragment getItem(int position) {
return mFragments.get(position);
}
@Override
public int getCount() {
return mFragments.size();
}
}
总结
如果有什么问题，请私信联系我或者在评论区留言
码字不易，若有帮助，给个关注和赞呗
原创文章 49
获赞 123
访问量 2万+