【问题标题】:Custom TabLayout like Google Play Music app自定义 TabLayout,如 Google Play 音乐应用
【发布时间】:2016-08-29 08:07:14
【问题描述】:

我将TabLayout 实现为类似的Google Play Music 应用程序。

  • 纵向(Google Play 音乐):
  • 横向(Google Play 音乐):

这是我的布局:

 <android.support.design.widget.TabLayout
        android:id="@+id/tab_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

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

我处理 TabLayout 的代码:

private void init() {
    mTabLayout = (TabLayout) findViewById(R.id.tab_layout);
    mTabLayout.addTab(mTabLayout.newTab().setText("Category 1"));
    mTabLayout.addTab(mTabLayout.newTab().setText("Category 2"));
    mTabLayout.addTab(mTabLayout.newTab().setText("Category 3"));
    mTabLayout.addTab(mTabLayout.newTab().setText("Category 4"));
    mTabLayout.addTab(mTabLayout.newTab().setText("Category 5"));
    mTabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);
}

但结果是 TabLayout 左侧没有边距:

  • 纵向(我的例子)::
  • 风景(我的例子):

我尝试了这个article,但结果并不如预期。如何自定义 TabLayout,如上图所示的 Google Play 音乐应用?

【问题讨论】:

    标签: android material-design android-tablayout


    【解决方案1】:

    您应该在 TabLayout 中使用android:marginLeft

    <android.support.design.widget.TabLayout
            android:id="@+id/tab_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="16dp">
    
        </android.support.design.widget.TabLayout>
    

    要为纵向和横向设置不同的边距,请在 values/dimens.xml 和 values-land/dimens.xml 中使用不同的值

    更新:

    使用边距会产生一个空间,即使在标签页滚动时也是如此。所以使用填充,clipToPadding="false"

    <android.support.design.widget.TabLayout
                android:id="@+id/tab_layout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:paddingLeft="16dp"
                android:clipToPadding="false">
    
            </android.support.design.widget.TabLayout>
    

    【讨论】:

    • 我尝试添加 marinLeft 或 paddingLeft,当我滚动它时,它会在左侧屏幕上留出一个空间,而不是像预期的那样。
    • 是的,它与 android:paddingLeft="16dp" 和 android:clipToPadding="false"> 为您的答案投票。谢谢。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2013-09-15
    • 1970-01-01
    • 2014-11-03
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多