TabLayout的使用

1.首先添加控件
1).直接在xml代码中添加子项

        <com.google.android.material.tabs.TabLayout
            android:id="@+id/tablayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
            <com.google.android.material.tabs.TabItem
                android:layout_height="wrap_content"
                android:text="我的充值"
                android:layout_width="wrap_content"/>
            <com.google.android.material.tabs.TabItem
                android:layout_height="wrap_content"
                android:text="我的管理"
                android:layout_width="wrap_content"/>
        </com.google.android.material.tabs.TabLayout>

2）在代码中添加子项
	a.xml代码
	

	```
  <com.google.android.material.tabs.TabLayout
      android:id="@+id/tablayout"
      android:layout_width="match_parent"
      android:layout_height="wrap_content">
  </com.google.android.material.tabs.TabLayout>
	```
	b.java代码
	

		```
		public class MainActivity4 extends AppCompatActivity {
		
		    private TabLayout tabLayout;
		    @Override
		    protected void onCreate(Bundle savedInstanceState) {
		        super.onCreate(savedInstanceState);
		        setContentView(R.layout.activity_main4);
		
	             tabLayout = findViewById(R.id.tablayout);
		         tabLayout.addTab(tabLayout.newTab().setText("我的管理"));
		         tabLayout.addTab(tabLayout.newTab().setText("我的充值"));
		    }
		}
		```

2.TabLayou控件中有些属性自己查找

3.vVewPager与TabLayout的联合
1）首先，要清楚ViewPager的用法，它有两种适配器，一个是PagerAdapter和FragmentAdapter,两者的达到的
的效果相同，但PagerAdapter填充的是View,FragmentAdapter填充的是Fragment
2 具体代码：
1）第一种用法：以TabLayout为主
xml代码：
```
<?xml version="1.0" encoding="utf-8"?>

					    <androidx.viewpager.widget.ViewPager
					        android:id="@+id/viewpager"
					        android:layout_width="match_parent"
					        android:layout_height="0dp"
					        android:layout_weight="1" />
					
					    <com.google.android.material.tabs.TabLayout
					        android:id="@+id/tablayout"
					        android:layout_width="match_parent"
					        android:layout_height="wrap_content"
					        app:tabTextColor="#03A9F4"
					        app:tabSelectedTextColor="#F44336">
					    </com.google.android.material.tabs.TabLayout>
					</LinearLayout>
					```
					java代码
			
					```
						public class MainActivity extends AppCompatActivity {
						    private TabLayout tabLayout;
						    private ViewPager viewPager;
						    private  LayoutInflater inflater;
						    private  List<View>viewList;
						    @Override
						    protected void onCreate(final Bundle savedInstanceState) {
						        super.onCreate(savedInstanceState);
						        setContentView(R.layout.activity_main);
						        initViews();//ViewPager所要填充的页面
						        
						        //第一步：初始化ViewPager并设置adapter
						        viewPager = (ViewPager) findViewById(R.id.viewpager);
								// viewPager.setAdapter(new ViewPagerAdapter(viewList));
						        //第二步：初始化Tablayout，给ViewPager设置标题（选项卡） 这一步也可省略，直接完成三,四两步
						        tabLayout = (TabLayout) findViewById(R.id.tablayout);
								tabLayout.addTab(tabLayout.newTab().setText("我的充值"));//添加tab选项卡
								 tabLayout.addTab(tabLayout.newTab().setText("我的管理"));
						
						        //第三步：关联ViewPager
						        tabLayout.setupWithViewPager(viewPager);
						        //和ViewPager联动后，TabLayout的子选型文字就会消失，所以要重新设置
						        tabLayout.getTabAt(0).setText("我的充值");
						        tabLayout.getTabAt(1).setText("我的管理");
						    }
						    private void initViews() {
						        inflater = LayoutInflater.from(this);
						        viewList = new ArrayList<>();
						        View view1 = inflater.inflate(R.layout.layout_temprature, null);
						
						        viewList.add(view1);
						        View view2 = inflater.inflate(R.layout.layout_pm25, null);
						
						        viewList.add(view2);
						        View view3 = inflater.inflate(R.layout.layout_co2, null);
						    }
					```
	2).第二种：以ViewPager为主，也就是说TabLayout不用设置子项目了，而是在ViewPager里设置的，感觉没有第一种方法好用
			java代码
			```
				public class MainActivity2 extends AppCompatActivity {
				    private List<View> viewList;
				    private ViewPager viewPager;
				    private TabLayout tabLayout;
				    private ViewPagerAdapter pagerAdapter;
				    private List<String> titleList;
				    private LayoutInflater inflater;
				    @Override
				    protected void onCreate(Bundle savedInstanceState) {
				        super.onCreate(savedInstanceState);
				        setContentView(R.layout.activity_main2);
				        initViews();
				    }
				
				    private void initViews() {
				        fragmentList = new ArrayList<>();
				        titleList = new ArrayList<>();
				        viewList = new ArrayList<>();
				        viewPager = findViewById(R.id.viewpager);
				        tabLayout = findViewById(R.id.tablayout);
				        inflater = LayoutInflater.from(this);

				        titleList.add(“我的充值”);
				        titleList.add(“我的管理”);
				        View view1 = inflater.inflate(R.layout.layout_temprature, null);
				        viewList.add(view1);
				        View view2 = inflater.inflate(R.layout.layout_pm25, null);
				        viewList.add(view2);
				        pagerAdapter = new ViewPagerAdapter(viewList,titleList);
				        viewPager.setAdapter(pagerAdapter);
				        tabLayout.setupWithViewPager(viewPager);
			
				    }
				}
			```
			ViewPagerAdapter代码：
			```
			public class ViewPagerAdapter extends PagerAdapter {
			    private List<View> viewList;
			    private List<String> titleList;
			
			    public ViewPagerAdapter(List<View> viewList,List<String> titleList) {
			        this.viewList = viewList;
			        this.titleList = titleList;
			    }
				
				    @Override
				    public int getCount() {
				        return viewList.size();
				    }
				
				    @Override
				    public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
				        return view == object;
				    }
				
				    @NonNull
				    @Override
				    public Object instantiateItem(@NonNull ViewGroup container, int position) {
				        container.addView(viewList.get(position));
				        return viewList.get(position);
				    }
				
				    @Override
				    public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
				        container.removeView(viewList.get(position));
				    }
				
				//这一步是第一种方式额外加的代码,TabLayout可以从这里获得子选项
				    @Nullable
				    @Override
				    public CharSequence getPageTitle(int position) {
				        return titleList.get(position);
				    }
				}
			```