android - 如何在 Play Market 中将 SlidingTabStrip 居中？

Question

我正在使用https://github.com/google/iosched/blob/master/android/src/main/java/com/google/samples/apps/iosched/ui/widget/SlidingTabLayout.java标签类。

将它应用到我的项目后，我得到（没有居中的）标签，如图所示 ，但我想像在Play Market标签上一样将标签居中。

我如何像在 Google Play 应用程序中一样将标签居中，谢谢？

Answer 1

您的activity_main.xml文件应如下所示：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

<samples.exoguru.materialtabs.SlidingTabLayout
    android:id="@+id/tabs"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:elevation="2dp"
    android:background="@color/ColorPrimary"/>

<android.support.v4.view.ViewPager
    android:id="@+id/pager"
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    android:layout_weight="1">
</android.support.v4.view.ViewPager>

我不知道还有什么可能出错的。

Answer 2

我花了一点时间在这上面，最近让它工作了。这是摘要。

SlidingTabLayout.java 您必须修改scrollToTab方法来计算正确的滚动。我在这里添加了解释性评论：

private void scrollToTab(int tabIndex, float positionOffset) {
    final int tabStripChildCount = mTabStrip.getChildCount();
    if (tabStripChildCount == 0 || tabIndex < 0 || tabIndex >= tabStripChildCount) {
        return;
    }

    View selectedChild = mTabStrip.getChildAt(tabIndex);
    View nextChild = mTabStrip.getChildAt(tabIndex + 1);
    if (selectedChild != null) {
        // c1 is the center of the currently selected tab
        int c1 = selectedChild.getLeft() + (selectedChild.getWidth() / 2);

        // viewCenter is the center of the parent view
        int viewCenter = getWidth() / 2;

        int targetCenter = c1;
        if (nextChild != null) {
            // c2 is the center of the tab to the right of the currently selected
            int c2 = nextChild.getLeft() + (nextChild.getWidth() / 2);

            // the 'targetCenter' is partway between c1 & c2 depending on how far the viewpager
            // is currently scrolled
            targetCenter = (int) (c1 + ((c2 - c1) * positionOffset));
        }

        int targetScrollX = targetCenter - viewCenter;

        scrollTo(targetScrollX, 0);
    }
}

请注意，这已将参数positionOffset从 an更改int为 a float，这是故意的，因为我们不能再使用从InternalViewPagerListener'onPageScrolled方法传入的原始值，因为它没有考虑下一个选项卡的宽度。这意味着在那个onPageScrolled方法中我们必须改变：

        View selectedTitle = mTabStrip.getChildAt(position);
        int extraOffset = (selectedTitle != null)
                ? (int) (positionOffset * selectedTitle.getWidth())
                : 0;
        scrollToTab(position, extraOffset);

成为：

        scrollToTab(position, positionOffset);

这使我们可以访问进行positionOffset正确计算所需的原始参数。

这些是唯一需要的修改。我在这里发布了完整课程的要点：https ://gist.github.com/danh32/c39465c8b04db059fe72

Answer 3

修改scrollToTab方法以使选定的选项卡居中。

private void scrollToTab(int tabIndex, int positionOffset) {
    final int tabStripChildCount = mTabStrip.getChildCount();
    if (tabStripChildCount == 0 || tabIndex < 0 || tabIndex >= tabStripChildCount) {
        return;
    }

    View selectedChild = mTabStrip.getChildAt(tabIndex);
    if (selectedChild != null) {
        int viewWidth = getWidth();
        int tabWidth = selectedChild.getWidth();
        int tabPosition = selectedChild.getLeft() + positionOffset;
        int targetScrollX = tabPosition - viewWidth / 2 + tabWidth / 2;

        scrollTo(targetScrollX, 0);
    }
}