首页 > 代码库 > Android学习笔记--TabLayout的简单使用

Android学习笔记--TabLayout的简单使用

2024-08-17 01:52:46   220人阅读

我们在应用viewpager的时候，经常会使用TabPageIndicator来与其配合。达到很漂亮的效果。但是TabPageIndicator是第三方的，而且比较老了，当然了现在很多大神都已经开始自己写TabPageIndicator来满足自己的需求，在2015年的google大会上，google发布了新的Android Support Design库，里面包含了几个新的控件，其中就有一个TabLayout，它就可以完成TabPageIndicator的效果，而且还是官方的，最好的是它可以兼容到2.2以上版本，包括2.2。下面我就举一个简单的例子来使用它

fragment_item.xml

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     xmlns:app="http://schemas.android.com/apk/res-auto"
 4     android:orientation="vertical"
 5     android:layout_width="match_parent"
 6     android:layout_height="match_parent">
 7 
 8     <!--app:tabMode - fixed: 固定tab的位置，当tab数量过多时，超出屏幕范围后。无法显示更多。
 9                scrollable: tab数量超出屏幕范围，可以滚动tab，显示更多的tab-->
10     <!-- app:tabTextAppearance="@style/design_widget_TabLayout_TextStyle"-->
11     <!-- app:tabIndicatorColor="@color/white"                 // 下方滚动的下划线颜色-->
12     <!--app:tabSelectedTextColor="@color/gray"               // tab被选中后，文字的颜色-->
13     <!--app:tabTextColor="@color/white"                      // tab默认的文字颜色-->
14     <android.support.design.widget.TabLayout
15         android:id="@+id/tab_find_fragment_title"
16         android:layout_width="match_parent" android:layout_height="35dp"
17         android:background="#e4e4e4"
18         app:tabIndicatorColor="?attr/colorPrimary"
19         app:tabSelectedTextColor="?attr/colorPrimary"
20         app:tabTextColor="@android:color/black" app:tabGravity="fill"
21         android:fillViewport="false" />
22     <!--app:tabMode="scrollable"-->
23 
24     <android.support.v4.view.ViewPager
25         android:id="@+id/tab_find_fragment_find_fragment"
26         android:layout_width="match_parent"
27         android:layout_height="match_parent"/>
28 
29 </LinearLayout>
FindAdapter.java
 1 package com.wuxianedu.ademo;
 2 
 3 import android.support.v4.app.Fragment;
 4 import android.support.v4.app.FragmentManager;
 5 import android.support.v4.app.FragmentPagerAdapter;
 6 
 7 import java.util.List;
 8 
 9 /**
10  * Created by Administrator on 2016/10/18.
11  * 这个Adapter我也不知道是怎么回事，但是还是要照着写出出来。。。
12  */
13 
14 public class FindAdapter extends FragmentPagerAdapter {
15     //这是标题的  第一个就显示第一个
16     private List<String> titleList;
17     //这个是fragmen，把集合中的fragmen都展示出来
18     private List<Fragment> fragmentList;
19 
20     public FindAdapter(FragmentManager fm, List<String> titleList, List<Fragment> fragmentList) {
21         super(fm);
22         this.titleList = titleList;
23         this.fragmentList = fragmentList;
24     }
25 
26     @Override
27     public android.support.v4.app.Fragment getItem(int position) {
28         return fragmentList.get(position);
29     }
30 
31     @Override
32     public int getCount() {
33         return titleList.size();
34     }
35     /**
36      * 获取标题
37      * @param position
38      * @return
39      */
40     @Override
41     public CharSequence getPageTitle(int position) {
42         return titleList.get(position);
43     }
44 }
FindAFragment.java

 1 package com.wuxianedu.ademo;
 2 
 3 import android.os.Bundle;
 4 import android.support.annotation.Nullable;
 5 import android.support.design.widget.TabLayout;
 6 import android.support.v4.app.Fragment;
 7 import android.support.v4.view.ViewPager;
 8 import android.view.LayoutInflater;
 9 import android.view.View;
10 import android.view.ViewGroup;
11 
12 import java.util.ArrayList;
13 import java.util.List;
14 
15 /**
16  * Created by Administrator on 2016/10/18.
17  */
18 public class FindAFragment extends Fragment {
19 
20 
21     @Nullable
22     @Override
23     public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
24         View view = inflater.inflate(R.layout.fragment_item,null);
25         return view;
26     }
27 
28     @Override
29     public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
30         TabLayout tabLayout = (TabLayout) view.findViewById(R.id.tab_find_fragment_title);
31         ViewPager viewPager = (ViewPager) view.findViewById(R.id.tab_find_fragment_find_fragment);
32         List<String> titellist = new ArrayList<>();
33         titellist.add("推举项目");
34         titellist.add("热门项目");
35         titellist.add("最近更新");
36         List<Fragment> fragme　ntList = new ArrayList<>();
37         fragmentList.add(new OneFragment());//这里写你自己Fragment的名字 我是三个，
38         fragmentList.add(new TwoFragment());
39         fragmentList.add(new OneFragment());
40         tabLayout.setTabMode(TabLayout.MODE_FIXED);
41         FindAAdapter findAAdapter = new FindAAdapter(getActivity().getSupportFragmentManager(),titellist,fragmentList);
42         viewPager.setAdapter(findAAdapter);
43         tabLayout.setupWithViewPager(viewPager);
44         super.onViewCreated(view, savedInstanceState);
45     }
46 }
MainActivity.java

 1 package com.wuxianedu.ademo;
 2 
 3 import android.support.v4.app.FragmentPagerAdapter;
 4 import android.support.v4.app.FragmentTransaction;
 5 import android.support.v7.app.AppCompatActivity;
 6 import android.os.Bundle;
 7 
 8 public class MainActivity extends AppCompatActivity {
 9 
10     @Override
11     protected void onCreate(Bundle savedInstanceState) {
12         super.onCreate(savedInstanceState);
13         setContentView(R.layout.activity_main);
14         //往Fragment添加东西
15         FragmentTransaction fragmentTransaction = getSupportFragmentManager().beginTransaction();
16         //往Fragment添加东西
17         fragmentTransaction.add(R.id.frame_id,new FindFragment());
18         //往Fragment添加东西
19         fragmentTransaction.commit();
20     }
21 }

OnFragmetn.java  1 package com.wuxianedu.ademo;

 2 
 3 import android.os.Bundle;
 4 import android.support.annotation.Nullable;
 5 import android.support.v4.app.Fragment;
 6 import android.support.v4.view.ViewPager;
 7 import android.view.LayoutInflater;
 8 import android.view.View;
 9 import android.view.ViewGroup;
10 import android.widget.TableLayout;
11 import android.widget.TextView;
12 
13 import java.util.ArrayList;
14 import java.util.List;
15 
16 /**
17  * Created by terry-song on 2016/10/18.
18  */
19 
20 public class OneFragment extends Fragment {
21 
22     @Nullable
23     @Override
24     public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
25         View view = inflater.inflate(R.layout.fragment_test,null);
26         return view;
27     }
28 
29     @Override
30     public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
31         TextView textView = (TextView) view.findViewById(R.id.tv_show_id);
32         textView.setText("第1个页面");
33         super.onViewCreated(view, savedInstanceState);
34     }
35 }
其他
两个也一样，

 

Android学习笔记--TabLayout的简单使用


联系
我们