smooth-app-bar-layout
smooth-app-bar-layout copied to clipboard
Position of NestedScrollView and AppBarLayout
Hello, in my layout I have this hierarchy:
<CoordinatorLayout>
<AppBarLayout/>
<NestedScrollView/>
</CoordinatorLayout>
And I can't use SmoothAppBarLayout, because I get incorrect position of views. NestedScrollView draw over AppBarLayout in match_parent of screen. You can fix this?
P.S.: I can't use this hierarchy, because this feature of screen.
<CoordinatorLayout>
<NestedScrollView/>
<AppBarLayout/>
</CoordinatorLayout>
Also not working app:behavior_overlapTop
in NestedScrollView
Hi @Ne1c If you can change the order in your layout, then it may not possible with SmoothAppBarLayout unfortunately.
@henrytao-me i can't do it
@Ne1c Can you show me the mockup of the screen you want to implement?
@henrytao-me
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:piv="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/parent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ebedf0">
<android.support.design.widget.AppBarLayout
android:id="@+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone"
app:elevation="0dp">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:scrimAnimationDuration="0">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="420dp"
app:layout_collapseMode="parallax">
<android.support.v4.view.ViewPager
android:id="@+id/photos_viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<com.rd.PageIndicatorView
android:id="@+id/photosIndicator_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:layout_margin="30dp"
piv:piv_animationType="worm"
piv:piv_viewPager="@id/photos_viewPager"/>
<TextView
android:id="@+id/markedProduct_textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left|bottom"
android:layout_marginBottom="40dp"
android:layout_marginLeft="12dp"
android:background="@drawable/rounded_corner_red_bg"
android:drawableLeft="@drawable/ic_top_sales"
android:drawablePadding="8dp"
android:textColor="@color/white"
android:visibility="gone"/>
</FrameLayout>
<View
android:layout_width="match_parent"
android:layout_height="80dp"
android:background="@drawable/toolbar_gradient"
app:layout_collapseMode="pin"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="@+id/info_scrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:visibility="gone"
app:behavior_overlapTop="26dp"
app:layout_behavior="@string/appbar_scrolling_view_behavior"/>
<android.support.v7.widget.Toolbar
android:id="@id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_marginTop="@dimen/status_bar_margin"
android:background="@android:color/transparent"
android:theme="@style/ThemeOverlay.AppCompat.Dark"
android:visibility="gone"
app:navigationIcon="@drawable/ic_back"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
app:title="@string/product_descr_title"
app:titleTextAppearance="@style/Toolbar.TitleText"/>
<LinearLayout
android:id="@+id/llBottomView"
android:layout_width="match_parent"
android:layout_height="56dp"
android:layout_gravity="bottom"
android:background="@drawable/buy_button_gradient"
android:gravity="center"
android:orientation="horizontal"
android:padding="8dp"
android:visibility="gone">
<LinearLayout
android:id="@+id/call_layout"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_marginRight="4dp"
android:layout_weight="1"
android:background="@drawable/white_border_button_selector"
android:clickable="true"
android:gravity="center"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_call"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:fontFamily="sans-serif-medium"
android:text="@string/call"
android:textAllCaps="true"
android:textColor="@color/colorAccent"/>
</LinearLayout>
<ProgressBar
android:id="@+id/buy_progressBar"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_marginLeft="4dp"
android:layout_weight="1"
android:background="@drawable/blue_border_button_selector"
android:indeterminate="true"
android:padding="8dp"
android:clickable="true"
android:visibility="gone"/>
<LinearLayout
android:id="@+id/buy_layout"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_marginLeft="4dp"
android:layout_weight="1"
android:background="@drawable/blue_border_button_selector"
android:clickable="true"
android:gravity="center"
android:orientation="horizontal">
<ImageView
android:id="@+id/buy_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_call"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:fontFamily="sans-serif-medium"
android:text="@string/in_basket"
android:textAllCaps="true"
android:textColor="@color/white"/>
</LinearLayout>
</LinearLayout>
<ProgressBar
android:id="@+id/progressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"/>
</android.support.design.widget.CoordinatorLayout>
Hi @Ne1c
Can you try this layout?
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:piv="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/parent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ebedf0">
<android.support.v4.widget.NestedScrollView
android:id="@+id/info_scrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="8dp"
android:paddingRight="8dp" />
<me.henrytao.smoothappbarlayout.SmoothAppBarLayout
android:id="@+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone"
app:elevation="0dp">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:scrimAnimationDuration="0">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="420dp"
app:layout_collapseMode="parallax">
<android.support.v4.view.ViewPager
android:id="@+id/photos_viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<com.rd.PageIndicatorView
android:id="@+id/photosIndicator_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:layout_margin="30dp"
piv:piv_animationType="worm"
piv:piv_viewPager="@id/photos_viewPager"/>
<TextView
android:id="@+id/markedProduct_textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left|bottom"
android:layout_marginBottom="40dp"
android:layout_marginLeft="12dp"
android:background="@drawable/rounded_corner_red_bg"
android:drawableLeft="@drawable/ic_top_sales"
android:drawablePadding="8dp"
android:textColor="@color/white"
android:visibility="gone"/>
</FrameLayout>
<View
android:layout_width="match_parent"
android:layout_height="80dp"
android:background="@drawable/toolbar_gradient"
app:layout_collapseMode="pin"/>
</android.support.design.widget.CollapsingToolbarLayout>
</me.henrytao.smoothappbarlayout.SmoothAppBarLayout>
<android.support.v7.widget.Toolbar
android:id="@id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_marginTop="@dimen/status_bar_margin"
android:background="@android:color/transparent"
android:theme="@style/ThemeOverlay.AppCompat.Dark"
android:visibility="gone"
app:navigationIcon="@drawable/ic_back"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
app:title="@string/product_descr_title"
app:titleTextAppearance="@style/Toolbar.TitleText"/>
<LinearLayout
android:id="@+id/llBottomView"
android:layout_width="match_parent"
android:layout_height="56dp"
android:layout_gravity="bottom"
android:background="@drawable/buy_button_gradient"
android:gravity="center"
android:orientation="horizontal"
android:padding="8dp"
android:visibility="gone">
<LinearLayout
android:id="@+id/call_layout"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_marginRight="4dp"
android:layout_weight="1"
android:background="@drawable/white_border_button_selector"
android:clickable="true"
android:gravity="center"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_call"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:fontFamily="sans-serif-medium"
android:text="@string/call"
android:textAllCaps="true"
android:textColor="@color/colorAccent"/>
</LinearLayout>
<ProgressBar
android:id="@+id/buy_progressBar"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_marginLeft="4dp"
android:layout_weight="1"
android:background="@drawable/blue_border_button_selector"
android:indeterminate="true"
android:padding="8dp"
android:clickable="true"
android:visibility="gone"/>
<LinearLayout
android:id="@+id/buy_layout"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_marginLeft="4dp"
android:layout_weight="1"
android:background="@drawable/blue_border_button_selector"
android:clickable="true"
android:gravity="center"
android:orientation="horizontal">
<ImageView
android:id="@+id/buy_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_call"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:fontFamily="sans-serif-medium"
android:text="@string/in_basket"
android:textAllCaps="true"
android:textColor="@color/white"/>
</LinearLayout>
</LinearLayout>
<ProgressBar
android:id="@+id/progressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"/>
</android.support.design.widget.CoordinatorLayout>
@henrytao-me no, because app:behavior_overlapTop="26dp"
will not working
@Ne1c Hi. How did you solve this?
Does anyone have a solution to this in 2019?
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:piv="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/parent" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#ebedf0">
<android.support.v4.widget.NestedScrollView
android:id="@+id/info_scrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="8dp"
android:paddingRight="8dp" />
<me.henrytao.smoothappbarlayout.SmoothAppBarLayout
android:id="@+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone"
app:elevation="0dp">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:scrimAnimationDuration="0">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="420dp"
app:layout_collapseMode="parallax">
<android.support.v4.view.ViewPager
android:id="@+id/photos_viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<com.rd.PageIndicatorView
android:id="@+id/photosIndicator_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:layout_margin="30dp"
piv:piv_animationType="worm"
piv:piv_viewPager="@id/photos_viewPager"/>
<TextView
android:id="@+id/markedProduct_textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left|bottom"
android:layout_marginBottom="40dp"
android:layout_marginLeft="12dp"
android:background="@drawable/rounded_corner_red_bg"
android:drawableLeft="@drawable/ic_top_sales"
android:drawablePadding="8dp"
android:textColor="@color/white"
android:visibility="gone"/>
</FrameLayout>
<View
android:layout_width="match_parent"
android:layout_height="80dp"
android:background="@drawable/toolbar_gradient"
app:layout_collapseMode="pin"/>
</android.support.design.widget.CollapsingToolbarLayout>
</me.henrytao.smoothappbarlayout.SmoothAppBarLayout>
<android.support.v7.widget.Toolbar
android:id="@id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_marginTop="@dimen/status_bar_margin"
android:background="@android:color/transparent"
android:theme="@style/ThemeOverlay.AppCompat.Dark"
android:visibility="gone"
app:navigationIcon="@drawable/ic_back"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
app:title="@string/product_descr_title"
app:titleTextAppearance="@style/Toolbar.TitleText"/>
<LinearLayout
android:id="@+id/llBottomView"
android:layout_width="match_parent"
android:layout_height="56dp"
android:layout_gravity="bottom"
android:background="@drawable/buy_button_gradient"
android:gravity="center"
android:orientation="horizontal"
android:padding="8dp"
android:visibility="gone">
<LinearLayout
android:id="@+id/call_layout"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_marginRight="4dp"
android:layout_weight="1"
android:background="@drawable/white_border_button_selector"
android:clickable="true"
android:gravity="center"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_call"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:fontFamily="sans-serif-medium"
android:text="@string/call"
android:textAllCaps="true"
android:textColor="@color/colorAccent"/>
</LinearLayout>
<ProgressBar
android:id="@+id/buy_progressBar"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_marginLeft="4dp"
android:layout_weight="1"
android:background="@drawable/blue_border_button_selector"
android:indeterminate="true"
android:padding="8dp"
android:clickable="true"
android:visibility="gone"/>
<LinearLayout
android:id="@+id/buy_layout"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_marginLeft="4dp"
android:layout_weight="1"
android:background="@drawable/blue_border_button_selector"
android:clickable="true"
android:gravity="center"
android:orientation="horizontal">
<ImageView
android:id="@+id/buy_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_call"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:fontFamily="sans-serif-medium"
android:text="@string/in_basket"
android:textAllCaps="true"
android:textColor="@color/white"/>
</LinearLayout>
</LinearLayout>
<ProgressBar
android:id="@+id/progressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"/>
</android.support.design.widget.CoordinatorLayout>
vimala
__********** ** ** _ ** ** _ _ _ **