一、TabLayout簡介
TabLayout是Android中的一個選項卡控制項，用於管理多個頁面，在用戶選擇不同的選項卡時，可以顯示對應的頁面內容。TabLayout通常與ViewPager一起使用，通過ViewPager中的FragmentAdapter來管理不同頁面的內容。TabLayout可以通過代碼或布局文件進行設置和使用，也可以進行樣式和主題的自定義，非常靈活方便。
二、使用TabLayout
在布局文件中使用TabLayout，需要添加TabLayout控制項和對應的ViewPager控制項，如下所示：
<android.support.design.widget.TabLayout
android:id="@+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
app:tabMode="scrollable" />
<android.support.v4.view.ViewPager
android:id="@+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
在代碼中，需要進行TabLayout和ViewPager的綁定，並為TabLayout添加選項卡，如下所示：
TabLayout tabLayout = findViewById(R.id.tab_layout);
ViewPager viewPager = findViewById(R.id.view_pager);
viewPager.setAdapter(fragmentAdapter);
tabLayout.setupWithViewPager(viewPager);
for (int i = 0; i < fragmentAdapter.getCount(); i++) {
tabLayout.getTabAt(i).setText("選項" + i);
}
其中需要注意的是，setupWithViewPager()方法是將TabLayout和ViewPager進行綁定，同時生成對應的選項卡。在綁定之後，可以通過getTabAt()方法獲取指定位置的選項卡，並通過setText()方法設置選項卡的文本。
三、自定義TabLayout
TabLayout可以進行樣式和主題的自定義，可以通過設置屬性或編寫樣式文件實現。下面是一些常用的自定義屬性：
- tabIndicatorColor: 設置選項卡中指示器的顏色
- tabIndicatorHeight: 設置選項卡中指示器的高度
- tabSelectedTextColor: 設置選中選項卡文本顏色
- tabUnselectedTextColor: 設置未選中選項卡文本顏色
- tabBackground: 設置選項卡的背景顏色
可以通過在布局文件中或代碼中設置這些屬性進行樣式的調整。同時，也可以創建一個自定義的樣式文件，並設置給TabLayout，實現更加具體的自定義效果。例如，下面是一個自定義樣式文件：
<style name="CustomTabLayout" parent="Widget.Design.TabLayout">
<item name="tabIndicatorColor">#00FF00</item>
<item name="tabIndicatorHeight">4dp</item>
<item name="tabSelectedTextColor">#000000</item>
<item name="tabUnselectedTextColor">#CCCCCC</item>
<item name="tabBackground">@color/white</item>
</style>
通過定義name為CustomTabLayout的樣式文件，可以在布局文件或代碼中調用：
TabLayout tabLayout = findViewById(R.id.tab_layout);
tabLayout.setTabTextColors(ColorStateList.valueOf(Color.BLACK));
tabLayout.setSelectedTabIndicatorColor(getResources().getColor(R.color.colorAccent));
tabLayout.setBackgroundResource(R.color.colorPrimaryDark);
tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);
tabLayout.addTab(tabLayout.newTab().setText("Tab 1"));
tabLayout.addTab(tabLayout.newTab().setText("Tab 2"));
tabLayout.addTab(tabLayout.newTab().setText("Tab 3"));
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
tabLayout.setTabMode(TabLayout.MODE_FIXED);
tabLayout.setTabTextColors(getResources().getColor(R.color.white),
getResources().getColor(R.color.colorAccent));
tabLayout.setBackgroundColor(getResources().getColor(R.color.cardview_dark_background));
tabLayout.setSelectedTabIndicatorColor(getResources().getColor(R.color.colorAccent));
通過setTabTextColors()方法和setSelectedTabIndicatorColor()方法設置字體和指示器顏色，通過setBackgroundColor()方法設置TabLayout的背景色，實現了自定義的效果。需要注意的是，如果自定義了樣式文件，則需要在布局文件中引用：
<android.support.design.widget.TabLayout
android:id="@+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
app:tabMode="scrollable"
style="@style/CustomTabLayout" />
四、完整示例代碼
下面是一個完整的示例代碼：
package com.example.tablayoutdemo;
import android.content.Context;
import android.content.res.ColorStateList;
import android.graphics.Color;
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
private TabLayout tabLayout;
private ViewPager viewPager;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tabLayout = findViewById(R.id.tab_layout);
viewPager = findViewById(R.id.view_pager);
MyFragmentAdapter fragmentAdapter = new MyFragmentAdapter(getSupportFragmentManager(), getFragments(), getTitles());
viewPager.setAdapter(fragmentAdapter);
tabLayout.setupWithViewPager(viewPager);
for (int i = 0; i < fragmentAdapter.getCount(); i++) {
tabLayout.getTabAt(i).setText(getTitles().get(i)).setIcon(getIcons()[i]).setCustomView(getTabView(i)).setTag(i);
}
tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
@Override
public void onTabSelected(TabLayout.Tab tab) {
}
@Override
public void onTabUnselected(TabLayout.Tab tab) {
}
@Override
public void onTabReselected(TabLayout.Tab tab) {
}
});
}
private List getFragments() {
List fragments = new ArrayList();
fragments.add(MyFragment.newInstance("Tab 1"));
fragments.add(MyFragment.newInstance("Tab 2"));
fragments.add(MyFragment.newInstance("Tab 3"));
return fragments;
}
private List getTitles() {
List titles = new ArrayList();
titles.add("Tab 1");
titles.add("Tab 2");
titles.add("Tab 3");
return titles;
}
private int[] getIcons() {
int[] icons = new int[3];
icons[0] = R.drawable.ic_launcher_foreground;
icons[1] = R.drawable.ic_launcher_foreground;
icons[2] = R.drawable.ic_launcher_foreground;
return icons;
}
private View getTabView(int position) {
View view = LayoutInflater.from(this).inflate(R.layout.tab_item, null);
TextView tabTitle = view.findViewById(R.id.tab_title);
ImageView tabIcon = view.findViewById(R.id.tab_icon);
tabTitle.setText(getTitles().get(position));
tabIcon.setImageResource(getIcons()[position]);
return view;
}
}其中，MyFragmentAdapter是FragmentAdapter的子類，用於管理Fragment內容。在MainActivity中，通過使用TabLayout和ViewPager對Fragment內容進行管理，並且自定義了選項卡的文本、圖標和視圖，以及選項卡的監聽事件。
五、總結
TabLayout是一個非常實用的Android控制項，通過它可以方便地實現多個頁面的管理。可以通過代碼或布局文件進行設置和使用，同時可以進行樣式和主題的自定義。下面是一些使用TabLayout需要注意的事項：
- TabLayout通常與ViewPager一起使用，在TabLayout中添加選項卡，同時在ViewPager中添加對應的Fragment
- 可以通過setupWithViewPager()方法將TabLayout和ViewPager進行綁定，並通過getTabAt()方法獲取選項卡進行設置
- 通過設置屬性或自定義樣式文件來實現TabLayout的樣式和主題的自定義
以上就是TabLayout的詳細介紹和使用方法，在實際項目中可以根據需要進行相應的調整和使用。
原創文章，作者：小藍，如若轉載，請註明出處：https://www.506064.com/zh-tw/n/288511.html
微信掃一掃 
支付寶掃一掃 