android tab 切换动画,Android中TabLayout结合ViewPager实现页面切换效果

先看看效果，如图：

1.因为TabLayout是Android Design Support Library官方库的一个控件，所以使用TabLayout时候需要先添加对该库的依赖

compile 'com.android.support:design:22.2.0'

2.下面是TabLayout和ViewPager配合使用的布局

xmlns:app="http://schemas.android.com/apk/res-auto"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context="com.example.cxk.myapplication.MainActivity">

android:id="@+id/tablayout"

android:layout_width="match_parent"

android:layout_height="48dp"

android:background="#1FBCD2"

app:tabTextAppearance="@style/MyTabLayoutTextAppearance"

app:tabIndicatorColor="@color/white"

app:tabSelectedTextColor="@color/white"

app:tabTextColor="@color/ripple_material_dark"

app:tabIndicatorHeight="2dp" />

android:id="@+id/viewpager"

android:layout_width="fill_parent"

android:layout_height="match_parent"

android:layout_below="@+id/tablayout"

android:layout_weight="1" />

注：

a.必须在根布局下写上xmlns:app="http://schemas.android.com/apk/res-auto"这句代码，不然无法设置在布局中设置Tablayout的一些属性。

b.以下是Tablayout一些常用属性

app:tabIndicatorColor="@color/white"指示器颜色

app:tabIndicatorHeight="2dp"指示器的宽带

app:tabSelectedTextColor="@color/white"被选中时字体的颜色

app:tabTextColor="@color/ripple_material_dark"未被选中时字体的颜色

app:tabTextAppearance="@style/MyTabLayoutTextAppearance"改变字体的大小(在style.xml下面添加如下代码)

16sp

3.下面是TabLayout和ViewPager配合使用的JAVA代码

public class MainActivity extends FragmentActivity {

private TabLayout tablayout;

private ViewPager viewpager;

private List list;

private FragmentManager manager;

private FragmentTransaction transtion;

private MyFragmentPageAdapter adapter;

private List titles;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

//先findID

tablayout = (TabLayout) this.findViewById(R.id.tablayout);

viewpager = (ViewPager) this.findViewById(R.id.viewpager);

//将各个标题装在titles里面

titles = new ArrayList();

titles.add("第一个");

titles.add("第二个");

//将两个Fragment装进集合中

list = new ArrayList();

Fragment1 f1 = new Fragment1();

Fragment2 f2 = new Fragment2();

list.add(f1);

list.add(f2);

//使用manager和transtion提交事务后为viewpager设置一个适配器

manager = getSupportFragmentManager();

adapter = new MyFragmentPageAdapter(manager);

transtion = manager.beginTransaction();

transtion.commit();

viewpager.setAdapter(adapter);

// tablayout.addTab可以将标题添加进Tab里面，true表示默认选中

tablayout.addTab(tablayout.newTab().setText(titles.get(0)), true);

tablayout.addTab(tablayout.newTab().setText(titles.get(1)), false);

//这两个方法是将Tablayout和Viewpager联合起来

tablayout.setupWithViewPager(viewpager);

tablayout.setTabsFromPagerAdapter(adapter);

}

// 定义一个适配器给ViewPager

class MyFragmentPageAdapter extends FragmentPagerAdapter {

public MyFragmentPageAdapter(FragmentManager fm) {

super(fm);

// TODO Auto-generated constructor stub

}

@Override

public android.support.v4.app.Fragment getItem(int arg0) {

// TODO Auto-generated method stub

return list.get(arg0);

}

@Override

public CharSequence getPageTitle(int position) {

return titles.get(position);

}

@Override

public int getCount() {

// TODO Auto-generated method stub

return list.size();

}

@Override

public void destroyItem(ViewGroup container, int position, Object object) {

// TODO Auto-generated method stub

super.destroyItem(container, position, object);

}

}

}

注：

1.getSupportManager使用该方法需要你继承FragmentActivity。

2.定义的新适配器需要重写getpagerTitle这个方法，不然标题显示不出来。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。