Android利用ViewPager仿微信主界面-android学习之旅(78)
16lz
2021-01-26
首先是介绍ViewPager这个控件 ,这个控件需要pagerAdapter作为容器来提供数据,同时pagerAdapter的数据源是View数组
效果图如下
部分代码如下,实现如下的方法
mPagerAdapter = new PagerAdapter(){ @Override public int getCount() { return mViews.size(); } @Override public boolean isViewFromObject(View view, Object o) { return view == o; } @Override public Object instantiateItem(ViewGroup container, int position) { View view = mViews.get(position); container.addView(view); return view; } @Override public void destroyItem(ViewGroup container, int position, Object object) { container.removeView(mViews.get(position)); } };View数组就是几个LinearLayout,代码如下
private List<View> mViews = new ArrayList<View>(); View tab01 = inflater.inflate(R.layout.tab01,null); View tab02 = inflater.inflate(R.layout.tab02,null); View tab03 = inflater.inflate(R.layout.tab03,null); View tab04 = inflater.inflate(R.layout.tab04,null); mViews.add(tab01); mViews.add(tab02); mViews.add(tab03); mViews.add(tab04);ViewPager的滑动点击事件
viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() { @Override public void onPageScrolled(int i, float v, int i2) { } @Override public void onPageSelected(int i) { int currentItem = viewPager.getCurrentItem(); resetImg(); switch(currentItem){ case 0: btnWeixin.setImageResource(R.drawable.tab_weixin_pressed); break; case 1: btnFriend.setImageResource(R.drawable.tab_find_frd_pressed); break; case 2: btnAddress.setImageResource(R.drawable.tab_address_pressed); break; case 3: btnSetting.setImageResource(R.drawable.tab_settings_pressed); break; default: break; } } @Override public void onPageScrollStateChanged(int i) { } });仿微信主页面,实现的效果是滑动ViewPager的各个页面之后,下面的图标也是随着相应的界面变亮,然后点击底部,相应的页面也会跳转
点击底部跳转的逻辑在于代码,ViewPager对各个页面是从0开始编号的
viewPager.setCurrentItem(1);布局主要代码
<?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="45dp" android:gravity="center" android:background="@drawable/title_bar"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="微信" android:textColor="#ffffff" android:textSize="20sp" android:layout_gravity="center" android:textStyle="bold"/></LinearLayout><?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="55dp" android:gravity="center" android:background="@drawable/bottom_bar" ><LinearLayout android:id="@+id/tab_weixin" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:gravity="center" android:orientation="vertical" > <ImageButton android:id="@+id/tab_weixin_img" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/tab_weixin_pressed" android:background="#00000000" android:clickable="false" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="微信" android:textColor="#ffffffff"/> </LinearLayout> <LinearLayout android:id="@+id/tab_friend" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:gravity="center" android:orientation="vertical" > <ImageButton android:id="@+id/tab_friend_img" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/tab_find_frd_normal" android:background="#00000000" android:clickable="false" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="朋友" android:textColor="#ffffffff"/> </LinearLayout> <LinearLayout android:id="@+id/tab_address" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:gravity="center" android:orientation="vertical" > <ImageButton android:id="@+id/tab_address_img" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/tab_address_normal" android:background="#00000000" android:clickable="false" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="通讯录" android:textColor="#ffffffff"/> </LinearLayout> <LinearLayout android:id="@+id/tab_setting" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:gravity="center" android:orientation="vertical" > <ImageButton android:id="@+id/tab_setting_img" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/tab_settings_normal" android:background="#00000000" android:clickable="false" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="设置" android:textColor="#ffffffff"/> </LinearLayout></LinearLayout><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:paddingBottom="@dimen/activity_vertical_margin" android:orientation="vertical" > <include layout="@layout/top"/> <android.support.v4.view.ViewPager android:id="@+id/viewPager" android:layout_width="fill_parent" android:layout_height="0dp" android:layout_weight="1"> </android.support.v4.view.ViewPager> <include layout="@layout/bottom"/></LinearLayout>!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
项目源码代码地址是
https://github.com/fengsehng/WeixinTest
更多相关文章
- Android(安卓)Internet应用实现获取天气预报的示例代码
- Android实现ViewPager滑动播放视频，ViewPager+Fragment取消懒加载
- android 菜瓜笔记之GD-GUI逆向代码结构调整
- GPS代码学习---Framework代码学习
- Android中为每个Activity显示自己的标题
- Android(安卓)ListView的OnItemClickListener详解
- android studio 打包webview 5.0文件上传问题
- Android(安卓)OpenGL探索之纯色背景绘制
- Android获取验证码倒计时实现代码