文档章节

Android利用ViewPager仿微信主界面-android学习之旅(78)

fengsehng
 fengsehng
发布于 2016/11/09 09:07
字数 703
阅读 14
收藏 1

首先是介绍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

本文转载自:http://blog.csdn.net/lpjishu/article/details/48143913

共有 人打赏支持
fengsehng
粉丝 4
博文 284
码字总数 214494
作品 0
朝阳
程序员
私信 提问
Android ViewPager使用详解

这是谷歌官方给我们提供的一个兼容低版本安卓设备的软件包,里面包囊了只有在安卓3.0以上可以使用的api。而viewpager就是其中之一利用它,我们可以做很多事情,从最简单的导航,到页面菜单等...

Remix_jx
2014/10/27
0
0
android中ViewPager详解--视图滑动、界面卡等效果 (一)

这是谷歌官方给我们提供的一个兼容低版本安卓设备的软件包,里面包囊了只有在安卓3.0以上可以使用的api。而viewpager就是其中之一。利用它,我们可以做很多事情,从最简单的导航,到页面菜单...

一别经年
2014/01/21
0
0
使用ViewPager+Fragment来实现带滚动条的多屏滑动-IndicatorFragmentActivity

转载请注明出处:http://blog.csdn.net/singwhatiwanna/article/details/17201587 介绍 在android应用中,多屏滑动是一种很常见的风格,博主之前也写过一些多屏滑动的demo,比如滚动banner(...

长平狐
2013/12/25
40.5K
2
Android Tab大总结 Fragment+TabPageIndicator+ViewPager

转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/24740977 Android现在实现Tab类型的界面方式越来越多,今天就把常见的实现方式给大家来个总结。目前写了: 1、传统的V...

JayPark不作死
2014/10/08
0
0
Android中如何使用ViewPager实现类似laucher左右拖动效果

现在很多Android应用在首次安装完都会有指引如何使用该应用的某些功能的指引界面,这样会获得很好的用户体验,能够帮助用户更好使用应用的某些功能。其实该功能和Android主界面的 luncher 的...

MrLovelyCbb
2012/05/07
0
0

没有更多内容

加载失败,请刷新页面

加载更多

python实现下载网络图片

项目需求: 有时候我们做爬虫的时候,需要把爬取到的图片资源保存到我们本地,以防爬取的图片链接被原来资源主人变更,所以就需要把好不容易拿到的资源永久变为自己的,就需要把图片链接下载到我们...

银装素裹
48分钟前
2
0
米利型和摩尔型状态机

1. 经典状态机 x(t)为当前输入 z(t)为当前输出 组合逻辑电路输出s(t+1)为次态 状态寄存器(也就是一组触发器)输出s(t)为现态 2. 米利状态机(Mealy) 组合逻辑C1模块有两个输入端:当前输入x(t...

易冥天
50分钟前
5
0
Kafka是如何解决常见的微服务通信问题的

微服务自成立以来就以不同的方式相互沟通。有些人更喜欢使用HTTP REST API,但这些API有自己的排队问题,而有些则更喜欢较旧的消息队列,比如RabbitMQ,它们带有扩展和操作方面的问题。 以K...

java菜分享
53分钟前
3
0
关于php的xdebug配置(编辑器vscode)

虽然说echo和print_r是公认的最实用的调试工具,但是效率真的没有可视化的直接断点那么高。这里简单介绍如果安装及配置xdebug for vscode 一、PHP环境处的配置 1、编译安装 下载及编译php,因...

元谷
今天
8
0
heartbeat

http://www.linux-ha.org/doc/users-guide/_building_and_installing_heartbeat_from_source.html kaer@linux-sqlf:~/Reusable-Cluster-Components-glue--0a7add1d9996> ./configure --enabl......

李有常
今天
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部