現(xiàn)在我們開(kāi)發(fā)的項(xiàng)目基本都會(huì)用到導(dǎo)航欄或者下面功能列表切換。那我簡(jiǎn)單了解一下TabLayout。? ??
因?yàn)楣雀枰呀?jīng)有開(kāi)源的TabLayout直接用就好了，里面可以設(shè)置table 字體顏色屬性等等可以根據(jù)自己的功能需求定義·
<com.google.android.material.tabs.TabLayout
android:id="@+id/tablayout"
android:layout_width="match_parent"
android:layout_height="@dimen/x41"
android:layout_gravity="bottom"
android:background="@color/f6"
app:tabBackground="@android:color/transparent"
app:tabGravity="fill"
app:tabIndicatorHeight="0dp"
app:tabMode="fixed"
app:tabRippleColor="@android:color/transparent" />
1、簡(jiǎn)單使用
CustomScrollViewPager viewPager = findViewById(R.id.viewpager);
List list =new ArrayList<>();
list.add(new MainFragment());
list.add(new GoodsFragment());
list.add(new ShopFragment());
list.add(new UserFragment());
ArrayList titles =new ArrayList<>();
titles.add("主頁(yè)");
titles.add("商品");
titles.add("購(gòu)物車");
titles.add("我的");
TabFragment tabFragment =new TabFragment(getSupportFragmentManager(), list,titles);
viewPager.setAdapter(tabFragment);
// 如果需要定義icon tablayout.addTab(tab_Maintab.newTab().setText("我的").setIcon(R.drawable.ic_launcher_background));
//設(shè)置跟viewpager 聯(lián)動(dòng)
tablayout.setupWithViewPager(viewPager);
//防止fragment頁(yè)面不顯示
viewPager.setOffscreenPageLimit(list.size());
/**
* 標(biāo)簽欄切換適配器
*/
public class TabFragmentextends FragmentPagerAdapter {
private ListfragmentList;
? ? private Listtitles;
? ? public TabFragment(FragmentManager fm, List fragmentList, ArrayList titles) {
super(fm);
? ? ? ? this.fragmentList = fragmentList;
? ? ? ? this.titles = titles;
? ? }
@Override
? ? public FragmentgetItem(int i) {
return fragmentList.get(i);
? ? }
@Override
? ? public int getCount() {
return fragmentList.size();
? ? }
@Override
? ? public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
Log.d("destroyItem", position +"");
? ? ? ? super.destroyItem(container, position, object);
? ? }
@Nullable
@Override
? ? public CharSequencegetPageTitle(int position) {
return titles.get(position %titles.size());
? ? }
}
2、比如主題類的app根據(jù)接口動(dòng)態(tài)設(shè)置icon 、字體顏色,那我們就要自定義table 。
private void initPager() {
CustomScrollViewPager viewPager = findViewById(R.id.viewpager);
? ? List list =new ArrayList<>();
? ? list.add(new MainFragment());
? ? list.add(new GoodsFragment());
? ? list.add(new ShopFragment());
? ? list.add(new UserFragment());
// FragmentPagerAdapter 可以不用setTile 自定義tab已經(jīng)設(shè)置了
? ? TabFragment tabFragment =new TabFragment(getSupportFragmentManager(), list);
? ? viewPager.setAdapter(tabFragment);
? ? tablayout.addOnTabSelectedListener(new TabLayoutListener(viewPager));
? ? viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tablayout));
? ? //防止fragment頁(yè)面不顯示
? ? viewPager.setOffscreenPageLimit(list.size());
? ? addTab();
}
//添加tab
private void addTab() {
for (int i =0; i < SystemData.systemSetting.getMenu_nav().size(); i++) {
if (i ==0) {
tablayout.addTab(tablayout.newTab().setCustomView(tab_icon(SystemData.systemSetting.getMenu_nav().get(i).getTitle(), SystemData.systemSetting.getMenu_nav().get(i).getImg_url_hover(), ContextCompat.getColor(this, R.color.tab))), true);
? ? ? ? }else {
tablayout.addTab(tablayout.newTab().setCustomView(tab_icon(SystemData.systemSetting.getMenu_nav().get(i).getTitle(), SystemData.systemSetting.getMenu_nav().get(i).getImg_url(), ContextCompat.getColor(this, R.color.black6))), false);
? ? ? ? }
}
}
private Viewtab_icon(String str, String imageUrl, int color) {
View tab = LayoutInflater.from(this).inflate(R.layout.main_tab_view, null);
? ? TextView tv = tab.findViewById(R.id.tab_view);
? ? tv.setText(str);
? ? tv.setTextColor(color);
? ? ImageView im = tab.findViewById(R.id.tab_img);
? ? Glide.with(this).load(imageUrl).into(im);
? ? return tab;
}
//tab 監(jiān)聽(tīng)器
public class TabLayoutListenerextends TabLayout.ViewPagerOnTabSelectedListener {
private ViewPagerviewPager;
? ? public TabLayoutListener(ViewPager viewPager) {
super(viewPager);
? ? ? ? this.viewPager = viewPager;
? ? }
@Override
? ? public void onTabSelected(TabLayout.Tab tab) {
viewPager.setCurrentItem(tab.getPosition());
? ? ? ? setTab(tab, SystemData.systemSetting.getMenu_nav().get(tab.getPosition()).getImg_url_hover(), R.color.tab);
? ? }
@Override
? ? public void onTabUnselected(TabLayout.Tab tab) {
setTab(tab, SystemData.systemSetting.getMenu_nav().get(tab.getPosition()).getImg_url(), R.color.black6);
? ? }
private void setTab(TabLayout.Tab tab, String url, int colorId) {
if (tab.getCustomView() !=null) {
TextView view = tab.getCustomView().findViewById(R.id.tab_view);
? ? ? ? ? ? ImageView imageView = tab.getCustomView().findViewById(R.id.tab_img);
? ? ? ? ? ? Glide.with(App.getContext()).load(url).into(imageView);
? ? ? ? ? ? view.setTextColor(ContextCompat.getColor(App.getContext(), colorId));
? ? ? ? }
}
}
