smooth-app-bar-layout icon indicating copy to clipboard operation
smooth-app-bar-layout copied to clipboard

Position of NestedScrollView and AppBarLayout

Open bytewired opened this issue 7 years ago • 12 comments

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>

bytewired avatar Nov 15 '16 15:11 bytewired

Also not working app:behavior_overlapTop in NestedScrollView

bytewired avatar Nov 16 '16 11:11 bytewired

Hi @Ne1c If you can change the order in your layout, then it may not possible with SmoothAppBarLayout unfortunately.

henrytao-me avatar Nov 18 '16 15:11 henrytao-me

@henrytao-me i can't do it

bytewired avatar Nov 18 '16 15:11 bytewired

@Ne1c Can you show me the mockup of the screen you want to implement?

henrytao-me avatar Nov 18 '16 16:11 henrytao-me

@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>

bytewired avatar Nov 21 '16 09:11 bytewired

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 avatar Nov 24 '16 02:11 henrytao-me

@henrytao-me no, because app:behavior_overlapTop="26dp" will not working

bytewired avatar Nov 24 '16 06:11 bytewired

@Ne1c Hi. How did you solve this?

JCarlosR avatar Mar 30 '18 02:03 JCarlosR

Does anyone have a solution to this in 2019?

ivevasiljevic avatar Apr 17 '19 14:04 ivevasiljevic

<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>

vimalcvs avatar Apr 20 '19 05:04 vimalcvs

vimala

vimalcvs avatar Apr 20 '19 05:04 vimalcvs

__********** ** ** _ ** ** _ _ _ **

vimalcvs avatar Apr 20 '19 05:04 vimalcvs