PagerSlidingTabStrip 选中的标签行在顶部

Question

我正在使用库 PagerSlidingTabStrip 在 ViewPager 中获取 header 的动态数量。这是一个很棒的库，易于使用，但我需要对其进行更多自定义。

我的 PagerSlidingTabStrip header 位于屏幕底部，因此，我需要 PagerSlidingTabStrip 组件顶部的 'full width underline' 和 'selected item line indicator'。

经过一些测试，我终于将 'full width underline' 放在了正确的位置，使用这样的辅助 LinearLayout：

<LinearLayout
        android:id="@+id/tabs_container"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:layout_alignParentBottom="true">

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="2dp"
            android:orientation="vertical"
            android:background="@color/lfp_yellow"/>

        <com.astuetz.PagerSlidingTabStrip
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="48dip"
            app:pstsDividerColor="@android:color/transparent"
            app:pstsIndicatorColor="@color/light_yellow"
            app:pstsIndicatorHeight="4px"
            app:pstsShouldExpand="true"/>
    </LinearLayout>

但我没有表格将 'selected item line indicator' 放在顶部。我试图用顶部有一条线的可绘制对象更改所选项目的背景，但没有用:(

有什么想法吗？

非常感谢。

Answer 1

我终于找到了解决方案，但需要对库代码进行一些更改。

首先，我们需要在我们的项目中添加库代码，而不是通常的外部依赖：

dependencies {
 compile 'com.jakewharton:butterknife:6.0.0'
}

为此，在我们的 Android Studio 项目中有一个非常有用的教程，用于导入库项目。此外，在本教程中，它以这个 PagerSlidingTabStrip 库为例！（完美！）

How do I add a library project to Android Studio?

之后，我们只需要打开PagerSlidingTabStrip.java文件并进入'onDraw'函数即可。

我们必须更改这一行：

canvas.drawRect(lineLeft, height - indicatorHeight, lineRight, height, rectPaint);

对于这个：

canvas.drawRect(lineLeft, 0, lineRight, indicatorHeight , rectPaint);

大功告成！

另一方面，如果你有兴趣修改这个库，也许你会发现这个修改也很有用（将来可能包含在库的主分支中）：

https://github.com/astuetz/PagerSlidingTabStrip/pull/62/files?short_path=04c6e90

我希望这对某人有用:)

PagerSlidingTabStrip 选中的标签行在顶部

PagerSlidingTabStrip selected tab line at top

android

android-viewpager

pagerslidingtabstrip