SlidingTabLayout 以适应屏幕

Posted 2023-03-06

【中文标题】SlidingTabLayout 以适应屏幕

【英文标题】：SlidingTabLayout to fit the screen

【发布时间】：2015-01-04 09:32:46

【问题描述】：

我正在使用 Google 的 SlidingTabLayout。因为我只有 3 个选项卡要显示，所以我在最后一个选项卡之后看到了空白区域。 请截图如下。

谁能解释一下如何让标签适合整个屏幕。感谢您的宝贵时间。

【问题讨论】：

能否添加一些相关的代码和xml？

如果你使用默认的tablayout而不是尝试下面的答案***.com/a/31620690/1391158

【参考方案1】：

在 setViewPager() 之前使用这个：

slidingTabs.setDistributeEvenly(true);

如果您收到此错误Cannot resolve method 'setDistributeEvenly(boolean)'，您应该从 Google I/O 源代码更新您的 SlidingTabLayout.java 和 SlidingTabStrip.java：

SlidingTabLayout.java

SlidingTabStrip.java

【讨论】：

并在 setViewPager 之前调用它

这是正确答案，你应该从github下载代码而不是google开发者页面。

完美！谢谢！只是一个问题，在开发人员页面的版本中，SlidingTabLayout.TabColorizer 具有方法“getDividerColor”，该方法已在 github 的代码中删除。事实上，分隔线完全消失了。这种变化的动机是什么？

@NonUmemoto 我刚刚将代码从 github 复制并粘贴到了 android 示例包中。无需下载任何东西

【参考方案2】：

在SlidingTabLayout.java，找到

protected TextView createDefaultTabView(Context context)

并将这些行添加到该方法中：

WindowManager wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
Display display = wm.getDefaultDisplay();
Point size = new Point();
display.getSize(size);
textView.setWidth(size.x / 3);

这为我解决了问题。基本上，您将获得屏幕宽度并除以 3（选项卡数）并将其设置为构成选项卡的 TextField 的宽度。

更新：

在目前的源码中，google 增加了一个setDistributeEvenly(Boolean); 方法，所以你可以使用slidingTabs.setDistributeEvenly(true); 代替。使用较旧的源代码时，要么使用我上面的解决方案，要么更新到最新的源代码（推荐后者）。

【讨论】：

我在使用上面的 sn-p 时遇到问题，因为我的 minSDKVersion 是 Gingerbread，它不支持 getSize()。无论如何，我的疑问是，当我们在后续行中不使用 display.getSize(size) 时，它有什么用。

它将大小传递给大小变量。我相信在较旧的 sdks 中您可以使用 getx，但我不确定。

这个解决方案有效，但你最好使用sliding_tabs.setDistributeEvenly(true)。

请看下面我的回答。 Google 正式添加此功能。

重要提示：在 setViewPager() 之前使用它，否则它将不起作用！

【参考方案3】：

更改 SlidingTabLayout.java 文件可能会有所帮助。但是，该解决方案可能看起来不是很通用。 在 SlidingTabLayout.java 文件中，搜索方法

protected TextView createDefaultTabView(Context context)

在 TextView 'set' 方法下方，输入以下代码。

textView.setLayoutParams(new LinearLayout.LayoutParams(0, LinearLayout.LayoutParams.WRAP_CONTENT, 1f));

每个标签条只是一个自定义的线性布局。

【参考方案4】：

SubliemeSiem 的答案是正确的。一个更灵活、更短的答案是为组成选项卡的每个 TextView 添加权重 1。

在SlidingTabLayout.java，找到

protected TextView createDefaultTabView(Context context)

在撰写本文时是第 171 行。将此行添加到函数中。

textView.setLayoutParams(new TableLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT, 1f));

TableLayout.LayoutParams 接受三个参数，最后一个是重量。由于水平布局中的所有视图都将具有相同的权重，因此它们的大小将相同。随着选项卡数量的增加和大小超出屏幕宽度，换行内容应该允许优雅的行为，但我还没有测试过..

【参考方案5】：

您可以创建自定义选项卡布局并将其分配给您的 SlidingTabLayout 以进行膨胀。

custom_tab.xml：

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_
android:layout_
android:layout_weight="1"
android:id="@+id/customTab">
  <TextView
    android:layout_
    android:layout_
    android:id="@+id/customText"/>
</FrameLayout>

在您的代码中：

    viewPager = (ViewPager) rootView.findViewById(R.id.viewPager);
    viewPager.setAdapter(new SampleAdapter(getChildFragmentManager()));
    SlidingTabLayout tabLayout = (SlidingTabLayout)rootView.findViewById(R.id.slidingTab);
    tabLayout.setCustomTabView(R.layout.custom_tab,R.id.customText);
    tabLayout.setViewPager(viewPager);

通过将宽度保持为 0 dp 并将权重保持为 1（数字是任意的），布局应注意为所有选项卡提供相等的屏幕空间。这也适用于任意数量的选项卡。您不需要修改 SlidingTabLayout.java。

【讨论】：

是的，这个作品。但是选项卡上的文本设置为非常小，选项卡底部的蓝线仍位于选项卡上的文本上方。如何解决它，@amitav13？

回复我的问题：在看到 createDefaultTabView 之后，我认为 - 只需将这些添加到 custom_tab.xml 中的 TextView（参见 @amitav13 的回复）：android:gravity="center" android:textStyle= "bold" android:paddingLeft="2dp" android:paddingRight="2dp" android:paddingTop="10dp" android:paddingBottom="10dp" 它对我有用。如果选项卡

@DQuade 是的，在纵向模式下很难在屏幕上看到 5 个或更多标签。如果要减少蓝线（选中指标）的粗细，需要调整SlidingTabStrip类中SELECTED_INDICATOR_THICKNESS_DIPS的值。

【参考方案6】：

Google 已发布Design Support Library。您现在可以使用TabLayout。要使标签适合屏幕，您可以致电setTabMode(TabLayout.MODE_FIXED);

【讨论】：

如果您使用的是设计支持库中最新版本的 TabLayout，这是最好的解决方案。

【参考方案7】：

更动态的方法是

编辑SlidingTabLayout.java

找到private void populateTabStrip()方法并替换

mTabStrip.addView(tabView);

与

 // get dimension of current layout
 DisplayMetrics display = this.getResources().getDisplayMetrics();
   int width = display.widthPixels;
        //your tab names here
        String[] tabTitles = "tab1", "tab2", "tab3"
        // compare max width and number of tabs's length 
        //will not fit to the maxwidth it will distribute the tabs evenly
        if(width%(width/tabTitles.length) == 0)
            mTabStrip.addView(tabView,
                    new LinearLayout.LayoutParams(width/tabTitles.length, ViewGroup.LayoutParams.WRAP_CONTENT));
         else 
            mTabStrip.addView(tabView);
        

【讨论】：

为什么这个是-1？

【参考方案8】：

在SlidingTabLayout.java 在以下方法下，就在 return 语句之前：

protected TextView createDefaultTabView(Context context)

我在该方法中添加了这些行：

final PagerAdapter adapter = mViewPager.getAdapter();
LinearLayout.LayoutParams param = new LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT, 1.0f / adapter.getCount());
textView.setLayoutParams(param);

这与标记为问题解决方案的答案非常接近，但是我不必使用窗口管理器。

【参考方案9】：

在每个文本视图的 xml 布局中尝试这个 android:layout_weight="1"。