【问题标题】:Tabs don't take full width using Design Support Library使用设计支持库的选项卡不占用全宽
【发布时间】:2016-04-24 23:39:22
【问题描述】:

我正在关注this tutorial,它解释了如何实现 Google 设计支持库中包含的新 TabLayout。这是我的应用程序:

从上面的截图可以看出,我的标签没有占据整个屏幕宽度。

我该如何解决?

这是我的活动 xml: (我的 Java 代码与 the tutorial 中的相同。在下面的代码中,我的 tablayout 和 viewpager 在 FrameLayout 内)

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawer"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">
<!-- your content layout -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
    <!-- Toolbar instead of ActionBar so the drawer can slide on top -->
    <!-- If you want to have dark background for options buttons remove the popup theme -->
        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
            android:layout_width="match_parent"
            android:layout_height="@dimen/abc_action_bar_default_height_material"
            android:background="?attr/colorPrimary"
            android:minHeight="?attr/actionBarSize" />
    <!-- Real content goes here -->
        <FrameLayout
            android:id="@+id/content_frame"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1" >
            <android.support.design.widget.TabLayout
                android:id="@+id/sliding_tabs"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:tabMode="scrollable" />
            <android.support.v4.view.ViewPager
                android:id="@+id/viewpager"
                android:layout_width="match_parent"
                android:layout_height="0px"
                android:layout_weight="1"
                android:background="@android:color/white" />
        </FrameLayout>
    </LinearLayout>
    <android.support.design.widget.NavigationView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:id="@+id/nav_view"
        app:headerLayout="@layout/nav_view_header"
        app:menu="@layout/nav_view_menu"
        app:theme="@style/MyTheme.NavMenu" />
</android.support.v4.widget.DrawerLayout>

编辑:

添加app:tabGravity="center" 并将app:tabMode 更改为fixed 后,应用的外观如下:

我需要它们来填充宽度。

这个问题不是重复的。另一个答案没有解决我的问题。

【问题讨论】:

标签: android androiddesignsupport


【解决方案1】:

http://developer.android.com/reference/android/support/design/widget/TabLayout.html

GRAVITY_CENTER Gravity 用于将选项卡布置在中心 选项卡布局。

GRAVITY_FILLGravity 用来尽可能地填充 TabLayout。

MODE_FIXED 固定标签同时显示所有标签,最好 与受益于选项卡之间快速切换的内容一起使用。

MODE_SCROLLABLE 可滚动标签在任意位置显示标签的子集 给定的时刻,并且可以包含更长的标签标签和更多的 选项卡。

只需在您的TabLayout 中设置它:

app:tabMode="fixed"

编辑:

我正在使用它并且它正在工作:

             <android.support.design.widget.TabLayout
                android:id="@+id/tab_layout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_below="@+id/toolbar"
                android:background="?attr/colorPrimary"
                android:minHeight="?attr/actionBarSize"
                android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" />

好像不需要设置什么。

证明:

顺便说一句,你也可以检查一下:

tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);

【讨论】:

  • 是的,你必须使用gravity_center!
  • 删除可滚动的。那应该可以工作然后我猜:这一行:app:tabMode="scrollable"
  • 你说得对,没有 xml 属性它可以工作,但你建议 tabGravity="center" 是错误的。正确的组合是 tabGravity="fill" 和 tabMode="fixed"(这是默认值)。
  • 好的,你是对的。不设置任何东西就可以了。我的错。接受你的回答。
  • 顺便谢谢你的诚实 :)
【解决方案2】:

像这样设置TabLayoutMode:

tabLayout.setTabMode(TabLayout.MODE_FIXED);

【讨论】:

  • 这与我已经设置的app:tabMode="fixed" 有何不同?
【解决方案3】:

解决方案是将这些添加到 xml 和 java:

在 Java 中:

tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);

在 XML 中用于 TabLayout:

            app:tabGravity="center"
            app:tabMode="fixed"

结果:

【讨论】:

  • 我的回答有什么不同? :)
  • Java 代码是必须的。 Gravity 需要在 xml 和 java 中设置。在 xml 中需要设置为 center,在 java 中需要设置为 fill
  • 你不需要那个,我的答案是有效的。没有这两个!
  • @LinX64,好吧,我尝试了 10 次,但没有成功。
  • 所以,这个问题是重复的。你可以看看我已经评论为重复的那个问题。例如:stackoverflow.com/a/30721642/4409113
猜你喜欢
  • 2015-12-16
  • 2015-11-26
  • 1970-01-01
  • 2015-08-30
  • 2015-10-31
  • 2014-10-15
  • 2023-03-03
  • 2016-06-21
  • 1970-01-01
相关资源
最近更新 更多