Android Material Design:ViewPager与android.support.design.widget.TabLayout双向交互联动切换

通常,android.support.design.widget.TabLayout与Android的ViewPager联合使用,实现与ViewPager的切换与联动。
(1)比如,当用户手指触摸选择TabLayout中的某一项时候,ViewPager应当自动切换跳转到相应的Page页面;
(2)同样,当用户在翻动ViewPager时候,TabLayout也会自动的滚动到与当前ViewPager页面像对应的子item tab并使该子item tab处于选中状态。
测试用的主Activity MainActivity.java :
package com.zzw.testtablayout; import android.app.Activity;
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.Gravity;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView; public class MainActivity extends Activity { private final int COUNT = 10; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main); TabLayout tabLayout = (TabLayout) findViewById(R.id.tabLayout); tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE); ViewPager viewPager = (ViewPager) findViewById(R.id.viewPager);
viewPager.setAdapter(new MyAdapter(this)); // TabLayout和ViewPager双向、交互联动。
tabLayout.setupWithViewPager(viewPager);
} private class MyAdapter extends PagerAdapter {
private Activity activity; public MyAdapter(Activity activity) {
this.activity = activity;
} @Override
public CharSequence getPageTitle(int position) { return "选项" + position;
} @Override
public Object instantiateItem(View container, int position) {
TextView tv = new TextView(activity);
tv.setText("ViewPager" + position);
tv.setTextSize(30.0f);
tv.setGravity(Gravity.CENTER); ((ViewGroup) container).addView(tv);
return tv;
} @Override
public void destroyItem(View container, int position, Object object) {
((ViewPager) container).removeView((View) object); } @Override
public int getCount() {
return COUNT;
} @Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0 == arg1;
} }
}
MainActivity.java需要的布局文件:activity_main.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent" > <!-- app:tabIndicatorColor 指示器(字体下面的那一个横)显示颜色 -->
<!-- app:tabSelectedTextColor 选中的字体颜色 -->
<!-- app:tabTextColor 未选中的字体颜色 --> <android.support.design.widget.TabLayout
android:id="@+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabIndicatorColor="#26c6da"
app:tabSelectedTextColor="#f44336"
app:tabTextColor="#bdbdbd" /> <android.support.v4.view.ViewPager
android:id="@+id/viewPager"
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="wrap_content" /> </LinearLayout>
Android Material Design:ViewPager与android.support.design.widget.TabLayout双向交互联动切换的更多相关文章
- 安卓官方ViewPager与android.support.design.widget.TabLayout双向交互联动切换 。
该TabLayout的功用,简单的说,就是当用户在该TabLayout的选项卡子item中选择触摸时候,文字和下方的指示器横条滑动指示.android.support.design.widget.Ta ...
- Material Design with the Android Design Support Library
Material Design with the Android Design Support Library 原文http://www.sitepoint.com/material-design-a ...
- Android material design support library -- CollapsingToolbarLayout简介
本文是codetrick上material design support library教程的第三篇,主要讲的是CollapsingToolbarLayout的概念和应用方法. 原文链接:Materi ...
- Android Material Design:滑动指示选项卡android.support.design.widget.TabLayout的简单使用
该TabLayout的功用,简单的说,就是当用户在该TabLayout的选项卡子item中选择触摸时候,文字和下方的指示器横条滑动指示.这个功能就是以前APP开发常用的选项卡某一卡片被切换.选中时候的 ...
- Android Material Design 兼容库的使用
Android Material Design 兼容库的使用 mecury 前言:近来学习了Android Material Design 兼容库,为了把这个弄懂,才有了这篇博客,这里先推荐两篇博客: ...
- Android Material Design控件学习(一)——TabLayout的用法
前言 Google官方在14年Google I/O上推出了全新的设计语言--Material Design.一并推出了一系列实现Material Design效果的控件库--Android Desig ...
- 【转】Android的材料设计兼容库(Design Support Library)
转自:http://www.jcodecraeer.com/a/anzhuokaifa/developer/2015/0531/2958.html?mType=Group Android的材料设计兼容 ...
- Android Material Design简单使用
吐槽 作为一个 Android developer,没有什么比拿着 UI 设计的一堆 iOS 风格的设计 来做需求更恶心的了,基本所有空间都要照着 iOS 来画一遍,Material Design 辣 ...
- Android Material Design之Toolbar与Palette
转:http://blog.csdn.net/jdsjlzx/article/details/41441083 前言 我们都知道Marterial Design是Google推出的全新UI设计规范,如 ...
随机推荐
- 1.7.4.2 Local Parameters in Queries--局部参数
1. 局部参数 Local parameters是在solr请求中指定一个查询参数.Local parameters提供了一个方式以添加元数据到某个参数类型中,如查询字符串(在solr文档中,Loca ...
- Android自定义控件:进度条的四种实现方式(Progress Wheel的解析)
最近一直在学习自定义控件,搜了许多大牛们Blog里分享的小教程,也上GitHub找了一些类似的控件进行学习.发现读起来都不太好懂,就想写这么一篇东西作为学习笔记吧. 一.控件介绍: 进度条在App中非 ...
- ubuntu server 系统,更换阿里云源(用户更新源)
Ubuntu安装完毕后,默认使用的是官方的源,在国内访问速度很慢,这里介绍更换为阿里云的源方法. 步骤如下: 1.备份源配置文件 sudo cp /etc/apt/sources.list /etc/ ...
- 怒刷DP之 HDU 1024
Max Sum Plus Plus Time Limit:1000MS Memory Limit:32768KB 64bit IO Format:%I64d & %I64u S ...
- 基于Qt的Tcp协议的流程图
TCP(Transmission Control Protocol传输控制协议)是一种面向连接的.可靠的.基于字节流的传输层通信协议.在qt中,Tcp协议主要是用QTcpServer和QTcpSock ...
- aspcms中if判断语句的运用
1.<h3 {if:"[list:isrecommend]"="1"} style="color:red;"{end if}>& ...
- Stimulsoft Reports筛选数据来绑定显示2个报表
今天用Stimulsoft Reports做报表的时候,遇到一个问题,需要一个报表中显示2个报表视图,我在百度和博客园中搜索了一下,发现这方面的资料很少,我自己最后把问题解决了之后,整理了一下给大家分 ...
- How Old Are You?
今天要分享的是一个测年龄的小应用,就类似是http://how-old.net官网测年龄的功能一样,我的也是这样一个功能,细节捕获当然没有how-old多啦,不过这些主要是基于一个第三方的jar包,我 ...
- 关于offsetWidth,clientWidth,与jquery的width()方法
offsetWidth包括了边框的宽度, clientWidth只是元素的宽度, 当元素的"display"属性为“none”的时候,用offsetWidth(clientWidt ...
- jquery设置div,文本框 表单的值示例
我们将使用前一章中的三个相同的方法来设置内容: text() - 设置或返回所选元素的文本内容html() - 设置或返回所选元素的内容(包括 HTML标记)val() - 设置或返回表单字段的值 1 ...