该TabLayout的功用,简单的说,就是当用户在该TabLayout的选项卡子item中选择触摸时候,文字和下方的指示器横条滑动指示。android.support.design.widget.TabLayout在Android扩展(extras)支持(support)包design中,但是design又依赖另外一个support v7包中的appcompat库,因此需要事先导入,在导入过程中,如果某些res目录下的value值过高比如value-23(Android SDK 23)但不巧发生错误如提示说找不到某某值,可以整个删除掉。 (1)导入support v7扩展包中的(\android-sdk-windows\extras\android\support\v7\appcompat)。该库位置在如图所示位置:

   找到后将其作为一个Android 库导入Eclipse。导入成功后如图所示:

(2)导入Android扩展包中的design库(\android-sdk-windows\extras\android\support\design),该库位置位于Android SDK包中如图所示位置:

导入Eclipse,将其作为Android的库。导入成功后如图所示:

需要在design项目中添加对android-support-v7-appcompat库的引用,如图所示:

代码如下:

 package com.lixu.tablayout_test;

 import android.app.Activity;
import android.content.Context;
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 int[] color = { 0xffB71C1C, 0xfff44336, 0xffEEFF41, 0xff00C853, 0xff4CAF50, 0xff03A9F4, 0xff6200EA };
private int count = color.length; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main); TabLayout tl = (TabLayout) findViewById(R.id.tablayout); ViewPager vp = (ViewPager) findViewById(R.id.viewpager);
vp.setAdapter(new MyAdapter(this));
// 设置TabLayout和ViewPager可以双向、交互联动。
tl.setupWithViewPager(vp);
// 设置滚动模式
tl.setTabMode(TabLayout.MODE_SCROLLABLE); } private class MyAdapter extends PagerAdapter {
Context context; public MyAdapter(Context context) {
this.context = context;
} @Override
public int getCount() { return count;
} @Override
public CharSequence getPageTitle(int position) {
return "选项卡" + position;
} @Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0 == arg1;
} @Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
} @Override
public Object instantiateItem(ViewGroup container, int position) {
TextView tv = new TextView(context);
tv.setText("页面" + position);
tv.setTextSize(30.0f);
// 设置居中
tv.setGravity(Gravity.CENTER);
// 设置每一页的颜色
tv.setBackgroundColor(color[position]);
container.addView(tv);
return tv; } } }

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:id="@+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" > <!-- xmlns:app="http://schemas.android.com/apk/res-auto" 要加这个否则xml文件要报错! --> <android.support.design.widget.TabLayout
android:id="@+id/tablayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabIndicatorColor="#f44336"
app:tabSelectedTextColor="#00C853"
app:tabTextColor="#03A9F4" /> <android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent" /> </LinearLayout>

运行效果图:

安卓官方ViewPager与android.support.design.widget.TabLayout双向交互联动切换 。的更多相关文章

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

    通常,android.support.design.widget.TabLayout与Android的ViewPager联合使用,实现与ViewPager的切换与联动.(1)比如,当用户手指触摸选择T ...

  2. Android Material Design:滑动指示选项卡android.support.design.widget.TabLayout的简单使用

    该TabLayout的功用,简单的说,就是当用户在该TabLayout的选项卡子item中选择触摸时候,文字和下方的指示器横条滑动指示.这个功能就是以前APP开发常用的选项卡某一卡片被切换.选中时候的 ...

  3. Caused by: android.view.InflateException: Binary XML file line #12: Error inflating class android.support.design.widget.TabLayout,TableLayout引起页面崩溃

    在使用TableLayout的时候,运行引用程序直接Crash. FATAL EXCEPTION: main Process: com.edaixi.activity, PID: 9703 java. ...

  4. 使用android.support.design.widget.TabLayout出现java.lang.reflect.InvocationTargetException

    解决方法: 1.在res里面的Values里面的styles定制一个自己的colorPrimary <style name="MyAppTheme" parent=" ...

  5. 使用 CoordinatorLayout 出错 inflating class android.support.design.widget.CoordinatorLayout

    ava.lang.RuntimeException: Unable to start activity ComponentInfo{com.czr.ianpu/com.czr.ianpu.MainAc ...

  6. android.support.design.widget.AppBarLayout 在android5.0+底部显示空白条问题

    在最外层使用 RelativeLayout作为根节点,同时设置 android:fitsSystemWindows="true"问题解决. <?xml version=&qu ...

  7. Android : Error inflating class android.support.design.widget.NavigationView

      之前一直没搞定的,今天终于解决了. Android报错: android.view.InflateException: Error inflating class android.support. ...

  8. Error : Program type already present: android.support.design.widget.CoordinatorLayout$

    背景 因为公司一个app项目需要扩展,因为功能较多且较完整的流程与业务,而且和以前的业务关系不大,所以我整合到了 另外一个分包中(代号:newFunc,请注意是代号)进行依赖. 当我写完这部分业务开始 ...

  9. 使用Android Support Design 控件TabLayout 方便快捷实现选项卡功能

    1.概述 TabLayout是在2015年的google大会上,google发布了新的Android Support Design库的新组件之一,以此来全面支持Material Design 设计风格 ...

随机推荐

  1. 开发错误日记 12: Unsupported major.minor version 52.0

    开发错误日记 12: Unsupported major.minor version 52.0 在编译时出现如下错误: java.lang.UnsupportedClassVersionError: ...

  2. (01)javascript 数据类型

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. idea 新建web项目

  4. Css-控制div斜转

    必须放在css声明中 div { transform: rotate(45deg); -o-transform: rotate(45deg); float: right; -webkit-transf ...

  5. HTMLTestRunner修改Python3的版本

    在拜读虫师大神的Selenium2+Python2.7时,发现生成HTMLTestRunner的测试报告使用的HTMLTestRunner的模块是用的Python2的语法.而我本人比较习惯与Pytho ...

  6. 【USACO 2.1】Ordered Fractions

    /* TASK: frac1 LANG: C++ URL: http://train.usaco.org/usacoprob2?S=frac1&a=dbgwn5v2WLr SOLVE: 直接枚 ...

  7. 【POJ 1789】Truck History(最小生成树)

    题意:距离定义为两个字符串的不同字符的位置个数.然后求出最小生成树. #include <algorithm> #include <cstdio> #include <c ...

  8. Python 中文编码问题小结

    1. 下面的语句要放在代码开头,指定文件编码, 可以识别 脚本中的所有字符和中文. # -*- coding:utf-8 -*- 2. codecd 编码转换 如果想要读取文本中的中文,需要借助于co ...

  9. viewport ---移动端详解

    转自---http://www.cnblogs.com/2050/p/3877280.html 移动前端开发之viewport的深入理解 在移动设备上进行网页的重构或开发,首先得搞明白的就是移动设备上 ...

  10. [日常训练]curves

    Description 小同学的弟弟小昨天学习了数学中的一元二次函数,但是由于学业不精,他一个晚上都在缠着小问一元二次函数的极值问题,小烦不可耐,于是,想请你帮忙弄个程序来应付小.程序要完成以下任务: ...