TabLayout未在平板电脑中正确显示标签

时间:2017-08-14 08:52:39

标签: android android-layout android-tablayout

enter image description here

<android.support.design.widget.TabLayout
            android:id="@+id/tl_dealer"
            android:layout_width="240dp"
            android:layout_height="42dp"
            android:layout_gravity="center_horizontal"

            android:layout_marginTop="12dp"
            android:background="@drawable/tab_dealer_type_background"
            app:tabBackground="@drawable/background"
            app:tabSelectedTextColor="@color/white"
            app:tabIndicatorColor="@color/action_bar_background"
            app:tabTextColor="@color/action_bar_background">

            <android.support.design.widget.TabItem
                android:layout_width="80dp"
                android:layout_height="wrap_content"
                android:text="HPCL"
                />

            <android.support.design.widget.TabItem
                android:layout_width="80dp"
                android:layout_height="wrap_content"
                android:text="IOCL"/>

            <android.support.design.widget.TabItem
                android:layout_width="80dp"
                android:layout_height="wrap_content"
                android:text="BPCL"/>

        </android.support.design.widget.TabLayout>

这是我在xml文件中的tablayout代码。

这是drawable文件夹中的backgroudn.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@color/action_bar_background" android:state_selected="true"/>
    <item android:drawable="@color/white" android:state_selected="false"/>
</selector>

最后的tab_dealer_type_background文件:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <stroke android:width="1dp" android:color="@color/action_bar_background" />
    <padding android:left="0dp" android:top="1dp" android:bottom="1dp" android:right="1dp"/>
</shape>

现在当我将这些文件用于手机时会发生什么,它会正确显示标签。但是当我在平板电脑中使用相同的代码时,它会在tablayout的左端和右端包含空格。

有谁能告诉我这里有什么问题?我在这里缺少什么?我尝试了很多东西,但我无法纠正它。如果有人知道这是怎么回事请告诉我?

enter image description here

1 个答案:

答案 0 :(得分:0)

<android.support.design.widget.TabLayout
            android:id="@+id/tl_dealer"
            android:layout_width="wrap_content"
            android:layout_height="42dp"

            android:layout_gravity="center_horizontal"
            android:layout_marginTop="12dp"
            android:background="@drawable/tab_dealer_type_background"
            app:tabBackground="@drawable/background"
            app:tabIndicatorColor="@color/action_bar_background"
            app:tabMode="scrollable"
            app:tabSelectedTextColor="@color/white"
            app:tabTextColor="@color/action_bar_background">

            <android.support.design.widget.TabItem
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="HPCL" />

            <android.support.design.widget.TabItem
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="IOCL" />

            <android.support.design.widget.TabItem
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="BPCL" />

        </android.support.design.widget.TabLayout>

这就是我做到的。