我怎样才能让我的标签,以填满整个屏幕用观察到滚动视图的时候? [英] How can I get my tab view to fill up the entire screen when using an observable scroll view?
问题描述
我一直在使用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屋!