浅谈TabLayout(ViewPager+Tab联动)
google发布了的Android Support Design
库中提供了TabLayout
通过TabLayout+ViewPager实现导航栏效果,点击Tab ,ViewPager跟随变化,滑动ViewPager,Tab跟随变化
看效果图:
通过一个Demo来了解TabLayout的简单使用(Android Studio开发),代码中都有注释了 ,很简单
1、build.gradle文件中加入
compile 'com.android.support:design:22.2.0'
2、写Xml文件,注意TabLayout的三个属性
app:tabIndicatorColor="#0f0" 每个tab下方的下划线的颜色
app:tabSelectedTextColor="#00f" 被选中的tab的文本颜色
app:tabTextColor="#f00" 未被选中的tab的文本颜色
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity"> <android.support.design.widget.TabLayout
android:id="@+id/tablayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#777"
app:tabIndicatorColor="#0f0"
app:tabSelectedTextColor="#00f"
app:tabTextColor="#f00"
/> <android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#cccc"
/> </LinearLayout>
activity_main.xml
3、创建4个fragment
这里只创建一个,其他三个类似
package com.xqx.com.tablayoutdemo; import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup; /**
* A simple {@link Fragment} subclass.
*/
public class OneFragment extends Fragment { public OneFragment() {
// Required empty public constructor
} @Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_one, container, false);
} }
OneFragment
<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:orientation="vertical"
tools:context="com.xqx.com.tablayoutdemo.OneFragment"> <!-- TODO: Update blank fragment layout -->
<TextView android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:gravity="center"
android:text="第一个fragment界面" /> </LinearLayout>
fragment_one
4、创建ViewPager的适配器
package com.xqx.com.tablayoutdemo; import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter; import java.util.List; public class MyAdapter extends FragmentPagerAdapter{ private List<Fragment> fragments; //fragment集合
private List<String> titles; //tab标题集合 public MyAdapter(FragmentManager fm, List<Fragment> fragments, List<String> titles) {
super(fm);
this.fragments = fragments;
this.titles = titles;
} @Override
public Fragment getItem(int position) {
return fragments.get(position);
} @Override
public int getCount() {
int ret = 0;
if (fragments!=null && fragments.size()!=0){
ret = fragments.size();
}
return ret;
} @Override
public CharSequence getPageTitle(int position) {
return titles.get(position);
} }
MyAdapter.java
5、MainActivity.java
package com.xqx.com.tablayoutdemo; import android.support.design.widget.TabLayout; import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
import android.os.Bundle; import java.util.ArrayList;
import java.util.List; public class MainActivity extends FragmentActivity { private TabLayout tabLayout;
private ViewPager viewPager; //四个fragment
private OneFragment oneFragment;
private TwoFragment twoFragment;
private ThreeFragment threeFragment;
private FourFragment fourFragment; //适配器
private MyAdapter adapter; private List<Fragment> fragments; //fragment集合
private List<String> titles; //tab标题集合
@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); //创建四个Fragment对象
oneFragment = new OneFragment();
twoFragment = new TwoFragment();
threeFragment = new ThreeFragment();
fourFragment = new FourFragment(); //将四个Fragment对象添加到集合中
fragments = new ArrayList<>();
fragments.add(oneFragment);
fragments.add(twoFragment);
fragments.add(threeFragment);
fragments.add(fourFragment); //给Tab添加标题
titles = new ArrayList<>();
titles.add("one");
titles.add("two");
titles.add("three");
titles.add("four"); //创建适配器
adapter = new MyAdapter(getSupportFragmentManager(),fragments,titles);
//viewpager绑定适配器
viewPager.setAdapter(adapter);
//tabLayout绑定viewpager
tabLayout.setupWithViewPager(viewPager); } }
MainActivity.java
-------------------------------------------------------------------------------------------------
其他相关:
浅谈RecyclerView(完美替代ListView,GridView)
浅谈TabLayout(ViewPager+Tab联动)的更多相关文章
- 浅谈RecyclerView(完美替代ListView,GridView)
Android RecyclerView 是Android5.0推出来的,导入support-v7包即可使用. 个人体验来说,RecyclerView绝对是一款功能强大的控件. 首先总结下Recycl ...
- 浅谈FloatingActionButton(悬浮按钮)
一.介绍 这个类是继承自ImageView的,所以对于这个控件我们可以使用ImageView的所有属性 android.support.design.widget.FloatingActionButt ...
- 使用FragmentTabHost+TabLayout+ViewPager实现双层嵌套Tab
大多数应用程序都会在底部使用3~5个Tab对应用程序的主要功能进行划分,对于一些信息量非常大的应用程序,还需要在每个Tab下继续划分子Tab对信息进行分类显示. 本文实现采用FragmentTabHo ...
- 安卓官方ViewPager与android.support.design.widget.TabLayout双向交互联动切换 。
该TabLayout的功用,简单的说,就是当用户在该TabLayout的选项卡子item中选择触摸时候,文字和下方的指示器横条滑动指示.android.support.design.widget.Ta ...
- 浅谈 Fragment 生命周期
版权声明:本文为博主原创文章,未经博主允许不得转载. 微博:厉圣杰 源码:AndroidDemo/Fragment 文中如有纰漏,欢迎大家留言指出. Fragment 是在 Android 3.0 中 ...
- TabLayout ViewPager Fragment 简介 案例 MD
Markdown版本笔记 我的GitHub首页 我的博客 我的微信 我的邮箱 MyAndroidBlogs baiqiantao baiqiantao bqt20094 baiqiantao@sina ...
- 011 Android TabLayout+ViewPager实现顶部滑动效果(多个页面)
1.TabLayout介绍 TabLayout提供了一个水平的布局用来展示Tabs,很多应用都有这样的设计,典型的有网易新闻,简书,知乎等.TabLayout就可以很好的完成这一职责,首先TabLay ...
- Android开发-浅谈架构(二)
写在前面的话 我记得有一期罗胖的<罗辑思维>中他提到 我们在这个碎片化 充满焦虑的时代该怎么学习--用30%的时间 了解70%该领域的知识然后迅速转移芳草鲜美的地方 像游牧民族那样.原话应 ...
- TabLayout + ViewPager
一.实现思路 1.在build.gradle中添加依赖,例如: compile 'com.android.support:support-v4:23.4.0'compile 'com.android. ...
随机推荐
- Elasticsearch Span Query跨度查询
ES基于Lucene开发,因此也继承了Lucene的一些多样化的查询,比如本篇说的Span Query跨度查询,就是基于Lucene中的SpanTermQuery以及其他的Query封装出的DSL,接 ...
- 输入URL之后都发生了什么
输入URL之后都发生了什么 这个标题印象中已经有很多讨论了.也来说说这个话题. 从头开始,当你的电脑使用网线连接到网络的时候,我们都知道,这个时候你的电脑会获取一个IP,这个IP就是你的唯一标识了.好 ...
- Chrome 35个开发者工具的小技巧
来源:w3cplus - 南北(@ping4god) 网址:http://www.w3cplus.com/tools/dev-tips.html 谷歌浏览器如今是Web开发者们所使用的最流行的网页浏览 ...
- android布局属性详解
RelativeLayout用到的一些重要的属性: 第一类:属性值为true或false android:layout_centerHrizontal 水平居中 android:layout_cen ...
- iOS阶段学习第三天笔记(运算符)
iOS学习(C语言)知识点整理笔记 1.运算符 一.算术运算符 1)表达式由变量.常量.运算符构成,有确定的类型和值 2)算术运算符包括: +(加),-(减),*(乘),/(除),%(模) 3)算术运 ...
- 【C#进阶系列】20 异常和状态管理
异常就是指成员没有完成它的名称所宣示的行动. public class Girl { public string Name { get; set; } } public class Troy{ Gir ...
- sqlserver 中存储过程的基础知识记录
1.什么是存储过程? 存储过程就是作为可执行对象存放在数据库中的一个或多个SQL命令. 通俗来讲:存储过程其实就是能完成一定操作的一组SQL语句. 2.为什么要用存储过程? 1)存储过程只在创建时进行 ...
- 孙鑫MFC学习笔记16:异步套接字
16 1.事件对象 2.CreateEvent创建事件对象 3.SetEvent设置事件对象为通知状态 4.ResetEvent设置事件对象为非通知状态 5.InitializeCriticalSec ...
- Cygwin的安装
Android开发要用到NDK,装了一个虚拟机,老是不行. 后来安装了一个cygwin,安装完毕后unset home,再export NDK,就可以使用了,非常方便,不用像虚拟机那样经常切换.
- spring容器加载完毕做一件事情(利用ContextRefreshedEvent事件)转
关键字:spring容器加载完毕做一件事情(利用ContextRefreshedEvent事件) 应用场景:很多时候我们想要在某个类加载完毕时干某件事情,但是使用了spring管理对象,我们这个类引用 ...