向上滚动时自动隐藏或显示工具栏 android
Auto hide or show tool bar when scroll up android
-
android
-
android-toolbar
-
android-coordinatorlayout
-
android-collapsingtoolbarlayout
-
android-appbarlayout
我想在向上滚动隐藏和向下滚动显示时隐藏工具栏。使用 xml
app:layout_scrollFlags="scroll|enterAlways|snap"
在工具栏中。
请帮我找出我需要的实际输出。滚动到顶部工具栏必须隐藏和向下滚动时显示。
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="@+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="275dp"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="@+id/ivTop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/apple_1"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="50dp"
android:contentInsetStart="0dp"
android:contentInsetLeft="0dp"
android:contentInsetEnd="0dp"
android:contentInsetRight="0dp"
android:padding="5dp"
app:contentInsetEnd="0dp"
app:contentInsetLeft="0dp"
app:contentInsetRight="0dp"
app:contentInsetStart="0dp"
app:layout_collapseMode="parallax"
app:layout_scrollFlags="scroll|enterAlways|snap"
app:popupTheme="@style/AppTheme.PopupOverlay">
<ImageView
android:id="@+id/ivBack"
android:layout_width="35dp"
android:layout_height="35dp"
android:src="@drawable/icon_back_custom"
android:tint="@color/colorPrimary" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:id="@+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="65dp"
android:background="@android:color/transparent"
app:tabBackground="@android:color/transparent"
app:tabIndicatorColor="@android:color/black"
app:tabIndicatorHeight="2.50dp"
app:layout_scrollFlags="scroll|enterAlways|snap"
app:tabMode="fixed"
app:tabPadding="0dp"
app:tabSelectedTextColor="@android:color/black"
app:tabTextColor="@android:color/holo_blue_dark" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<TextView
android:id="@+id/tvTitleTab"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="start|center_vertical"
android:padding="10dp"
android:text="TabSelection"
android:textAlignment="viewStart"
android:textColor="@color/colorAccent"
android:textSize="20sp" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
我怎样才能做到这一点?我想在向上滚动隐藏和向下滚动显示时隐藏工具栏。请帮我找出我需要的实际输出。滚动到顶部工具栏必须隐藏和向下滚动时显示。
我找到了解决方案:
只需使用 app:layout_scrollFlags="scroll|enterAlways"
在 Layout 中制作工具栏和 imageView
像这样
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|enterAlways">
//ImageView
//Toolbar
</RelativeLayout>
完整代码:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="@+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="275dp"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|enterAlways">
<ImageView
android:id="@+id/ivTop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/ic_search"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax" />
<<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="50dp"
android:contentInsetStart="0dp"
android:contentInsetLeft="0dp"
android:contentInsetEnd="0dp"
android:contentInsetRight="0dp"
android:background="@color/blue_cerulean_"
android:padding="5dp"
app:popupTheme="@style/AppTheme.PopupOverlay">
<ImageView
android:id="@+id/ivBack"
android:layout_width="35dp"
android:layout_height="35dp"
android:src="@drawable/ic_search"
android:tint="@color/colorPrimary" />
</android.support.v7.widget.Toolbar>
</RelativeLayout>
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:id="@+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="65dp"
android:background="@android:color/transparent"
app:tabBackground="@android:color/transparent"
app:tabIndicatorColor="@android:color/black"
app:tabIndicatorHeight="2.50dp"
app:layout_scrollFlags="scroll|enterAlways|snap"
app:tabMode="fixed"
app:tabPadding="0dp"
app:tabSelectedTextColor="@android:color/black"
app:tabTextColor="@android:color/holo_blue_dark" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<TextView
android:id="@+id/tvTitleTab"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="start|center_vertical"
android:padding="10dp"
android:text="TabSelection"
android:textAlignment="viewStart"
android:textColor="@color/colorAccent"
android:textSize="20sp" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
android
android-toolbar
android-coordinatorlayout
android-collapsingtoolbarlayout
android-appbarlayout
我想在向上滚动隐藏和向下滚动显示时隐藏工具栏。使用 xml
app:layout_scrollFlags="scroll|enterAlways|snap"
在工具栏中。 请帮我找出我需要的实际输出。滚动到顶部工具栏必须隐藏和向下滚动时显示。
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="@+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="275dp"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="@+id/ivTop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/apple_1"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="50dp"
android:contentInsetStart="0dp"
android:contentInsetLeft="0dp"
android:contentInsetEnd="0dp"
android:contentInsetRight="0dp"
android:padding="5dp"
app:contentInsetEnd="0dp"
app:contentInsetLeft="0dp"
app:contentInsetRight="0dp"
app:contentInsetStart="0dp"
app:layout_collapseMode="parallax"
app:layout_scrollFlags="scroll|enterAlways|snap"
app:popupTheme="@style/AppTheme.PopupOverlay">
<ImageView
android:id="@+id/ivBack"
android:layout_width="35dp"
android:layout_height="35dp"
android:src="@drawable/icon_back_custom"
android:tint="@color/colorPrimary" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:id="@+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="65dp"
android:background="@android:color/transparent"
app:tabBackground="@android:color/transparent"
app:tabIndicatorColor="@android:color/black"
app:tabIndicatorHeight="2.50dp"
app:layout_scrollFlags="scroll|enterAlways|snap"
app:tabMode="fixed"
app:tabPadding="0dp"
app:tabSelectedTextColor="@android:color/black"
app:tabTextColor="@android:color/holo_blue_dark" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<TextView
android:id="@+id/tvTitleTab"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="start|center_vertical"
android:padding="10dp"
android:text="TabSelection"
android:textAlignment="viewStart"
android:textColor="@color/colorAccent"
android:textSize="20sp" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
我怎样才能做到这一点?我想在向上滚动隐藏和向下滚动显示时隐藏工具栏。请帮我找出我需要的实际输出。滚动到顶部工具栏必须隐藏和向下滚动时显示。
我找到了解决方案:
只需使用 app:layout_scrollFlags="scroll|enterAlways"
在 Layout 中制作工具栏和 imageView
像这样
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|enterAlways">
//ImageView
//Toolbar
</RelativeLayout>
完整代码:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="@+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="275dp"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|enterAlways">
<ImageView
android:id="@+id/ivTop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/ic_search"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax" />
<<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="50dp"
android:contentInsetStart="0dp"
android:contentInsetLeft="0dp"
android:contentInsetEnd="0dp"
android:contentInsetRight="0dp"
android:background="@color/blue_cerulean_"
android:padding="5dp"
app:popupTheme="@style/AppTheme.PopupOverlay">
<ImageView
android:id="@+id/ivBack"
android:layout_width="35dp"
android:layout_height="35dp"
android:src="@drawable/ic_search"
android:tint="@color/colorPrimary" />
</android.support.v7.widget.Toolbar>
</RelativeLayout>
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:id="@+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="65dp"
android:background="@android:color/transparent"
app:tabBackground="@android:color/transparent"
app:tabIndicatorColor="@android:color/black"
app:tabIndicatorHeight="2.50dp"
app:layout_scrollFlags="scroll|enterAlways|snap"
app:tabMode="fixed"
app:tabPadding="0dp"
app:tabSelectedTextColor="@android:color/black"
app:tabTextColor="@android:color/holo_blue_dark" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<TextView
android:id="@+id/tvTitleTab"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="start|center_vertical"
android:padding="10dp"
android:text="TabSelection"
android:textAlignment="viewStart"
android:textColor="@color/colorAccent"
android:textSize="20sp" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>