TabLayout和ViewPager
这里就说下tablayout+viewpager的实现方式；tablayout是android5.0推出来的一个MaterialDesign风格的控件，是专门用来实现tab栏效果的；功能强大，使用方便灵活；
一、引入依赖库
使用非常方便,Android Studio只需要在gradle中引入即可使用 .
apply plugin: 'com.android.application'
android {
compileSdkVersion 28
defaultConfig {
applicationId "com.example.panzq.tablayout"
minSdkVersion 22
targetSdkVersion 28
versionCode 1
versionName "1.0"
testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
}
buildTypes {
release {
minifyEnabled false
proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
}
}
}
dependencies {
implementation fileTree(dir: 'libs', include: ['*.jar'])
implementation 'com.android.support:appcompat-v7:28.0.0'
implementation 'com.android.support.constraint:constraint-layout:1.1.3'
testImplementation 'junit:junit:4.12'
androidTestImplementation 'com.android.support.test:runner:1.0.2'
androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
implementation 'com.android.support:design:28.0.0'
implementation 'com.android.support:recyclerview-v7:28.0.0'
implementation 'com.android.support:support-v4:28.0.0'
}
二、layout中定义TabLayout控件及ViewPager控件
<!--
app:tabGravity="center" 对齐方式，可选fill和center
app:tabIndicatorColor="@color/colorAccent" 设置tab下划线的颜色
app:tabMode="scrollable" scrollable是可以横行滚动,fixed是指固定个数
app:tabSelectedTextColor="@color/colorPrimaryDark" 选择tab的文本颜色
app:tabTextColor="@color/colorPrimary" 普通tab字体颜色
app:tabIndicatorHeight 指示器高度
app:tabBackground tab背景颜色
app:tabMaxWidth tab栏最大宽度
app:tabTextAppearance tab栏字体样式
app:tabMinWidth tab栏最小宽度
-->
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:id="@+id/linear"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity"> <android.support.v4.view.ViewPager
android:id="@+id/viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"> <android.support.design.widget.TabLayout
android:id="@+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabBackground="@color/colorPrimary"
app:tabGravity="fill"
app:tabMode="scrollable"
app:tabSelectedTextColor="@color/colorAccent"
app:tabIndicatorColor="@color/colorPrimaryLight"
app:tabTextColor="#ffffff"> <android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:icon="@drawable/ic_call_black_24dp"
android:text="@string/recents" /> <android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:icon="@drawable/ic_star_border_black_24dp"
android:text="@string/favourite" /> <android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:icon="@drawable/ic_person_black_24dp"
android:text="@string/contacts" /> <android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:icon="@drawable/ic_dialpad_black_24dp"
android:text="@string/keypad" /> <android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:icon="@drawable/ic_voicemail_black_24dp"
android:text="@string/voicemail" />
</android.support.design.widget.TabLayout> </android.support.v4.view.ViewPager> </LinearLayout>
三 设置TabLayout和ViewPager关联
MainActivity
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
TabLayout tabLayout = findViewById(R.id.tabLayout);
ViewPager viewPager = findViewById(R.id.viewPager);
CallPagerAdapter callPagerAdapter = new CallPagerAdapter(getSupportFragmentManager());
callPagerAdapter.addFragment(new RecentCallFragment(), "RECENT");
callPagerAdapter.addFragment(new FavouriteCallFragment(), "FAVOURITE");
callPagerAdapter.addFragment(new ContactCallFragment(), "CONTACTS");
callPagerAdapter.addFragment(new KeypadCallFragment(), "KEYPAD");
callPagerAdapter.addFragment(new VoicemailCallFragment(), "VOICEMAIL");
viewPager.setAdapter(callPagerAdapter);
tabLayout.setupWithViewPager(viewPager);
tabLayout.getTabAt(0).setIcon(R.drawable.ic_call_black_24dp);
tabLayout.getTabAt(1).setIcon(R.drawable.ic_star_border_black_24dp);
tabLayout.getTabAt(2).setIcon(R.drawable.ic_person_black_24dp);
tabLayout.getTabAt(3).setIcon(R.drawable.ic_dialpad_black_24dp);
tabLayout.getTabAt(4).setIcon(R.drawable.ic_voicemail_black_24dp);
}
}
需要注意的是setupWithViewPager();方法的调用必须在viewpager设置完适配器后调用，如果在设置适配器之前调用会抛异常，至于为什么会抛异常，后面tablayout的源码会说到；这样tab栏切换效果就实现了。
如果发现程序出现如下错误
- ::47.677 -/com.example.panzq.tablayout E/AndroidRuntime: FATAL EXCEPTION: main
Process: com.example.panzq.tablayout, PID:
android.view.InflateException: Binary XML file line #: Binary XML file line #: Error inflating class android.support.design.button.MaterialButton
Caused by: android.view.InflateException: Binary XML file line #: Error inflating class android.support.design.button.MaterialButton
Caused by: java.lang.reflect.InvocationTargetException
at java.lang.reflect.Constructor.newInstance0(Native Method)
at java.lang.reflect.Constructor.newInstance(Constructor.java:)
at android.view.LayoutInflater.createView(LayoutInflater.java:)
at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:)
at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:)
at android.view.LayoutInflater.rInflate(LayoutInflater.java:)
at android.view.LayoutInflater.rInflateChildren(LayoutInflater.java:)
at android.view.LayoutInflater.inflate(LayoutInflater.java:)
at android.view.LayoutInflater.inflate(LayoutInflater.java:)
at com.example.panzq.tablayout.fragments.KeypadCallFragment.onCreateView(KeypadCallFragment.java:)
at android.support.v4.app.Fragment.performCreateView(Fragment.java:)
at android.support.v4.app.FragmentManagerImpl.moveToState(FragmentManager.java:)
at android.support.v4.app.FragmentManagerImpl.moveFragmentToExpectedState(FragmentManager.java:)
at android.support.v4.app.FragmentManagerImpl.moveToState(FragmentManager.java:)
at android.support.v4.app.BackStackRecord.executeOps(BackStackRecord.java:)
at android.support.v4.app.FragmentManagerImpl.executeOps(FragmentManager.java:)
at android.support.v4.app.FragmentManagerImpl.executeOpsTogether(FragmentManager.java:)
at android.support.v4.app.FragmentManagerImpl.removeRedundantOperationsAndExecute(FragmentManager.java:)
at android.support.v4.app.FragmentManagerImpl.execSingleAction(FragmentManager.java:)
at android.support.v4.app.BackStackRecord.commitNowAllowingStateLoss(BackStackRecord.java:)
at android.support.v4.app.FragmentStatePagerAdapter.finishUpdate(FragmentStatePagerAdapter.java:)
at android.support.v4.view.ViewPager.populate(ViewPager.java:)
at android.support.v4.view.ViewPager.setCurrentItemInternal(ViewPager.java:)
at android.support.v4.view.ViewPager.setCurrentItemInternal(ViewPager.java:)
at android.support.v4.view.ViewPager.setCurrentItem(ViewPager.java:)
at android.support.design.widget.TabLayout$ViewPagerOnTabSelectedListener.onTabSelected(TabLayout.java:)
at android.support.design.widget.TabLayout.dispatchTabSelected(TabLayout.java:)
at android.support.design.widget.TabLayout.selectTab(TabLayout.java:)
at android.support.design.widget.TabLayout.selectTab(TabLayout.java:)
at android.support.design.widget.TabLayout$Tab.select(TabLayout.java:)
at android.support.design.widget.TabLayout$TabView.performClick(TabLayout.java:)
at android.view.View$PerformClick.run(View.java:)
at android.os.Handler.handleCallback(Handler.java:)
at android.os.Handler.dispatchMessage(Handler.java:)
at android.os.Looper.loop(Looper.java:)
at android.app.ActivityThread.main(ActivityThread.java:)
at java.lang.reflect.Method.invoke(Native Method)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:)
Caused by: java.lang.IllegalArgumentException: This component requires that you specify a valid TextAppearance attribute. Update your app theme to inherit from Theme.MaterialComponents (or a descendant).
at android.support.design.internal.ThemeEnforcement.checkTextAppearance(ThemeEnforcement.java:)
at android.support.design.internal.ThemeEnforcement.obtainStyledAttributes(ThemeEnforcement.java:)
at android.support.design.button.MaterialButton.<init>(MaterialButton.java:)
at android.support.design.button.MaterialButton.<init>(MaterialButton.java:)
at java.lang.reflect.Constructor.newInstance0(Native Method)
at java.lang.reflect.Constructor.newInstance(Constructor.java:)
at android.view.LayoutInflater.createView(LayoutInflater.java:)
at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:)
at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:)
at android.view.LayoutInflater.rInflate(LayoutInflater.java:)
at android.view.LayoutInflater.rInflateChildren(LayoutInflater.java:)
at android.view.LayoutInflater.inflate(LayoutInflater.java:)
at android.view.LayoutInflater.inflate(LayoutInflater.java:)
at com.example.panzq.tablayout.fragments.KeypadCallFragment.onCreateView(KeypadCallFragment.java:)
at android.support.v4.app.Fragment.performCreateView(Fragment.java:)
at android.support.v4.app.FragmentManagerImpl.moveToState(FragmentManager.java:)
at android.support.v4.app.FragmentManagerImpl.moveFragmentToExpectedState(FragmentManager.java:)
at android.support.v4.app.FragmentManagerImpl.moveToState(FragmentManager.java:)
at android.support.v4.app.BackStackRecord.executeOps(BackStackRecord.java:)
at android.support.v4.app.FragmentManagerImpl.executeOps(FragmentManager.java:)
at android.support.v4.app.FragmentManagerImpl.executeOpsTogether(FragmentManager.java:)
at android.support.v4.app.FragmentManagerImpl.removeRedundantOperationsAndExecute(FragmentManager.java:)
at android.support.v4.app.FragmentManagerImpl.execSingleAction(FragmentManager.java:)
at android.support.v4.app.BackStackRecord.commitNowAllowingStateLoss(BackStackRecord.java:)
at android.support.v4.app.FragmentStatePagerAdapter.finishUpdate(FragmentStatePagerAdapter.java:)
at android.support.v4.view.ViewPager.populate(ViewPager.java:)
at android.support.v4.view.ViewPager.setCurrentItemInternal(ViewPager.java:)
at android.support.v4.view.ViewPager.setCurrentItemInternal(ViewPager.java:)
at android.support.v4.view.ViewPager.setCurrentItem(ViewPager.java:)
at android.support.design.widget.TabLayout$ViewPagerOnTabSelectedListener.onTabSelected(TabLayout.java:)
at android.support.design.widget.TabLayout.dispatchTabSelected(TabLayout.java:)
at android.support.design.widget.TabLayout.selectTab(TabLayout.java:)
at android.support.design.widget.TabLayout.selectTab(TabLayout.java:)
at android.support.design.widget.TabLayout$Tab.select(TabLayout.java:)
at android.support.design.widget.TabLayout$TabView.performClick(TabLayout.java:)
at android.view.View$PerformClick.run(View.java:)
at android.os.Handler.handleCallback(Handler.java:)
at android.os.Handler.dispatchMessage(Handler.java:)
at android.os.Looper.loop(Looper.java:)
at android.app.ActivityThread.main(ActivityThread.java:)
at java.lang.reflect.Method.invoke(Native Method)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:)
则需要修改style.xml文件
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
改为
<style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">
代码地址：https://github.com/MichealPan9999/TabLayout-ViewPager
TabLayout和ViewPager的更多相关文章
- TabLayout和ViewPager简单实现页卡的滑动
首先需要在当前的module中的build Gradle的 dependencies中加入以下句子 compile 'com.android.support:design:23.0.1' 因为我们用到 ...
- TabLayout和ViewPager联动时的问题及解决方案
问题概述 TabLayout搭配ViewPager关联使用时,在未调用TabLayout的setupWithViewPager(mViewPager)方法之前,ViewPager的内容和TabLayo ...
- 关于TabLayout与ViewPager在Fragment中嵌套Fragment使用或配合使用的思考
注意: 因为继承的是Fragment,所以getSupportFragmentManager()与getFragmentManager()方法无法使用,这里需要用到getChildFragmentMa ...
- TabLayout与ViewPager同步后Tab的标题不显示
一.概述 1.1 问题描述 TabLayout+ViewPager后,TabLayout的TabItem不显示的问题: 1.2 截图 二.结论 mTabs.setupWithViewPager(mVi ...
- TabLayout+Fragment+ViewPager+FragmentStatePagerAdapter实现Tab标签
首先来看下实现的效果吧: 最近在项目中实现这个效果的时候.尽管自己磕磕绊绊的实现了,可是知识确实模模糊糊的,今天天气异常的冷,在加上这个知识不太熟练,实在是没有心情进行接下来的计划,干脆借着这个时间, ...
- Android 使用TabLayout、ViewPager和Fragment实现顶部菜单可滑动切换
效果图如下 首先,要使用控件需要添加design library,在Android Studio中添加 compile 'com.android.support:design:23.4.0' 然后是布 ...
- 巧力避免ViewPager的预加载数据，Tablayout+Fragment+viewPager
问题描述 最近在进行一个项目的开发,其中使用到了Tablayout+Fragment+viewPager来搭建一个基本的框架,从而出现了设置数据适配器的时候,item的位置错乱问题.我打印log日志的 ...
- TabLayout + ViewPager
一.实现思路 1.在build.gradle中添加依赖,例如: compile 'com.android.support:support-v4:23.4.0'compile 'com.android. ...
- 使用FragmentTabHost+TabLayout+ViewPager实现双层嵌套Tab
大多数应用程序都会在底部使用3~5个Tab对应用程序的主要功能进行划分,对于一些信息量非常大的应用程序,还需要在每个Tab下继续划分子Tab对信息进行分类显示. 本文实现采用FragmentTabHo ...
随机推荐
- webpack学习笔记——解决多次输出的问题&自动编译之启用观察者模式，热重载
[解决多次输出的问题] 昨天学会了用命令打包,如下 webpack entry.js bundle.js 但是会出现多次输出要表现的内容的问题,如下,执行几次上述命令,显示几次,原因是并没有清除之前输 ...
- springboot-菜鸟学习1
一.SpringBoot 快速开始 进入 https://start.spring.io/ 给项目命名 引入所需要的jar包支持 一般需要 jpa.freemarker.mysql.web等 在IDE ...
- mysql查询反斜杠字符串问题
马上上线发现一个问题,太坑了 写一个查询语句,明明数据库中有,但是就是查不到,后来发现是反斜杠的问题 比如 数据库中有一个字段名称为 name 存储的值为 “海尔厨电\洗碗机” 当我使用如下sql查 ...
- Python 爬虫五 进阶案例-web微信登陆与消息发送
首先回顾下网页微信登陆的一般流程 1.打开浏览器输入网址 2.使用手机微信扫码登陆 3.进入用户界面 1.打开浏览器输入网址 首先打开浏览器输入web微信网址,并进行监控: https://wx.qq ...
- 异步Async
1.c#异步介绍 异步必须基于委托,有委托才有异步 新建一个window Form程序MyAsync,添加一个按钮,(name)=btnAsync 后台代码如下: using System;using ...
- Binary Tree HDU - 5573 （思维）
题目链接: B - Binary Tree HDU - 5573 题目大意: 给定一颗二叉树,根结点权值为1,左孩子权值是父节点的两倍,右孩子是两倍+1: 给定 n 和 k,让你找一条从根结点走到第 ...
- mongodb系列~mongodb集群介绍与管理
mongodb 集群维护1 简介 谈谈mongodb的集群架构2 常用的维护命令 1 查看状态 sh.status() 1 version 2 shards: ...
- MySql 在cmd下的学习笔记 —— 有关多表查询的操作（内连接，外连接，交叉连接）
mysql> create table test5( -> id int, ) -> )engine myisam charset utf8; Query OK, rows affe ...
- Nginx系列5：从网络原理来看SSL安全协议
1.TLS/SSL发展 2.TLS安全密码套件解读
- 【Shell】30分钟关闭Tcpdump，开启Tcpdump、检测目录大小终止任务
场景 按照一定时间规律运行Tcpdump 思路 编程思路细化思考 查看文件个数 file_count_results=`ls -al "C:\\Users\\Windows32\\Deskt ...