如何使TabLayout占据屏幕的全宽?

时间:2016-09-16 10:48:00

标签: android android-layout android-styles android-tablayout

TabLayout上的我的标签占据了屏幕的中心,即使根据Adam John's answer

添加tabMaxWidth = "0dp",也没有填满整个宽度

我想通过制表符扩展到填充屏幕,如下所示:

enter image description here

但我得到的是:

enter image description here

我的XML看起来像这样:

<android.support.design.widget.TabLayout
            android:id="@+id/tl_contact_type"
            style="@style/tabWidgetLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabMaxWidth="0dp"
            app:tabGravity="fill"
            app:tabMode="fixed"/>    

tabWidgetLayout

的style.xml
<style name="tabWidgetLayout" parent="Widget.Design.TabLayout">
            <item name="tabIndicatorColor">@color/colorTealAccent</item>
            <item name="tabIndicatorHeight">@dimen/default_corner_radius_medium</item>
            <item name="tabBackground">?attr/selectableItemBackground</item>
            <item name="android:background">@color/colorBrandPrimaryDark</item>
            <item name="tabSelectedTextColor">@color/color_tab_selected_text</item>
            <item name="tabTextAppearance">@style/tabWidgetLayoutTextAppearance</item>
        </style>

非常感谢任何帮助解决此问题。

6 个答案:

答案 0 :(得分:9)

尝试以下代码段

<android.support.design.widget.TabLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabMaxWidth="0dp"
            app:tabGravity="fill"
            app:tabMode="fixed" />

答案 1 :(得分:0)

$("#mapContent ul li.show1").hide();

告诉我这解决了你的问题。

很乐意提供帮助。

答案 2 :(得分:0)

值得查看@ style / tabWidgetLayout及其填充和边距值的父布局。

答案 3 :(得分:0)

<android.support.design.widget.TabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabMode="fixed"
            app:tabGravity="fill"
            app:tabSelectedTextColor="@color/ColorPrimary"
            app:tabIndicatorColor="@color/ColorPrimary"
            app:tabTextColor="#000"
            app:tabBackground="@color/cardview_light_background"/>

用此替换您的代码。

答案 4 :(得分:0)

我认为问题在于你没有扩展android:Widget 尝试将其添加到styles.xml

<style name="Base.Widget.Design.TabLayout" parent="android:Widget">
    <item name="tabBackground">@drawable/tab_background</item>
    <item name="tabIndicatorColor">@color/colorAccent</item>
    <item name="tabIndicatorHeight">2dp</item>
</style>

然后在你的布局中:

<android.support.design.widget.TabLayout
                android:id="@+id/tabLayout"
                style="@style/Base.Widget.Design.TabLayout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:tabGravity="fill"
                app:tabMode="fixed" />

编辑: 这是我很久以前在另一个问题中找到的(我无法记住)并且它对我有用

答案 5 :(得分:0)

更改 android:layout_width="match_parent"或为此属性设置自定义大小

<android.support.v4.view.ViewPager
        android:id="@+id/viewTab"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_editor_absoluteX="8dp"
        app:layout_editor_absoluteY="8dp">

    </android.support.v4.view.ViewPager>