I have an activity contains viewPager inside linear layout inside nestedScrollView and i have 3 fragments inside viewPager and inside each of it recyclerView the problem is viewPager not taking the width of the fragment so when i scroll the recyclerView it is scrolling fine but in the particular part of activity i don't know how to describe this problem correctly but i will insert some of image and code that will show the issue
1- before scrolling
2- when scrolling nestedScrollView in parent activity
3- when scrollin the fragment in viewPager
so i want when i scroll the tabs will scroll util reach to after tool bar i have tried so many solutions but it's not working
and this is the parentActivity.xml
<?xml version="1.0" encoding="utf-8"?>
<data>
<variable
name="presenter"
type="qatar2022.com.ramiissa.components.Profile.FriendProfile.Root.FriendProfilePresenter" />
</data>
<android.support.v4.widget.SwipeRefreshLayout
android:id="@+id/friend_profile_refresh_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
android:fillViewport="true"
android:background="@android:color/white">
<android.support.design.widget.AppBarLayout
android:id="@+id/friend_profile_app_bar_layout"
android:layout_width="match_parent"
android:layout_height="250dp"
android:fitsSystemWindows="true"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/friend_profile_collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleTextAppearance="@style/TextAppearance.AppCompat.Title"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:titleEnabled="false">
<ImageView
android:id="@+id/friend_profile_cover"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
android:src="@drawable/cover"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="@+id/friend_profile_tool_bar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:contentInsetStartWithNavigation="0dp"
app:layout_collapseMode="pin"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="@+id/friend_profile_nested_scroll_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
android:fillViewport="true"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="vertical">
<TextView
android:id="@+id/friend_profile_username"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="60dp"
android:text="Martha Harris"
android:textAppearance="@style/Base.TextAppearance.AppCompat.Title"
android:textColor="@color/grey_90" />
<TextView
android:id="@+id/friend_profile_user_friend_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/spacing_large"
android:layout_marginTop="@dimen/spacing_large"
android:layout_marginRight="@dimen/spacing_large"
android:gravity="center"
android:text="5000 Friends"
android:textAppearance="@style/Base.TextAppearance.AppCompat.Subhead"
android:textColor="@color/grey_60" />
<TextView
android:id="@+id/friend_profile_user_some_info"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/spacing_large"
android:layout_marginTop="@dimen/spacing_large"
android:layout_marginRight="@dimen/spacing_large"
android:gravity="center"
android:text="Some info"
android:textAppearance="@style/Base.TextAppearance.AppCompat.Subhead"
android:textColor="@color/black" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/spacing_large"
android:orientation="horizontal">
<Button
android:id="@+id/friend_profile_user_message_button"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_marginEnd="20dp"
android:background="@drawable/btn_rounded_primary"
android:drawableStart="@drawable/message"
android:drawableTint="@color/white"
android:paddingStart="20dp"
android:paddingEnd="15dp"
android:text="MESSAGE"
android:textColor="@color/white" />
<Button
android:id="@+id/friend_profile_friend_button"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:background="@drawable/btn_rounded_blue_gray"
android:drawableStart="@drawable/friend"
android:drawableTint="@color/white"
android:paddingStart="20dp"
android:paddingEnd="15dp"
android:text="ADD FRIEND"
android:textColor="@color/white" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="15dp"
android:layout_marginTop="10dp"
android:orientation="horizontal">
<ImageView
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_gravity="center_vertical"
app:srcCompat="@drawable/flag_icon" />
<TextView
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:text="@string/profile_nationality"
android:textSize="@dimen/profile_bottom_info_text_size" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=":"
android:textSize="@dimen/profile_bottom_info_text_size" />
<TextView
android:id="@+id/friend_profile_nationality_value_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:layout_marginEnd="10dp"
android:ellipsize="end"
android:maxLines="1"
android:text="Syria"
android:textSize="@dimen/profile_bottom_info_text_size" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="15dp"
android:layout_marginTop="20dp"
android:orientation="horizontal">
<ImageView
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_gravity="center_vertical"
app:srcCompat="@drawable/birthday_icon" />
<TextView
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:text="@string/profile_birthday"
android:textSize="@dimen/profile_bottom_info_text_size" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=":"
android:textSize="@dimen/profile_bottom_info_text_size" />
<TextView
android:id="@+id/friend_profile_birthday_value_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:layout_marginEnd="10dp"
android:ellipsize="end"
android:maxLines="1"
android:text="10-NOVEMBER"
android:textSize="@dimen/profile_bottom_info_text_size" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="15dp"
android:layout_marginTop="20dp"
android:orientation="horizontal">
<ImageView
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_gravity="center_vertical"
app:srcCompat="@drawable/relationship_icon" />
<TextView
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:text="@string/profile_relationship"
android:textSize="@dimen/profile_bottom_info_text_size" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=":"
android:textSize="@dimen/profile_bottom_info_text_size" />
<TextView
android:id="@+id/friend_profile_relationship_value_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:layout_marginEnd="10dp"
android:ellipsize="end"
android:maxLines="1"
android:text="Single"
android:textSize="@dimen/profile_bottom_info_text_size" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="15dp"
android:layout_marginTop="20dp"
android:orientation="horizontal">
<ImageView
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_gravity="center_vertical"
app:srcCompat="@drawable/work_icon" />
<TextView
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:text="@string/profile_working"
android:textSize="@dimen/profile_bottom_info_text_size" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=":"
android:textSize="@dimen/profile_bottom_info_text_size" />
<TextView
android:id="@+id/friend_profile_work_value_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:layout_marginEnd="10dp"
android:ellipsize="end"
android:maxLines="1"
android:text="Android Developer"
android:textSize="@dimen/profile_bottom_info_text_size" />
</LinearLayout>
<android.support.design.widget.TabLayout
android:id="@+id/friend_profile_tab_layout"
style="@style/ProfileTabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:background="@color/grey_300"
android:clipToPadding="false"
android:visibility="visible"
app:tabGravity="fill"
app:tabMode="fixed"
app:tabSelectedTextColor="@color/white"
app:tabTextColor="@color/pale_white" />
<android.support.v4.view.ViewPager
android:id="@+id/friend_profile_view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<de.hdodenhof.circleimageview.CircleImageView
android:id="@+id/friend_profile_user_photo"
android:layout_width="100dp"
android:layout_height="100dp"
android:src="@drawable/example"
app:civ_border_color="@color/white"
app:civ_border_width="1dp"
app:layout_anchor="@+id/friend_profile_app_bar_layout"
app:layout_anchorGravity="bottom|center" />
</android.support.design.widget.CoordinatorLayout>
</android.support.v4.widget.SwipeRefreshLayout>
Can you test my suggestion? Please put TabLayout and ViewPager outside the NestedScrollView and use NestedScrollView inside each fragment layout for parent layout.Of course you can put the page header to a partial and use it by include tag inside the CollapsingToolbarLayout but test first suggestion.
In main layout:
In include_header partial:
I use ratio in constraint layout for background image header: app:layout_constraintDimensionRatio="H,4:3"
This is my design and works perfectly.I had some design likes your design but I decided to change my way to get better result.