如何使 tablayout 固定在操作栏下方？

Question

我有以下布局，其中标签布局上方有一个图像滑块：

但我想将它固定在顶部，如下图所示：

这是我当前的代码：

<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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:scrollbars="none"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".MainActivity">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <com.daimajia.slider.library.SliderLayout
        android:id="@+id/slider"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        />

    <android.support.design.widget.TabLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/white"
        app:tabGravity="fill"
        android:layout_gravity="bottom"
        app:tabIndicatorColor="#000"
        app:tabMode="fixed"
        app:tabSelectedTextColor="@color/colorTextPrimary"
        app:tabTextColor="@color/colorTextDisable">

        <android.support.design.widget.TabItem
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="All"/>

        <android.support.design.widget.TabItem
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Casual"/>

        <android.support.design.widget.TabItem
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="WoMen"/>

        <android.support.design.widget.TabItem
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="New Jeans"/>

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

    <android.support.v4.view.ViewPager
        android:layout_width="match_parent"
        android:layout_height="800dp"/>

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/tablayout"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" >
    </android.support.v4.view.ViewPager>
</LinearLayout>

</ScrollView>

Answer 1

如果您想将TabLayout 向上移动，那么您需要 visibilty 的 SliderLayout gone 或设置高度 SliderLayout 到 0dp。

使用下面的代码，它将满足您在第二张图片中的要求。

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scrollbars="none"
    android:id="@+id/scrollView"
>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <com.daimajia.slider.library.SliderLayout
            android:id="@+id/slider"
            android:layout_width="match_parent"
            android:layout_height="200dp" //set this value to 0dp or set the visibilty GONE HERE(if you just want to hide visibilty)
            />

        <android.support.design.widget.TabLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            app:tabGravity="fill"
            app:tabIndicatorColor="#000"
            app:tabMode="fixed">

            <android.support.design.widget.TabItem
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="All" />

            <android.support.design.widget.TabItem
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="Casual" />


            <android.support.design.widget.TabItem
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="WoMen" />

            <android.support.design.widget.TabItem
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="New Jeans" />

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

        <android.support.v4.view.ViewPager
            android:layout_width="match_parent"
            android:layout_height="800dp" />

        <android.support.v4.view.ViewPager
            android:id="@+id/viewpager"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/tablayout"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"></android.support.v4.view.ViewPager>
    </LinearLayout>


</ScrollView>

然后以编程方式执行此操作

  scrollView.getViewTreeObserver().addOnScrollChangedListener(new ViewTreeObserver.OnScrollChangedListener() {
            @Override
            public void onScrollChanged() {
                if (scrollView != null) {
                    if (scrollView.getChildAt(0).getBottom() <= (scrollView.getHeight() + scrollView.getScrollY())) {
                        slider.setVisibility(View.VISIBLE);
                    }
                    else {
                        slider.setVisibility(View.GONE);
                    }
                }
            }
        });