使用可观察的滚动视图时，如何让我的选项卡视图填满整个屏幕？

Question

我一直在使用 Android-ObservableScrollView 库 (https://github.com/ksoichiro/Android-ObservableScrollView) 来实现 header（相对布局），它会在 listView 滚动时消失。此 listView 嵌入在 viewPager 中以累积 Tab 功能。这是我的布局的屏幕截图：

我已经实现了下面的代码来成功地动画和隐藏 header。

fragment_profile.xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <RelativeLayout
        android:id="@+id/profile_header"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

        <!--Header Layout Code-->

    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/profile_tab_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/profile_header"
        >

        <android.support.design.widget.TabLayout
            android:id="@+id/tab_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:minHeight="20dp"
            android:layout_alignParentTop="true"
            android:background="@color/background"
            app:tabTextColor="@color/rosso_corsa"
            app:tabSelectedTextColor="@color/rosso_corsa"
            app:tabIndicatorColor="@color/rosso_corsa"
            app:tabIndicatorHeight="2dp"
            />

        <android.support.v4.view.ViewPager
            android:id="@+id/tab_pager"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_below="@id/tab_layout"
            />

    </RelativeLayout>

</RelativeLayout>

fragment_profile_posts_tab.xml：（这是加载到 viewPager 中的片段）

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:id="@+id/profile_posts_tab"
    >

    <com.github.ksoichiro.android.observablescrollview.ObservableListView
        android:id="@android:id/list"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />

</FrameLayout>

ProfilePostsTabFragment.java:

public class ProfilePostsTabFragment extends android.support.v4.app.ListFragment implements ObservableScrollViewCallbacks {

    private RelativeLayout profileHeader;
    private RelativeLayout profileTabLayout;

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_profile_posts_tab, container, false);

        ObservableListView listView = (ObservableListView) view.findViewById(android.R.id.list);
        listView.setScrollViewCallbacks(this);

        return view;
    }

    @Override
    public void onScrollChanged(int scrollY, boolean firstScroll, boolean dragging) {
    }

    @Override
    public void onDownMotionEvent() {
    }

    @Override
    public void onUpOrCancelMotionEvent(ScrollState scrollState) {
        if (scrollState == ScrollState.UP) {
            if (profileHeaderIsShown()) {
                hideProfileHeader();
            }
        } else if (scrollState == ScrollState.DOWN) {
            if (profileHeaderIsHidden()) {
                showProfileHeader();
            }
        }
    }

    private boolean profileHeaderIsShown() {
        // Toolbar is 0 in Y-axis, so we can say it's shown.
        return profileHeader.getTranslationY() == 0;
    }

    private boolean profileHeaderIsHidden() {
        // Toolbar is outside of the screen and absolute Y matches the height of it.
        // So we can say it's hidden.
        return profileHeader.getTranslationY() == -profileHeader.getHeight();
    }

    private void showProfileHeader() {
        moveProfileHeader(0);
    }

    private void hideProfileHeader() {
        moveProfileHeader(-profileHeader.getHeight());
    }

    private void moveProfileHeader(float toTranslationY) {
        // Check the current translationY
        if (profileHeader.getTranslationY() == toTranslationY) {
            return;
        }

        ValueAnimator animator = ValueAnimator.ofFloat(profileHeader.getTranslationY(), toTranslationY).setDuration(200);
        animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator animation) {
                float translationY = (float) animation.getAnimatedValue();
                profileHeader.setTranslationY(translationY);
                profileTabLayout.setTranslationY(translationY);
                RelativeLayout.LayoutParams lp = (RelativeLayout.LayoutParams) profileTabLayout.getLayoutParams();
                lp.height = getContainerHeight();
                profileTabLayout.setLayoutParams(lp);
                profileTabLayout.requestLayout();
            }
        });
        animator.start();
    }

    private int getContainerHeight() {
        return (getActivity().findViewById(R.id.fragment_container)).getHeight();
    }

    @Override
    public void onActivityCreated(Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
        //Setting Values to the String passed - Tutorial stuff
        String[] values = new String[] { "Iron Man", "Captain America", "Thor",
                "Hulk", "Black Widow", "Spider Man", "Scarlet Witch", "Black Panther",
                "War Machine", "Bucky" };

        this.profileHeader = (RelativeLayout) getActivity().findViewById(R.id.profile_header);
        this.profileTabLayout = (RelativeLayout) getActivity().findViewById(R.id.profile_tab_layout);

        //Hooking up our custom array adaptor
        NotificationsArrayAdapter adapter = new NotificationsArrayAdapter(getActivity(), values);
        setListAdapter(adapter);
    }

    @Override
    public void onListItemClick(ListView l, View v, int position, long id) {
        // TODO implement some logic
        String item = (String) getListAdapter().getItem(position);
        Toast.makeText(getActivity(), item + " selected", Toast.LENGTH_LONG).show();
    }
}

我的问题是这样的：当隐藏 header 时（在 ObservableListView object 上向上滚动时），我在底部看到了这个奇怪的 space。

当 header 布局被隐藏时，如何摆脱它并使我的选项卡布局填满屏幕？ 我尝试了所有方法，包括尝试调整 viewPager 的大小，列表视图的选项卡，但似乎没有任何效果。提前致谢。

Answer 1

尝试在 fragment_profile.xml 中使用垂直方向的线性布局。将所有 relativelayout 替换为 linearlayout

使用可观察的滚动视图时，如何让我的选项卡视图填满整个屏幕？

How can I get my tab view to fill up the entire screen when using an observable scroll view?

android

android-layout

android-fragments

android-tabs