使用Android Support Design 控件TabLayout 方便快捷实现选项卡功能
1、概述
TabLayout是在2015年的google大会上,google发布了新的Android Support Design库的新组件之一,以此来全面支持Material Design
设计风格的UI效果,为了可以使用这些新颖MD组件首先必须要在Android Studio的SDK的EXTRA支持库安装Android Support Library支持库,如下所示
该组件在design库中因此还需要在AS中添加依赖库
FILE——project struct
右键app选择Library dependancy
选择design库
然后AS会自动帮我们在APP的build.gradle文件下添加依赖如下图,由于
TabLayout配合V ierPager,因此还需要导入viewerpager的依赖库 support-v4包,(就是上图的正数第二个库)
到此,准备工作已经搞定!
本例主要通过tablayout实现选项卡切换功能,这里实现了一个框架,比较简单,效果图如下,可以直接拿去加点扩展使用
2. 使用过程
首先要在布局文件中引入Tablayout和viewpager,然后在Activity通过adapter联动 vierpager,内部每个页面通常是个fragment
2.1 布局文件
引入俩个组件,
常用属性如下(需要引入xmlns:app="http://schemas.android.com/apk/res-auto")
app:tabSelectedTextColor:Tab被选中字体的颜色
app:tabTextColor:Tab未被选中字体的颜色
app:tabIndicatorColor:Tab指示器下标的颜色
<span style="font-size:18px;"><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:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context=".MainActivity"> <android.support.design.widget.TabLayout android:id="@+id/id_tablayout" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="#FFFFFFFF" app:tabGravity="fill" app:tabIndicatorColor="#FF007AA2" app:tabMode="fixed" app:tabTextColor="#FF000000"> </android.support.design.widget.TabLayout> <android.support.v4.view.ViewPager android:id="@+id/id_viewpager" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" > </android.support.v4.view.ViewPager> </LinearLayout> </span>
2.2、每个vierpager对应各自的fragment
这里是俩个选项卡,因此实现俩个fragment,省略下面有整个demo代码
2.3、viewPager+fragment 与Tablayout的联动
一般TabLayout都是和ViewPager共同使用才发挥它的优势
<span style="font-size:18px;">package com.elvis.tablayout_demo; import android.os.Bundle; import android.support.design.widget.TabLayout; import android.support.v4.app.Fragment; import android.support.v4.app.FragmentPagerAdapter; import android.support.v4.view.ViewPager; import android.support.v7.app.AppCompatActivity; import android.view.Menu; import android.view.MenuItem; import com.elvis.tablayout_demo.fragment.FragmenthotRec; import com.elvis.tablayout_demo.fragment.Fragmenthotpot; import java.util.ArrayList; import java.util.List; public class MainActivity extends AppCompatActivity { private TabLayout mTabLayout; private ViewPager mViewPager; private List<Fragment> list_fragment; private Fragmenthotpot mHotpot; private FragmenthotRec mHotRec; //tablayout的标题 private String[] mTitles = new String[]{"今日热点","热门推荐"}; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initViews(); } private void initViews() { mTabLayout = (TabLayout) findViewById(R.id.id_tablayout); mViewPager = (ViewPager) findViewById(R.id.id_viewpager); mHotpot = new Fragmenthotpot(); mHotRec = new FragmenthotRec(); list_fragment = new ArrayList<>(); list_fragment.add(mHotpot); list_fragment.add(mHotRec); /*viewPager通过适配器与fragment关联*/ mViewPager.setAdapter(new FragmentPagerAdapter(getSupportFragmentManager()) { @Override public Fragment getItem(int position) { return list_fragment.get(position); } @Override public int getCount() { return mTitles.length; } @Override public CharSequence getPageTitle(int position) { return mTitles[position]; } }); //TabLayout和ViewPager的关联 mTabLayout.setupWithViewPager(mViewPager); } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.menu_main, menu); return true; } @Override public boolean onOptionsItemSelected(MenuItem item) { // Handle action bar item clicks here. The action bar will // automatically handle clicks on the Home/Up button, so long // as you specify a parent activity in AndroidManifest.xml. int id = item.getItemId(); //noinspection SimplifiableIfStatement if (id == R.id.action_settings) { return true; } return super.onOptionsItemSelected(item); } } </span>
这里Tablayout很多属性在xml文件设置了,在代码中也可通过其方法自己设置,常用方法如下
- addTab(TabLayout.Tab tab, int position, boolean setSelected) 增加选项卡到 layout 中
- addTab(TabLayout.Tab tab, boolean setSelected) 同上
- addTab(TabLayout.Tab tab) 同上
- getTabAt(int index) 得到选项卡
- getTabCount() 得到选项卡的总个数
- getTabGravity() 得到 tab 的 Gravity
- getTabMode() 得到 tab 的模式
- getTabTextColors() 得到 tab 中文本的颜色
- newTab() 新建个 tab
- removeAllTabs() 移除所有的 tab
- removeTab(TabLayout.Tab tab) 移除指定的 tab
- removeTabAt(int position) 移除指定位置的 tab
- setOnTabSelectedListener(TabLayout.OnTabSelectedListener onTabSelectedListener) 为每个 tab 增加选择监听器
- setScrollPosition(int position, float positionOffset, boolean updateSelectedText) 设置滚动位置
- setTabGravity(int gravity) 设置 Gravity
- setTabMode(int mode) 设置 Mode,有两种值:TabLayout.MODE_SCROLLABLE和TabLayout.MODE_FIXED分别表示当tab的内容超过屏幕宽度是否支持横向水平滑动,第一种支持滑动,第二种不支持,默认不支持水平滑动。
- setTabTextColors(ColorStateList textColor) 设置 tab 中文本的颜色
- setTabTextColors(int normalColor, int selectedColor) 设置 tab 中文本的颜色 默认 选中
- setTabsFromPagerAdapter(PagerAdapter adapter) 设置 PagerAdapter
- setupWithViewPager(ViewPager viewPager) 和 ViewPager 联动
demo源码地址http://download.csdn.net/detail/xsf50717/9211991
这里只是搭了一个框架,自己去添枝加叶吧~
使用Android Support Design 控件TabLayout 方便快捷实现选项卡功能的更多相关文章
- Android Support Design 控件 FloatingActionButton
经常刚可以看到悬浮控件,比如印象笔记的下面那个绿色的悬浮按钮,这个控件非常简单也是来自Design Support Library中同理需要在android studio中加入依赖库:design库 ...
- Android Material Design控件学习(三)——使用TextInputLayout实现酷市场登录效果
前言 前两次,我们学习了 Android Material Design控件学习(一)--TabLayout的用法 Android Material Design控件学习(二)--Navigation ...
- Android Material Design控件学习(一)——TabLayout的用法
前言 Google官方在14年Google I/O上推出了全新的设计语言--Material Design.一并推出了一系列实现Material Design效果的控件库--Android Desig ...
- Android Material Design控件学习(二)——NavigationView的学习和使用
前言 上次我们学习了TabLayout的用法,今天我们继续学习MaterialDesign(简称MD)控件--NavigationView. 正如其名,NavigationView,导航View.一般 ...
- Android Material Design控件使用(二)——FloatButton TextInputEditText TextInputLayout 按钮和输入框
FloatingActionButton 1. 使用FloatingActionButton的情形 FAB代表一个App或一个页面中最主要的操作,如果一个App的每个页面都有FAB,则通常表示该App ...
- Android Support Library控件详细介绍之RecyclerView
RecyclerView控件 依赖 compile 'com.android.support:recyclerview-v7:24.1.1'RecyclerView也是容器控件,大多数的效果显示可通 ...
- Android Material Design控件使用(四)——下拉刷新 SwipeRefreshLayout
使用下拉刷新SwipeRefreshLayout 说明 SwipeRefreshLayout是Android官方的一个下拉刷新控件,一般我们使用此布局和一个RecyclerView嵌套使用 使用 xm ...
- Android Material Design控件使用(一)——ConstraintLayout 约束布局
参考文章: 约束布局ConstraintLayout看这一篇就够了 ConstraintLayout - 属性篇 介绍 Android ConstraintLayout是谷歌推出替代PrecentLa ...
- Android Material Design 控件常用的属性
android:fitsSystemWindows="true" 是一个boolean值的内部属性,让view可以根据系统窗口(如status bar)来调整自己的布局,如果值为t ...
随机推荐
- Dynamics CRM2016 Web Api之分页查询
在dynamics crm web api还没出现前,我们是通过fetchxml来实现的,当然这种方式依旧可行,那既然web api来了我们就拥抱新的方式. web api中我们通过指定查询的条数来实 ...
- Swift基础之实现选择图片时,出现类似于ActionSheet的样式
之前看到过有APP在选择图片时,调用手机相册时,将手机相册做成了左右滑动选择的效果,这次展示的就是这种样式,用OC语言已经有人实现过类似的代码,在这里写的仅仅是效果展示的代码调用,具体代码,可以自己研 ...
- Dynamics CRM2016 WebApi查询之alternate key
本篇继续来分享web api查询中的一条,利用alternate key进行查询. alternate key是个什么东西这里就不解释了如果有不知道的可以去看sdk.这里以房号信息实体为例,新建一个键 ...
- 安卓高级9 用原生intent分享
大家都用过安卓app时发现有个分享按钮如下: 所以今天特此分享用用原生完成: package qianfeng.com.simplesharedemo; import android.content. ...
- 优先使用TimeUnit类中的sleep()
TimeUnit是什么? TimeUnit是java.util.concurrent包下面的一个类,TimeUnit提供了可读性更好的线程暂停操作,通常用来替换Thread.sleep(),在很长一段 ...
- Android studio 中引用jar的其实是Maven?(二)
上一篇:Android studio 中引用jar的其实是Maven?(一) 搭建maven仓库: 去了解一个新的事物的时候,最好的方式就是去使用它.例如去了解一座城市的时候,最好的方式就是乘坐公共交 ...
- Java通过实现Runnable接口来创建线程
创建一个线程,最简单的方法是创建一个实现Runnable接口的类. 为了实现Runnable,一个类只需要执行一个方法调用run(),声明如下: public void run() 你可以重写该方法, ...
- OpenCV, MatBGR2ARGB, ARGB2MatBGR
代码片段~ unsigned int* abMatBGR2ARGB(Mat imag) { int nCols; int nRows; unsigned int *pbuff = NULL; if(i ...
- Apache commons email 使用过程中遇到的问题
apache-commons-email是对mail的一个封装,所以使用起来确实是很方便.特别的,官网上的tutorial也是极其的简单.但是我也仍然是遇到了没有解决的问题. jar包的添加 mail ...
- win7下创建逻辑分区
许多用户在安装Win7时都遇,安装程序创建的都是主分区,并没有创建逻辑分区的任何选项,这样的情况导致创建4个主分区后剩余的空间无法继续分配的情况,这使得许多用户情何以堪.很多用户都向小编反映该问题,有 ...