Question

TabLayout非常有用，可以为viewpager构建一个滑动选项卡，但据我所知，你无法在代码或xml中添加TabHost之间的垂直线，所以还有其他方法可以轻松实现？

Answer 1

TabLayout实际上是一个水平滚动的LinearLayout。

只需使用以下代码添加分隔符：

    LinearLayout linearLayout = (LinearLayout)tabLayout.getChildAt(0);
    linearLayout.setShowDividers(LinearLayout.SHOW_DIVIDER_MIDDLE);
    GradientDrawable drawable = new GradientDrawable();
    drawable.setColor(Color.GRAY);
    drawable.setSize(1, 1);
    linearLayout.setDividerPadding(10);
    linearLayout.setDividerDrawable(drawable);

Answer 2

有一种方法可以使用Tab setCustomView方法添加分隔符：

TabLayout tabLayout = (TabLayout) findViewById(R.id.tablayout);
tabLayout.setupWithViewPager(viewPager);

for (int i = 0; i < tabLayout.getTabCount(); i++) {
  TabLayout.Tab tab = tabLayout.getTabAt(i);
  RelativeLayout relativeLayout = (RelativeLayout) 
        LayoutInflater.from(this).inflate(R.layout.tab_layout, tabLayout, false);

  TextView tabTextView = (TextView) relativeLayout.findViewById(R.id.tab_title);
  tabTextView.setText(tab.getText());
  tab.setCustomView(relativeLayout);
  tab.select();
}

使用divider（tab_layout.xml）标签自定义布局：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<!-- Tab title -->
<TextView
android:id="@+id/tab_title"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:textColor="@drawable/tab_item_selector"/>

<!-- Tab divider -->
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:background="@android:color/black" />
</RelativeLayout>

将TabLayout选项卡水平填充设置为0dp：

<android.support.design.widget.TabLayout
    android:id="@+id/tablayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/shape_tabbar_background"
    app:tabIndicatorColor="@android:color/white"
    app:tabIndicatorHeight="4dp"

    app:tabPaddingStart="0dp"
    app:tabPaddingEnd="0dp" />

选中标签标题文字颜色的选择器（tab_item_selector.xml）：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:color="@color/abc_primary_text_material_dark" />
<item android:state_focused="true" android:color="@color/abc_primary_text_material_dark" />
<item android:state_pressed="true" android:color="@color/abc_primary_text_material_dark" />
<item android:color="@color/abc_secondary_text_material_dark" />
</selector>

请参阅此链接了解更多信息：https://stackoverflow.com/a/32416751/3134215

Answer 3

试试这个，

您可以在tab_indicator布局文件中手动添加行。

表示水平线，

<View
    android:layout_height="1dp"
    android:id="@+id/line"
     android:layout_width="fill_parent"
      android:background="your color" />

和垂直线

<View
    android:layout_height="7dp"
    android:id="@+id/line"
     android:layout_width="1dp"
      android:background="your color" />

有没有办法在TabLayout中的每个选项卡之间添加垂直线

3 个答案: