Android中TabLayout结合ViewPager实现页面切换效果

 更新时间:2022年04月24日 11:10:44   作者:CKTim  
这篇文章主要介绍了Android中TabLayout结合ViewPager实现页面切换效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了TabLayout结合ViewPager实现页面切换效果的具体代码,供大家参考,具体内容如下

先看看效果,如图:

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

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

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

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 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.support.design.widget.TabLayout
  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.support.v4.view.ViewPager
  android:id="@+id/viewpager"
  android:layout_width="fill_parent"
  android:layout_height="match_parent"
  android:layout_below="@+id/tablayout"
  android:layout_weight="1" />

</RelativeLayout>

 

注:

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下面添加如下代码)

 <style name="MyTabLayoutTextAppearance" parent="TextAppearance.AppCompat.Widget.ActionBar.Title">
  <item name="android:textSize">16sp</item>
 </style>

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

public class MainActivity extends FragmentActivity {
 private TabLayout tablayout;
 private ViewPager viewpager;
 private List<Fragment> list;
 private FragmentManager manager;
 private FragmentTransaction transtion;
 private MyFragmentPageAdapter adapter;
 private List<String> 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<String>();
  titles.add("第一个");
  titles.add("第二个");
  //将两个Fragment装进集合中
  list = new ArrayList<Fragment>();
  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这个方法,不然标题显示不出来。

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

相关文章

  • android和js的交互之jsbridge使用教程

    android和js的交互之jsbridge使用教程

    这篇文章主要给大家介绍了关于android和js的交互之jsbridge使用的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧。
    2018-04-04
  • Android的HTTP多线程下载示例代码

    Android的HTTP多线程下载示例代码

    本篇文章主要介绍了Android的HTTP多线程下载示例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-03-03
  • Android官方下拉刷新控件SwipeRefreshLayout使用详解

    Android官方下拉刷新控件SwipeRefreshLayout使用详解

    这篇文章主要为大家详细介绍了Android官方下拉刷新控件SwipeRefreshLayout使用方法,实例展示如何使用下拉刷新控件,感兴趣的小伙伴们可以参考一下
    2016-07-07
  • 一起动手编写Android图片加载框架

    一起动手编写Android图片加载框架

    这篇文章主要和大家一起动手编写Android图片加载框架,从内部原理到具体实现来详细介绍如何开发一个简洁而实用的Android图片加载缓存框架,感兴趣的小伙伴们可以参考一下
    2016-04-04
  • android dialog根据弹窗等级排序显示的示例代码

    android dialog根据弹窗等级排序显示的示例代码

    这篇文章主要介绍了android dialog根据弹窗等级排序显示,本文通过示例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-10-10
  • Android事件分发机制的详解

    Android事件分发机制的详解

    这篇文章主要介绍了Android事件分发机制的详解的相关资料,希望通过本文能帮助到大家,让大家理解掌握Android事件分发机制,需要的朋友可以参考下
    2017-09-09
  • 利用Fiddler对手机进行抓包的实现方法

    利用Fiddler对手机进行抓包的实现方法

    下面小编就为大家带来一篇利用Fiddler对手机进行抓包的实现方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-05-05
  • RecyclerView实现纵向和横向滚动

    RecyclerView实现纵向和横向滚动

    这篇文章主要为大家详细介绍了RecyclerView实现纵向和横向滚动,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-01-01
  • Android的HTTP操作库Volley的基本使用教程

    Android的HTTP操作库Volley的基本使用教程

    这篇文章主要介绍了Android的HTTP操作库Volley的基本使用教程,包括JSON请求与图片加载等用法的实例,需要的朋友可以参考下
    2016-05-05
  • 自定义视图view的折线图使用讲解

    自定义视图view的折线图使用讲解

    这篇文章主要介绍了自定义视图view的折线图使用讲解,前面几章讲解了绘图的一些基本用法,本章就来看看折线图吧,需要的朋友可以参考下
    2023-04-04

最新评论