3种方式实现可滑动的Tab

1. 第一种，使用 TabHost + ViewPager 实现

该方法会有一个Bug，当设置tabHost.setCurrentTab()为0时，ViewPager不显示（准确的说是加载），只有点击其他任意一个tab后才会加载。

有解的同学吼一声~~~~~~~

Activity:

package com.swordy.demo.android.fragment;

import java.util.Random;

import android.os.Bundle;

import android.support.v4.app.Fragment;

import android.support.v4.app.FragmentActivity;

import android.support.v4.app.FragmentManager;

import android.support.v4.app.FragmentStatePagerAdapter;

import android.support.v4.view.PagerAdapter;

import android.support.v4.view.ViewPager;

import android.support.v4.view.ViewPager.OnPageChangeListener;

import android.view.LayoutInflater;

import android.view.View;

import android.view.View.OnClickListener;

import android.view.ViewGroup;

import android.widget.TabHost;

import android.widget.TabHost.OnTabChangeListener;

import android.widget.TabWidget;

import android.widget.TextView;

import com.swordy.demo.android.R;

import com.swordy.library.android.util.ELog;

/**

 * 1. 使用TabHost和ViewPager组合实现一个可以滑动的tab

 * 2. bug：如果当前页为0，则ViewPager第一次不加载。

 *

 * @author swordy

 * @email mryangjian@live.com

 * @since Jan 20, 2014

 * @version 1.0

 */

public class SlideTabs1 extends FragmentActivity

{

    private static final String TAG = "AndroidDemos.SlideTabs1";

    private TabHost mTabHost;

    private ViewPager mViewPager;

    private PagerAdapter mPagerAdapter;

    private String[] addresses = { "first", "second", "third" };

    @Override

    protected void onCreate(Bundle arg0)

    {

        super.onCreate(arg0);

        setContentView(R.layout.fragment_slidetabs1);

        mViewPager = (ViewPager) findViewById(R.id.viewPager1);

        mPagerAdapter = new MyPagerAdapter(getSupportFragmentManager());

        mViewPager.setAdapter(mPagerAdapter);

        mTabHost = (TabHost) findViewById(android.R.id.tabhost);

        mTabHost.setup();

        mTabHost.addTab(mTabHost.newTabSpec("one").setIndicator("one-1")

                .setContent(R.id.viewPager1));

        mTabHost.addTab(mTabHost.newTabSpec("two").setIndicator("two-2")

                .setContent(R.id.viewPager1));

        mTabHost.addTab(mTabHost.newTabSpec("three").setIndicator("three-3")

                .setContent(R.id.viewPager1));

        TabWidget tabWidget = mTabHost.getTabWidget();

        int count = tabWidget.getChildCount();

        for (int i = 0; i != count; i++)

        {

            final int index = i;

            tabWidget.getChildAt(i).setOnClickListener(new OnClickListener() {

                @Override

                public void onClick(View v)

                {

                    mTabHost.setCurrentTab(index);

                    mViewPager.setCurrentItem(index);

                }

            });

        }

        mTabHost.setOnTabChangedListener(new OnTabChangeListener() {

            @Override

            public void onTabChanged(String tabId)

            {

                ELog.i(TAG, "@--> onTabChanged by tabId: " + tabId);

            }

        });

        mViewPager.setOnPageChangeListener(new OnPageChangeListener() {

            @Override

            public void onPageSelected(int arg0)

            {

                ELog.i(TAG, "@--> onPageSelected: " + arg0);

                mTabHost.setCurrentTab(arg0);

            }

            @Override

            public void onPageScrolled(int arg0, float arg1, int arg2)

            {

            }

            @Override

            public void onPageScrollStateChanged(int arg0)

            {

            }

        });

    }

    private class MyPagerAdapter extends FragmentStatePagerAdapter

    {

        public MyPagerAdapter(FragmentManager fm)

        {

            super(fm);

        }

        @Override

        public Fragment getItem(int position)

        {

            ELog.i(TAG, "@--> getItem by position" + position);

            ELog.i(TAG, "@--> getItem by position" + position);

            return MyFragment.create(addresses[position]);

        }

        @Override

        public int getCount()

        {

            return addresses.length;

        }

    }

    public static class MyFragment extends Fragment

    {

        public static MyFragment create(String address)

        {

            ELog.i(TAG, "@--> MyFragment.create()");

            MyFragment f = new MyFragment();

            Bundle b = new Bundle();

            b.putString("address", address);

            f.setArguments(b);

            return f;

        }

        @Override

        public View onCreateView(LayoutInflater inflater, ViewGroup container,

                Bundle savedInstanceState)

        {

            Random r = new Random(System.currentTimeMillis());

            Bundle b = getArguments();

            View v = inflater.inflate(R.layout.fragment_viewpager1_layout1, null);

            v.setBackgroundColor(r.nextInt() >> 8 | 0xFF << 24);

            TextView txvAddress = (TextView) v.findViewById(R.id.textView1);

            txvAddress.setTextColor(r.nextInt() >> 8 | 0xFF << 24);

            txvAddress.setBackgroundColor(r.nextInt() >> 8 | 0xFF << 24);

            txvAddress.setText(b.getString("address", ""));

            return v;

        }

    }

}

布局：

<?xml version="1.0" encoding="utf-8"?>

<TabHost xmlns:android="http://schemas.android.com/apk/res/android"

    android:id="@android:id/tabhost"

    android:layout_width="match_parent"

    android:layout_height="match_parent" >

    <LinearLayout

        android:layout_width="match_parent"

        android:layout_height="match_parent"

        android:orientation="vertical" >

        <TabWidget

            android:id="@android:id/tabs"

            android:layout_width="match_parent"

            android:layout_height="wrap_content"

            android:gravity="right|center_vertical" />

        <FrameLayout

            android:id="@android:id/tabcontent"

            android:layout_width="match_parent"

            android:layout_height="match_parent" >

            <android.support.v4.view.ViewPager

                android:id="@+id/viewPager1"

                android:layout_width="match_parent"

                android:layout_height="match_parent" />

        </FrameLayout>

    </LinearLayout>

</TabHost>

2. 第二种，使用官方提供的方法 ActionBar + ViewPager 实现

原文地址：http://developer.android.com/training/implementing-navigation/lateral.html

该方法有两个缺陷，或者说不是缺陷，只是我没有找到解决的办法。

第一，tab点上不是很灵敏，可能就是这么设定的，为了防止频繁加载吧，但是体验稍稍不爽；

第二，ActionBar在最顶部，如果我的布局是：顶部一个带返回按钮的标题栏，中间是tab，底部是tabcontent，怎么搞？

Activity：

package com.swordy.demo.android.fragment;

import java.util.Random;

import android.app.ActionBar;

import android.app.ActionBar.Tab;

import android.app.ActionBar.TabListener;

import android.os.Bundle;

import android.support.v4.app.Fragment;

import android.support.v4.app.FragmentActivity;

import android.support.v4.app.FragmentManager;

import android.support.v4.app.FragmentPagerAdapter;

import android.support.v4.view.ViewPager;

import android.support.v4.view.ViewPager.OnPageChangeListener;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.TextView;

import com.swordy.demo.android.R;

/**

 * 1. 使用ActionBar和ViewPager实现可以滑动的Tab

 *

 * @author swordy

 * @email mryangjian@live.com

 * @since Jan 20, 2014

 * @version 1.0

 */

public class SlideTabs2 extends FragmentActivity

{

    private static final String TAG = "AndroidDemos.SlideTabs2";

    private ViewPager mViewPager;

    private ActionBar mActionBar;

    private MyPagerAdapter mPagerAdapter;

    private String[] addresses = { "first", "second", "third" };

    private Tab[] mTabs = new Tab[addresses.length];

    @Override

    protected void onCreate(Bundle savedInstanceState)

    {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.fragment_viewpager1);

        mViewPager = (ViewPager) findViewById(R.id.viewPager1);

        mPagerAdapter = new MyPagerAdapter(getSupportFragmentManager());

        mViewPager.setAdapter(mPagerAdapter);

        mViewPager.setOnPageChangeListener(mPageChangeListener);

        mActionBar = getActionBar();

        mActionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);

        mActionBar.setDisplayShowTitleEnabled(false);

        mActionBar.setDisplayShowHomeEnabled(false);

        for (int i = 0; i != addresses.length; i++)

        {

            mTabs[i] = mActionBar.newTab().setText(addresses[i]).setTabListener(mTabListener);

            mActionBar.addTab(mTabs[i]);

        }

    }

    private OnPageChangeListener mPageChangeListener = new OnPageChangeListener() {

        @Override

        public void onPageSelected(int arg0)

        {

            mActionBar.setSelectedNavigationItem(arg0);

        }

        @Override

        public void onPageScrolled(int arg0, float arg1, int arg2)

        {

        }

        @Override

        public void onPageScrollStateChanged(int arg0)

        {

        }

    };

    private TabListener mTabListener = new TabListener() {

        @Override

        public void onTabSelected(Tab tab, android.app.FragmentTransaction ft)

        {

            if (tab == mTabs[0])

            {

                mViewPager.setCurrentItem(0);

            } else if (tab == mTabs[1])

            {

                mViewPager.setCurrentItem(1);

            } else if (tab == mTabs[2])

            {

                mViewPager.setCurrentItem(2);

            }

        }

        @Override

        public void onTabUnselected(Tab tab, android.app.FragmentTransaction ft)

        {

            // TODO Auto-generated method stub

        }

        @Override

        public void onTabReselected(Tab tab, android.app.FragmentTransaction ft)

        {

            // TODO Auto-generated method stub

        }

    };

    public class MyPagerAdapter extends FragmentPagerAdapter

    {

        public MyPagerAdapter(FragmentManager fm)

        {

            super(fm);

        }

        @Override

        public Fragment getItem(int position)

        {

            return MyFragment.create(addresses[position]);

        }

        @Override

        public int getCount()

        {

            return addresses.length;

        }

    }

    public static class MyFragment extends Fragment

    {

        public static MyFragment create(String address)

        {

            MyFragment f = new MyFragment();

            Bundle b = new Bundle();

            b.putString("address", address);

            f.setArguments(b);

            return f;

        }

        @Override

        public View onCreateView(LayoutInflater inflater, ViewGroup container,

                Bundle savedInstanceState)

        {

            Random r = new Random(System.currentTimeMillis());

            Bundle b = getArguments();

            View v = inflater.inflate(R.layout.fragment_viewpager1_layout1, null);

            v.setBackgroundColor(r.nextInt() >> 8 | 0xFF << 24);

            TextView txvAddress = (TextView) v.findViewById(R.id.textView1);

            txvAddress.setTextColor(r.nextInt() >> 8 | 0xFF << 24);

            txvAddress.setBackgroundColor(r.nextInt() >> 8 | 0xFF << 24);

            txvAddress.setText(b.getString("address", ""));

            return v;

        }

    }

}

布局：

<?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"

    android:orientation="vertical" >

    <android.support.v4.view.ViewPager

        android:id="@+id/viewPager1"

        android:layout_width="match_parent"

        android:layout_height="match_parent" />

</LinearLayout>

3. 【推荐】第三种，使用 TabWidget + ViewPager 实现

该方法不错，推荐使用。

Activity：

package com.swordy.demo.android.fragment;

import java.util.Random;

import android.os.Bundle;

import android.support.v4.app.Fragment;

import android.support.v4.app.FragmentActivity;

import android.support.v4.app.FragmentManager;

import android.support.v4.app.FragmentStatePagerAdapter;

import android.support.v4.view.PagerAdapter;

import android.support.v4.view.ViewPager;

import android.support.v4.view.ViewPager.OnPageChangeListener;

import android.view.LayoutInflater;

import android.view.View;

import android.view.View.OnClickListener;

import android.view.ViewGroup;

import android.widget.Button;

import android.widget.TabWidget;

import android.widget.TextView;

import com.swordy.demo.android.R;

/**

 * 1. 使用TabWidget和ViewPager实现可滑动的Tab

 *

 * @author swordy

 * @email mryangjian@live.com

 * @since Jan 20, 2014

 * @version 1.0

 */

public class SlideTabs3 extends FragmentActivity

{

    private static final String TAG = "AndroidDemos.SlideTabs3";

    private ViewPager mViewPager;

    private PagerAdapter mPagerAdapter;

    private TabWidget mTabWidget;

    private String[] addresses = { "first", "second", "third" };

    private Button[] mBtnTabs = new Button[addresses.length];

    @Override

    protected void onCreate(Bundle savedInstanceState)

    {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.fragment_slidetabs3);

        mTabWidget = (TabWidget) findViewById(R.id.tabWidget1);

        mTabWidget.setStripEnabled(false);

        mBtnTabs[0] = new Button(this);

        mBtnTabs[0].setFocusable(true);

        mBtnTabs[0].setText(addresses[0]);

        mBtnTabs[0].setTextColor(getResources().getColorStateList(R.color.button_bg_color_selector));

        mTabWidget.addView(mBtnTabs[0]);

        /*

         * Listener必须在mTabWidget.addView()之后再加入，用于覆盖默认的Listener，

         * mTabWidget.addView()中默认的Listener没有NullPointer检测。

         */

        mBtnTabs[0].setOnClickListener(mTabClickListener);

        mBtnTabs[1] = new Button(this);

        mBtnTabs[1].setFocusable(true);

        mBtnTabs[1].setText(addresses[1]);

        mBtnTabs[1].setTextColor(getResources().getColorStateList(R.color.button_bg_color_selector));

        mTabWidget.addView(mBtnTabs[1]);

        mBtnTabs[1].setOnClickListener(mTabClickListener);

        mBtnTabs[2] = new Button(this);

        mBtnTabs[2].setFocusable(true);

        mBtnTabs[2].setText(addresses[2]);

        mBtnTabs[2].setTextColor(getResources().getColorStateList(R.color.button_bg_color_selector));

        mTabWidget.addView(mBtnTabs[2]);

        mBtnTabs[2].setOnClickListener(mTabClickListener);

        mViewPager = (ViewPager) findViewById(R.id.viewPager1);

        mPagerAdapter = new MyPagerAdapter(getSupportFragmentManager());

        mViewPager.setAdapter(mPagerAdapter);

        mViewPager.setOnPageChangeListener(mPageChangeListener);

        mTabWidget.setCurrentTab(0);

    }

    private OnClickListener mTabClickListener = new OnClickListener() {

        @Override

        public void onClick(View v)

        {

            if (v == mBtnTabs[0])

            {

                mViewPager.setCurrentItem(0);

            } else if (v == mBtnTabs[1])

            {

                mViewPager.setCurrentItem(1);

            } else if (v == mBtnTabs[2])

            {

                mViewPager.setCurrentItem(2);

            }

        }

    };

    private OnPageChangeListener mPageChangeListener = new OnPageChangeListener() {

        @Override

        public void onPageSelected(int arg0)

        {

            mTabWidget.setCurrentTab(arg0);

        }

        @Override

        public void onPageScrolled(int arg0, float arg1, int arg2)

        {

        }

        @Override

        public void onPageScrollStateChanged(int arg0)

        {

        }

    };

    private class MyPagerAdapter extends FragmentStatePagerAdapter

    {

        public MyPagerAdapter(FragmentManager fm)

        {

            super(fm);

        }

        @Override

        public Fragment getItem(int position)

        {

            return MyFragment.create(addresses[position]);

        }

        @Override

        public int getCount()

        {

            return addresses.length;

        }

    }

    public static class MyFragment extends Fragment

    {

        public static MyFragment create(String address)

        {

            MyFragment f = new MyFragment();

            Bundle b = new Bundle();

            b.putString("address", address);

            f.setArguments(b);

            return f;

        }

        @Override

        public View onCreateView(LayoutInflater inflater, ViewGroup container,

                Bundle savedInstanceState)

        {

            Random r = new Random(System.currentTimeMillis());

            Bundle b = getArguments();

            View v = inflater.inflate(R.layout.fragment_viewpager1_layout1, null);

            v.setBackgroundColor(r.nextInt() >> 8 | 0xFF << 24);

            TextView txvAddress = (TextView) v.findViewById(R.id.textView1);

            txvAddress.setTextColor(r.nextInt() >> 8 | 0xFF << 24);

            txvAddress.setBackgroundColor(r.nextInt() >> 8 | 0xFF << 24);

            txvAddress.setText(b.getString("address", ""));

            return v;

        }

    }

}

布局：

<?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"

    android:orientation="vertical" >

    <TabWidget

        android:id="@+id/tabWidget1"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:gravity="right|center_vertical" />

    <android.support.v4.view.ViewPager

        android:id="@+id/viewPager1"

        android:layout_width="match_parent"

        android:layout_height="match_parent" />

</LinearLayout>

博客不在线，有问题直接联系QQ: 783713515

3种方式实现可滑动的Tab的更多相关文章

Android ScrollView监听滑动到顶部和底部的两种方式（你可能不知道的细节）
Android ScrollView监听滑动到顶部和底部,虽然网上很多资料都有说,但是不全,而且有些细节没说清楚使用场景: 1. 做一些复杂动画的时候,需要动态判断当前的ScrollView是否滚动 ...
【原】react做tab切换的几种方式
最近搞一个pc端的活动,搞了一个多月,甚烦,因为相比于pc端,更喜欢移动端多一点.因为移动端又能搞我的react了. 今天主要总结一下react当中tab切换的几种方式,因为tab切换基本上都会用到. ...
详解实现Android中实现View滑动的几种方式
注: 本文提到的所有三种滑动方式的完整demo:ScrollDemo 1. 关于View我们需要知道的 (1)什么是View? Android中的View类是所有UI控件的基类(Base class) ...
ionic实现滑动的三种方式
在移动端受屏幕大小所限,展示内容很多的时候,就要使部分区域进行滑动.本文展示项目中所有到的几种方式,大家可以看自己的需求选择合适的滑动方式.实现滑动的基本原理,有两个容器A.B,假如A在外层,B在内层 ...
JavaScript+HTML+CSS 无缝滚动轮播图的两种方式
第一种方式在轮播图最后添加第一张,一张重复的图片. 点击前一张,到了第一张,将父级oList移动到最后一张(也就是添加的重复的第一张),在进行后续动画. 点击下一张,到了最后一张(也就是添加的重复的 ...
云服务器 ECS Linux 服务器修改时区的两种方式
在云服务器 ECS Linux 系统中,以 Centos6.5 为例,可以通过如下两种方式,修改系统时区: 可以使用命令 tzselect,修改时区.操作示例: [root@localhost ~]# ...
QT 焦点事件（4种方式的解释，还有委托焦点）
1.setFocusPolicy(...)设置获得焦点的方式 Qt::TabFocus 通过Tab键获得焦点 Qt::ClickFocus 通过被单击获得焦点 Qt::StrongFocus 可通过上 ...
创建TabHost的两种方式的简单分析
最近做了一个TabHost的界面,在做的过程中发现了一些问题,故和大家分享一下. 首先我的界面如下: 目前就我所知,创建TabHost有两种方式,第一种是继承TabActivity类,然后用getTa ...
Unity 人物跟谁手指的移动(第一种方式)
长夜漫漫无心睡眠,敲敲代码,越敲越来劲! 我发现好多小朋友都在玩熊出没之xxxx这个游戏,居然打了一下午都没玩通第2关,我把测试也叫来陪我一起玩! 结果他也打不通,我再去叫策划,他也没打过,我去叫主管 ...

随机推荐

Oracle EBS DBA常用SQL - 安装/补丁【Z】
Oracle EBS DBA常用SQL - 安装/补丁检查应用补丁有没有安装:select bug_number,last_update_date from ad_bugs where bug_nu ...
为什么用户主目录下.bash_profile没有自动执行
请注意一般登录当前用户后 .bash_profile会自动运行如果不自动运行请查看是不是切换用户的时候使用的su 用户名而不是su - 用户名添加中间这个 - 后会除了切换用户外还会加载该用户 ...
用CodeBlocks构建C项目时候出现的问题
后缀名为depend的文件是makefile 编译产生的文件是生成一种依赖关系帮助程序编译的那为什么有时候会生成而有时候又不会呢? 看你makefile 自己的编写写了就有没写就没 ...
一致性哈希（Consistent Hashing）
前言:对于一致性哈希已经不是罕见概念,在此只是对原有理论概念的一个整理和用自己的理解讲述,希望对新手有些许帮助,利人利己足矣. 1.概念一致哈希是一种特殊的哈希算法.在使用一致哈希算法后,哈希表槽位 ...
【phpcms-v9】如何实现在含有子栏目的栏目下添加内容？
对于题目的解释: 假设现在有一个一级栏目为:栏目1 其下有二级栏目 :栏目1=>栏目11,栏目1=>栏目12,栏目1=>栏目13 同时栏目1下有文章列表 : 栏目1-----文章 ...
C++小知识之Vector排序
// sort algorithm example #include <iostream> // std::cout #include <algorithm> / ...
[摘]ASP.Net标准控件(TextBox控件)
TextBox控件 TextBox控件又称文本框控件,为用户提供输入文本的功能. 1．属性 TextBox控件的常用属性及说明如表1所示. 表1 TextBox控件常用属性及说明属性说 ...
Delphi下TLabel鼠标MouseEnter、MouseLeave更改颜色失灵
在Delphi 7下,如果想在鼠标MouseEnter.MouseLeave的时候改变TLabel自身的颜色,很多人可能会采用 Label.Color := clRed;这样的方式来实现,我当初也是一 ...
转：onkeypress、onkeydown、onkeyup 区别
在使用JavaScript做WEB键盘事件侦听捕获时,主要采用onkeypress.onkeydown.onkeyup三个事件进行出来.该三个事件的执行顺序如下:onkeydown -> onk ...
MongoDB存储时间
之前一篇博客C++的时间中提到了MongoDB保存时间类型数据可以使用timestamp类型. 不过在实际编程过程中,发现保存timestamp容易,读取难.MongoDB C++的这方面的例子还没有 ...