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设计规范,如 ...
随机推荐
- org-reveal
环境: Debian 8 Emacs 24.4 org-reveal是在emacs org-mode中使用reveal.js的一个插件. emacs 24.4自带的org版本是8.2.10,这个版本似 ...
- iOS 多线程讲解2
1.GCD其他方法 1.GCD应用 单例模式 static dispatch_once_t onceToken; dispatch_once(&onceToken, ^{ NSLog(@&qu ...
- JSONP跨域原理和jQuery.getJSON用法
JSONP是一个非官方的协议,它允许在服务器端集成Script tags返回至客户端,通过javascript callback的形式实现跨域访问(这仅仅是JSONP简单的实现形式).本文主要介绍JS ...
- Oracle 11g XE 试用记录
安装之前先删除系统环境变量中的oracle_home等配置(如果存在的话): 如果安装后出现Web管理界面不能访问或者数据库不能连接的情况,卸载再多安装几次可能就正常了.状态不正常时,可以使用 C:\ ...
- 【Linux】Shell脚本编程(二)
练习:求100以内所有偶数之和; 使用至少三种方法实现; 示例1: #!/bin/bash # declare -i sum=0 #声明一个变量求和,初始值为0 for i in $(seq 0 2 ...
- 解决cell循环利用造成的重复勾选
@interface ProfessionViewController (){ NSMutableArray *_professionArray;//cell模型数组 NSMutableArray * ...
- ASP.Net 验证控件 CompareValidator
CompareValidator 作用就是比较两个输入框所输入的值是否一致,常用来作为验证输入密码和确认密码的业务. 属性 描述 Operator 比较操作符,可选值DataTypeCheck.Equ ...
- css3 text-transform变形动画
详细内容请点击 版本:CSS1 兼容性:IE4+ NS4+ 继承性:有 语法: text-transform : none | capitalize| uppercase| lowercase 参数: ...
- 使用ambari搭建Hadoop平台
1.操作系统 CentoOS Server with GUI(有GUI,有浏览器*ambari基于浏览器*推荐latest stable version)2.分区 默认 + /hadoop3.网络设置 ...
- HDU4268 Alice and Bob(贪心+multiset)
Problem Description Alice and Bob's game never ends. Today, they introduce a new game. In this game, ...