I have an AppBar
and a horizontal linearlayout (which includes an edit text and two imagebuttons) and other things in my layout. When user scrolls down,
Actually, that design seems to be wrong.Why? let me explain that to you.
Except those xmlns:android="http://schemas.android.com/apk/res/android"
which it wasn't necessary or using: android:layout_alignParentTop="true"
in the LinearLayout
or using that ScrollView
under the contents or etc, seems like you don't have any idea what's going on.(no problem).
Note: the most important thing was, adding:
app:layout_behavior="@string/appbar_scrolling_view_behavior"
which also mentioned here:
http://guides.codepath.com/android/Handling-Scrolls-with-CoordinatorLayout
And this flag should hide that section:(exitUntilCollapsed
)
app:layout_scrollFlags="scroll|exitUntilCollapsed"
exitUntilCollapsed:
When the scroll flag is set, scrolling down will normally cause the entire content to move.
So finally: http://i.stack.imgur.com/qf1So.gif
Hope this is what you were looking for, if it wasn't please edit your question and add some screenshots.
Feel free to change the flags or add a new to achieve what you exactly need.
UPDATE:
If you want to hide that Toolbar
(red section) after collapsing, just use this in the CollapsingToolbarLayout
:
app:layout_scrollFlags="scroll|snap"
Finally, you will get the same result(something like googleplay design).
Codes:
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.CoordinatorLayout
android:id="@+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<!-- Your Scrollable contents should be here - such as,
ViewPager or etc -->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:scrollbarSize="15sp"
android:text="You Contents" />
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.AppBarLayout
android:id="@+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsingtoolbarly"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|snap">
<android.support.v7.widget.Toolbar
android:id="@+id/my_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:elevation="4dp"
android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
app:layout_collapseMode="pin"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
<ImageView
android:layout_width="match_parent"
android:layout_height="190dp"
android:minHeight="190dp"
android:scaleType="fitXY"
android:src="@drawable/header"
app:layout_collapseMode="parallax" />
</android.support.design.widget.CollapsingToolbarLayout>
<LinearLayout
android:id="@+id/mylin"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<View
android:layout_width="fill_parent"
android:layout_height="30dp" />
<LinearLayout
android:id="@+id/topLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageButton
android:id="@+id/btn_sil"
android:layout_width="45dp"
android:layout_height="45dp"
android:background="@drawable/ic_arrow_drop_up_black_24dp"
android:gravity="center"
android:paddingBottom="15dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:paddingTop="0dp" />
<EditText
android:id="@+id/et_word"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@android:color/transparent"
android:ems="12"
android:gravity="center" />
<ImageButton
android:id="@+id/btn_getir"
android:layout_width="45dp"
android:layout_height="45dp"
android:background="@drawable/ic_arrow_drop_up_black_24dp"
android:gravity="center"
android:paddingBottom="15dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:paddingTop="0dp" />
</LinearLayout>
</LinearLayout>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
<!-- And finally, NavigationView -->
<!-- <android.support.design.widget.NavigationView
android:id="@+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="@layout/app_header"
app:insetForeground="@color/app_color_primary_dark"
app:menu="@menu/navigation_menu" /> -->
</android.support.v4.widget.DrawerLayout>
Results: after collapsing, the searchedittext won't hide:
UPDATE: New way :)
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.CoordinatorLayout
android:id="@+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="@+id/mylin"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<View
android:layout_width="fill_parent"
android:layout_height="30dp" />
<LinearLayout
android:id="@+id/topLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageButton
android:id="@+id/btn_sil"
android:layout_width="45dp"
android:layout_height="45dp"
android:background="@drawable/ic_arrow_drop_up_black_24dp"
android:gravity="center"
android:paddingBottom="15dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:paddingTop="0dp" />
<EditText
android:id="@+id/et_word"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@android:color/transparent"
android:ems="12"
android:gravity="center" />
<ImageButton
android:id="@+id/btn_getir"
android:layout_width="45dp"
android:layout_height="45dp"
android:background="@drawable/ic_arrow_drop_up_black_24dp"
android:gravity="center"
android:paddingBottom="15dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:paddingTop="0dp" />
</LinearLayout>
</LinearLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<!-- Your Scrollable contents should be here - such as,
ViewPager or etc -->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:scrollbarSize="15sp"
android:text="You Contents" />
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.AppBarLayout
android:id="@+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="@+id/my_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:elevation="4dp"
app:layout_scrollFlags="scroll|enterAlways"
android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
<!-- And finally, NavigationView -->
<!-- <android.support.design.widget.NavigationView
android:id="@+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="@layout/app_header"
app:insetForeground="@color/app_color_primary_dark"
app:menu="@menu/navigation_menu" /> -->
</android.support.v4.widget.DrawerLayout>
Results: