TabLayout横向滑动菜单code

最新推荐文章于 2018-10-18 22:06:24 发布

窗台的花花

最新推荐文章于 2018-10-18 22:06:24 发布

阅读量1.4k

点赞数

分类专栏： Android

Android 专栏收录该内容

82 篇文章 6 订阅

订阅专栏

TableLayout表格布局详解

一、Tablelayout简介

Tablelayout类以行和列的形式对控件进行管理，每一行为一个TableRow对象，或一个View控件。当为TableRow对象时，可在TableRow下添加子控件，默认情况下，每个子控件占据一列。当为View时，该View将独占一行。

二、TableLayout行列数的确定(最大的原则)

TableLayout的行数由开发人员直接指定，即有多少个TableRow对象（或View控件），就有多少行。TableLayout的列数等于含有最多子控件的TableRow的列数。如第一TableRow含2个子控件，第二个TableRow含3个，第三个TableRow含4个，那么该TableLayout的列数为4.

三、TableLayout可设置的属性详解

总体了，这个TableLayout的属性和html中Table标签的属性差不多。他的各个属性如下：

TableLayout可设置的属性包括全局属性及单元格属性。

1、全局属性也即列属性，有以下3个参数：

android:stretchColumns 设置可伸展的列。该列可以向行方向伸展，最多可占据一整行。

android:shrinkColumns 设置可收缩的列。当该列子控件的内容太多，已经挤满所在行，那么该子控件的内容将往列方向显示。

android:collapseColumns 设置要隐藏的列。

示例：

android:stretchColumns="0" 第0列可伸展

android:shrinkColumns="1,2" 第1,2列皆可收缩

android:collapseColumns="*" 隐藏所有行

说明：列可以同时具备stretchColumns及shrinkColumns属性，若此，那么当该列的内容N多时，将“多行”显示其内容。（这里不是真正的多行，而是系统根据需要自动调节该行的layout_height）

2、单元格属性，有以下2个参数：

android:layout_column 指定该单元格在第几列显示

android:layout_span 指定该单元格占据的列数（未指定时，为1）

示例：

android:layout_column="1" 该控件显示在第1列

android:layout_span="2" 该控件占据2列

说明：一个控件也可以同时具备这两个特性。

Mainactivity:

package animtest.com.example.e531.zixuntest;

import android.support.design.widget.TabLayout;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.Toast;

//1.添加依赖库  design
public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        TabLayout myTab= (TabLayout) findViewById(R.id.mytab);

        //添加选项卡
        for(int i=0;i<10;i++){
            myTab.addTab(myTab.newTab().setText("TAB"+i));
        }

        //选项卡选中监听事件
        myTab.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
            @Override
            public void onTabSelected(TabLayout.Tab tab) {//选项卡被选中时
                Toast.makeText(MainActivity.this,tab.getText().toString(),Toast.LENGTH_SHORT).show();

            }

            @Override
            public void onTabUnselected(TabLayout.Tab tab) {

            }

            @Override
            public void onTabReselected(TabLayout.Tab tab) {

            }
        });




    }
}

activity_main:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="animtest.com.example.e531.zixuntest.MainActivity">

    <!--
        app:tabGravity="center"    设置居中对齐
        app:tabIndicatorColor="@color/colorAccent" 下滑线的颜色
        app:tabMode="scrollable"  设置tabLayoout菜单的模式,,,scrollable可以横向滚动
        app:tabSelectedTextColor="@color/colorPrimaryDark"  选中的时候文字的颜色
        app:tabTextColor="@color/colorPrimary"       文本默认的颜色
    -->

   <android.support.design.widget.TabLayout
       android:layout_width="match_parent"
       android:layout_height="50dp"
       android:id="@+id/mytab"
       app:tabGravity="center"
       app:tabIndicatorColor="@color/colorAccent"
       app:tabMode="scrollable"
       app:tabSelectedTextColor="@color/colorPrimaryDark"
       app:tabTextColor="@color/colorPrimary"

       ></android.support.design.widget.TabLayout>
</RelativeLayout>