我怎样才能让我的标签,以填满整个屏幕用观察到滚动视图的时候? [英] How can I get my tab view to fill up the entire screen when using an observable scroll view?

查看:313
本文介绍了我怎样才能让我的标签,以填满整个屏幕用观察到滚动视图的时候?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我一直在使用Android的ObservableScrollView库( https://github.com/ksoichiro/Android- ObservableScrollView )来实现,当一个ListView滚动的消失一个头(一个相对布局)。这是ListView控件嵌入viewPager内积累标签功能。这里是我的布局的截图:

I've been using Android-ObservableScrollView Library (https://github.com/ksoichiro/Android-ObservableScrollView) to implement a header (a Relative Layout) that disappears when a listView is scrolled. This listView is embedded within a viewPager to accumulate Tab functionality. Here's a screenshot of my layout:

布局在默认状态

我已经实现了低于code动画并成功隐藏标题。

I've implemented the below code to animate and hide the header successfully.

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();
    }
}

我的问题是这样的:我得到的底部这个奇怪的空间时,头被隐藏时(ObservableListView对象向上滚动)

在这里输入的形象描述

我怎样才能摆脱它,使我的标签布局填充屏幕的时候头布局是隐藏的吗我什么都试过,从试图调整viewPager,标签到ListView但似乎没有任何工作。先谢谢了。

How can I get rid of it and make my tab layout fill the screen when the header layout is hidden? I tried everything from trying to resize the viewPager, tabs to the listView but nothing seems to work. Thanks in advance.

推荐答案

尝试使用的LinearLayout与方向与垂直fragment_profile.xml。与LinearLayout中替换所有的RelativeLayout

Try using linearlayout with orientation vertical in the fragment_profile.xml. Replace all relativelayout with linearlayout

这篇关于我怎样才能让我的标签,以填满整个屏幕用观察到滚动视图的时候?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆