android中TabLayut到底是个什么鬼?今天我们来看一下,起初,我听见这个名字的时候我总觉得这不是五大布局里的表格布局嘛,现在想想真是有点可笑,下面我们来了解一下它吧!
在2015年的google大会上,google发布了新的Android Support Design库,TabLayout是属于Android Design Support Library中的一个控件,顶部或者底部水平的Tab布局,滑动或者点击切换的功能,今天我们简单讲解TabLayout的使用,重点讲解如何自定义TabLayout的item,也就是每一个tab。 下面我们看一个列子:
画圈的自然就是tablayout了,它一共是4个,既可以点击滑动,也可以直接滑动,下面我们就来写代码吧!
首先我们需要在build.gradle中加入compile ‘com.android.support:design:22.2.0’依赖即可。
我打算写3个tab所以先写一个ThirdActivity
代码如下:
ThirdActivity:
package com.example.mytablayoutdemo.activity;
import android.app.Activity;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.design.widget.TabLayout;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
import com.example.mytablayoutdemo.R;
import com.example.mytablayoutdemo.adapter.SimpleFragmentPagerAdapter;
/**
* Created by 亮亮 on 2017/7/26.
*/
public class TActivity extends FragmentActivity {
private SimpleFragmentPagerAdapter pagerAdapter;
private ViewPager viewPager;
private TabLayout tabLayout;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_t);
pagerAdapter = new SimpleFragmentPagerAdapter(getSupportFragmentManager(), this);
viewPager = (ViewPager) findViewById(R.id.viewpager);
viewPager.setAdapter(pagerAdapter);
tabLayout = (TabLayout) findViewById(R.id.sliding_tabs);
tabLayout.setupWithViewPager(viewPager);
tabLayout.setTabMode(TabLayout.MODE_FIXED);
}
}
activity_third布局代码:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.TabLayout
android:id="@+id/sliding_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="scrollable"/>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="0px"
android:layout_weight="1"
android:background="@android:color/white">
</android.support.v4.view.ViewPager>
</LinearLayout>
pageFragment代码:
package com.example.mytablayoutdemo.fragment;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import com.example.mytablayoutdemo.R;
/**
* Created by 亮亮 on 2017/7/26.
*/
public class PageFragment extends Fragment {
public static final String ARG_PAGE = "ARG_PAGE";
private int mPage;
public static PageFragment newInstance(int page) {
Bundle args = new Bundle();
args.putInt(ARG_PAGE, page);
PageFragment pageFragment = new PageFragment();
pageFragment.setArguments(args);
return pageFragment;
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
mPage = getArguments().getInt(ARG_PAGE);
}
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.pager_fragment, container, false);
TextView textView = (TextView) view;
textView.setText("Fragment #" + mPage);
return view;
}
}
这里写代码片
page_fragment布局代码:
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
</TextView>
SimpleFragmentPagerAdapter适配器代码:
package com.example.mytablayoutdemo.adapter;
import android.content.Context;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import com.example.mytablayoutdemo.fragment.PageFragment;
/**
* Created by 亮亮 on 2017/7/26.
*/
public class SimpleFragmentPagerAdapter extends FragmentPagerAdapter {
final int PAGE_COUNT = 3;
private String tabTitles[] = new String[]{"tab1","tab2","tab3"};
private Context context;
public SimpleFragmentPagerAdapter(FragmentManager fm, Context context) {
super(fm);
this.context = context;
}
@Override
public Fragment getItem(int position) {
return PageFragment.newInstance(position + 1);
}
@Override
public int getCount() {
return PAGE_COUNT;
}
@Override
public CharSequence getPageTitle(int position) {
return tabTitles[position];
}
}
需要在androidmanifest配置文件中注册下
<activity android:name=".activity.MainActivity"/>
<activity android:name=".activity.TActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN"/>
<category android:name="android.intent.category.LAUNCHER"/>
</intent-filter>
</activity>
到这里代码都写完了,欢迎来参观!下面我们看下效果图吧!
写的有点丑还请不要笑奥!!!