android: Expandable listview going inside tablayout - android

i have a coordinator layout with collapsable toolbar and below it i have a tablayout and a viewpager and the viewpager contains an expandable listview. When the toolbar collapses the viewpager goes inside the tablayout even if i have specified margins. I have attached links to images below.
Any help is appreciated. Pls help.
http://imgur.com/aK1gyAj.jpg
http://imgur.com/aoa6aUL.jpg
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/coordinatorlayout_asset"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
tools:ignore="RtlHardcoded">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar_asset"
android:layout_width="match_parent"
android:layout_height="330dp"
android:layout_marginBottom="56dp"
android:background="#android:color/transparent"
android:fitsSystemWindows="true"
android:theme="#style/Theme.AppCompat.Light.NoActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsingtoolbar_asset"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/transparent"
android:fitsSystemWindows="true"
app:contentScrim="#color/white"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="top"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax">
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout_charts_asset"
android:layout_width="match_parent"
android:layout_height="0dp" />
<android.support.v4.view.ViewPager
android:id="#+id/pager_charts_asset"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignBottom="#+id/imageView_dots_asset"
android:paddingTop="0dp" />
<ImageView
android:id="#+id/imageView_dots_asset"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginBottom="96dp"
android:src="#drawable/united1"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>
<FrameLayout
android:id="#+id/frame_layout_asset"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="bottom|center_horizontal"
android:background="#color/colorPrimary"
android:orientation="vertical"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier=".11">
<LinearLayout
android:id="#+id/linear_layout_asset"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="bottom"
android:gravity="center"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_gravity="center_horizontal"
android:layout_weight="1"
android:gravity="center"
android:text="Quila"
android:textColor="#android:color/white"
android:textSize="20sp" />
</LinearLayout>
</FrameLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/nestedscrollview_asset"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:layout_marginTop="56dp"
app:layout_anchor="#id/appbar_asset"
app:layout_anchorGravity="bottom"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v4.view.ViewPager
android:id="#+id/pager_asset"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.v4.widget.NestedScrollView>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_asset"
android:layout_width="match_parent"
android:layout_height="80dp"
android:background="#color/tab_color"
app:layout_anchor="#id/frame_layout_asset"
app:theme="#style/ThemeOverlay.AppCompat.Dark"
app:title="">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<Space
android:layout_width="#dimen/image_final_width"
android:layout_height="#dimen/image_final_width" />
<TextView
android:id="#+id/tv_toolbar_title"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginLeft="8dp"
android:gravity="center_vertical"
android:text="Bank Name"
android:textColor="#android:color/white"
android:textSize="20sp" />
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout_asset"
android:layout_width="match_parent"
android:layout_height="32dp"
android:background="#color/tab_color"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_anchor="#id/toolbar_asset"
app:layout_anchorGravity="bottom"
app:tabIndicatorColor="#color/white" />
<de.hdodenhof.circleimageview.CircleImageView
android:layout_width="#dimen/image_width"
android:layout_height="#dimen/image_width"
android:layout_gravity="center_horizontal"
android:src="#drawable/newUser"
app:finalHeight="#dimen/image_final_width"
app:finalYPosition="2dp"
app:layout_behavior="com.aswin.AvatarImageBehavior"
app:startHeight="2dp"
app:startToolbarPosition="2dp"
app:startXPosition="2dp" />
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:paddingLeft="10dp"
android:paddingRight="10dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ExpandableListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/expandable_listview"
android:divider="#color/black"
android:layout_gravity="top">
</ExpandableListView>
</LinearLayout>

Related

Smooth Scrolling on Collapsing toolbar with tablayout

I am trying to create a Tablayout with ViewPager that collapse at the top on scroll but the scrolling is not smooth and the tab swiping as well. This is my layout
<?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:id="#+id/htab_maincontent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/htab_appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/htab_collapse_toolbar"
android:layout_width="match_parent"
android:layout_height="256dp"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap"
android:background="#drawable/profile_gradient"
app:titleEnabled="false">
<RelativeLayout
android:id="#+id/htab_header2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax">
<LinearLayout
android:id="#+id/profile_background"
android:layout_width="match_parent"
android:layout_height="250dp"
android:layout_alignParentTop="true"
android:background="#drawable/girl"
android:orientation="vertical"/>
<LinearLayout
android:id="#+id/profile_gradient"
android:layout_width="match_parent"
android:layout_height="250dp"
android:layout_alignParentTop="true"
android:background="#drawable/profile_gradient"
android:orientation="vertical"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="#numerouno"
android:textColor="#color/white"
android:textSize="18sp"
android:textStyle="bold" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_marginEnd="10dp"
android:background="#drawable/ic_settings_black_24dp" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignStart="#id/profile_image"
android:layout_centerVertical="true"
android:layout_marginStart="30dp"
android:orientation="vertical">
<TextView
android:id="#+id/followers_count_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="200K"
style="#style/follower_following_count"
android:textAlignment="center" />
<TextView
android:id="#+id/followers_text"
style="#style/follower_following"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Followers" />
</LinearLayout>
<de.hdodenhof.circleimageview.CircleImageView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/profile_image"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_gravity="center"
android:layout_marginTop="10dp"
android:src="#drawable/girl" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignEnd="#id/profile_image"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:layout_marginEnd="30dp"
android:orientation="vertical">
<TextView
android:id="#+id/following_count_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="200K"
style="#style/follower_following_count"
android:textAlignment="center" />
<TextView
android:id="#+id/following_text"
style="#style/follower_following"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Following" />
</LinearLayout>
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center"
android:id="#+id/name_layout">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Bradt Daniels"
android:id="#+id/full_name"
style="#style/profileFullName"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableStart="#drawable/ic_location_on"
android:text="Hilltop, Mount View"
style="#style/profileFullName"
android:textSize="15sp"
android:textColor="#color/yellow"/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
<!--<View-->
<!--android:layout_width="match_parent"-->
<!--android:layout_height="match_parent"-->
<!--android:alpha="0.3"-->
<!--android:background="#android:color/black"-->
<!--android:fitsSystemWindows="true"/>-->
<android.support.v7.widget.Toolbar
android:id="#+id/htab_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="top"
android:layout_marginBottom="48dp"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
<android.support.design.widget.TabLayout
android:id="#+id/htab_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
app:tabIndicatorColor="#android:color/white"
app:tabSelectedTextColor="#android:color/white"
app:tabTextColor="#color/white_70"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/htab_viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
Evertyhing works fine without the RelativeLayout. And I need that layout for other implementation.
I am trying to create something synonymous to twitter profile page
Any help will be appreciated

I have the same problem with you, make it like this
<?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.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="350dp"
android:fitsSystemWindows="true"
app:contentScrim="#color/colorPrimary"
app:expandedTitleTextAppearance="#android:color/transparent"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="#+id/iv_stadium"
android:layout_width="match_parent"
android:layout_height="350dp"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax" />
<ImageView
android:layout_width="match_parent"
android:layout_height="350dp"
android:src="#color/blackTransparent"
app:layout_collapseMode="parallax" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:id="#+id/iv_badge"
android:layout_width="100dp"
android:layout_height="100dp"
app:layout_collapseMode="parallax" />
<TextView
android:id="#+id/tv_year"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:gravity="center"
android:textColor="#android:color/white" />
<TextView
android:id="#+id/tv_stadium"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textColor="#android:color/white" />
</LinearLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.design.widget.TabLayout
android:id="#+id/tablayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
app:tabMode="fixed" />
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>

scrollview with recyclerview in fragment

This is the fragment that I put in the viewPager
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:fab="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/fragment_own_product_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/profile_bg"
tools:context="fyp.hkust.facet.fragment.OwnProductFragment">
<android.support.v7.widget.RecyclerView
android:id="#+id/ownproductlist"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentEnd="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentStart="true"
android:padding="5dp">
</android.support.v7.widget.RecyclerView>
<com.melnykov.fab.FloatingActionButton
android:id="#+id/add_product_fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_margin="16dp"
android:elevation="6dp"
android:src="#mipmap/ic_plus_white_36dp"
fab:fab_colorNormal="#color/colorPrimary"
fab:fab_colorPressed="#color/primary_pressed"
fab:fab_colorRipple="#color/ripple"
fab:fab_shadow="true" />
The following is the activity
Updated:
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/profile_coordinator_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".activity.MainActivity">
<!-- your content layout -->
<LinearLayout
android:id="#+id/profile_linear_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
app:elevation="0dp">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
app:elevation="0dp" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/profile_scrollview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<RelativeLayout
android:id="#+id/activity_profile"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/profile_bg"
tools:context="fyp.hkust.facet.activity.ProfileActivity">
<RelativeLayout
android:id="#+id/profile_layout"
android:layout_width="match_parent"
android:layout_height="150dp"
android:orientation="vertical"
android:weightSum="1">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/profile_picture"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_marginBottom="25dp"
android:layout_marginLeft="20dp"
android:layout_marginTop="25dp"
android:elevation="6dp"
android:src="#mipmap/app_icon" />
<Button
android:id="#+id/btn_edit"
android:layout_width="60dp"
android:layout_height="35dp"
android:layout_alignBottom="#+id/profile_email"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:layout_marginBottom="5dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="20dp"
android:adjustViewBounds="true"
android:background="#drawable/border_button_no_bg"
android:clickable="true"
android:contextClickable="true"
android:scaleType="fitCenter"
android:text="#string/edit_btn_text"
android:textColor="#color/font_color_pirmary" />
<TextView
android:id="#+id/profile_username"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginLeft="20dp"
android:layout_marginTop="47dp"
android:layout_toEndOf="#+id/profile_picture"
android:layout_toStartOf="#+id/btn_edit"
android:text="#string/profile_username"
android:textSize="12sp" />
<TextView
android:id="#+id/profile_email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/profile_username"
android:layout_toEndOf="#+id/profile_picture"
android:layout_toStartOf="#+id/btn_edit"
android:paddingLeft="20dp"
android:paddingTop="10dp"
android:text="#string/profile_email"
android:textColor="#color/profile_email_text_color"
android:textSize="10sp" />
</RelativeLayout>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/profile_layout"
android:background="#color/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:tabGravity="fill"
app:tabIndicatorColor="#color/white"
app:tabMode="fixed"
app:tabSelectedTextColor="#color/white"
app:tabTextColor="#color/grey_title" />
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/tabs"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
How can I make it to let me scroll the whole view instead of scrolling only in the recycler view like instragram? Thank you.

Use NestedScrollview
Instead of scrollview.
You can enable / disable recyclerview's nested scrolling feature according to you need.
Scroll view doesn't support nested scrolling. Where as nested scroll view will give you what you need.
You should try following this hierarchy
<?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:id="#+id/coordinator_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="192dp">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white"
app:contentScrim="#color/action_bar"
app:expandedTitleGravity="right"
app:layout_scrollFlags="scroll|enterAlways">
<RelativeLayout
android:id="#+id/app_images_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="10dp"
app:layout_collapseMode="parallax">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="below will be your elements" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/accent"
app:tabGravity="fill"
app:tabIndicatorHeight="2dp"
app:tabMode="fixed" />
</RelativeLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>

Change this ,at the end of the xml layout close the ScrollView .Place it below the Relative layout.
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/profile_scrollview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<RelativeLayout
android:id="#+id/activity_profile"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/profile_bg"
tools:context="fyp.hkust.facet.activity.ProfileActivity">
<RelativeLayout
android:id="#+id/profile_layout"
android:layout_width="match_parent"
android:layout_height="150dp"
android:orientation="vertical"
android:weightSum="1">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/profile_picture"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_marginBottom="25dp"
android:layout_marginLeft="20dp"
android:layout_marginTop="25dp"
android:elevation="6dp"
android:src="#mipmap/app_icon" />
<Button
android:id="#+id/btn_edit"
android:layout_width="60dp"
android:layout_height="35dp"
android:layout_alignBottom="#+id/profile_email"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:layout_marginBottom="5dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="20dp"
android:adjustViewBounds="true"
android:background="#drawable/border_button_no_bg"
android:clickable="true"
android:contextClickable="true"
android:scaleType="fitCenter"
android:text="#string/edit_btn_text"
android:textColor="#color/font_color_pirmary" />
<TextView
android:id="#+id/profile_username"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginLeft="20dp"
android:layout_marginTop="47dp"
android:layout_toEndOf="#+id/profile_picture"
android:layout_toStartOf="#+id/btn_edit"
android:text="#string/profile_username"
android:textSize="12sp" />
<TextView
android:id="#+id/profile_email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/profile_username"
android:layout_toEndOf="#+id/profile_picture"
android:layout_toStartOf="#+id/btn_edit"
android:paddingLeft="20dp"
android:paddingTop="10dp"
android:text="#string/profile_email"
android:textColor="#color/profile_email_text_color"
android:textSize="10sp" />
</RelativeLayout>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/profile_layout"
android:background="#color/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:tabGravity="fill"
app:tabIndicatorColor="#color/white"
app:tabMode="fixed"
app:tabSelectedTextColor="#color/white"
app:tabTextColor="#color/grey_title" />
<LinearLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/tabs"
android:orientation="vertical">
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</LinearLayout>
</RelativeLayout>
</ScrollView>

How to make long images fit in the CollapsibleToolbar

I am tying to add image in a Fragment with image at the top and parallax effect when scrolled down. I tried doing this using Collapsible Toolbar, but image is not filling up the Collapsible Toolbar, and parallax is not working.
I want something like this
But this is what I achieved till now.
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
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"
xmlns:card_view="http://schemas.android.com/tools"
android:id="#+id/drawerlayout1">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/coordinatorlayout"
android:layout_width="fill_parent"
android:layout_height="match_parent"
app:expandedTitleMarginStart="70dp">
<android.support.design.widget.AppBarLayout
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:layout_width="fill_parent"
android:id="#+id/actionbarlayout"
android:layout_height="207dp">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/CollapsingToolbarLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:contentScrim="#color/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
>
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:id="#+id/details_Image"
app:layout_collapseMode="parallax"
/>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar1"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_collapseMode="pin"
android:minHeight="?attr/actionBarSize"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardElevation="3dp"
card_view:cardCornerRadius="7dp"
android:layout_margin="5dp"
android:id="#+id/new_order"
card_view:cardBackgroundColor="#color/cardview_shadow_end_color"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal"
android:layout_marginTop="15dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/download"
android:background="#null"
android:src="#drawable/ic_action_ic_file_download_white_36dp"
android:layout_centerInParent="true"
/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/favourite"
android:layout_centerInParent="true"
/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/zoom"
android:background="#null"
android:src="#drawable/ic_action_ic_zoom_out_map_white_36dp"
android:layout_centerInParent="true"
/>
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="20dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/imageDescription"
android:text="keckwcbjbewbcbcbcwjbejwkbcwkbcbwjc"
/>
</ScrollView>
</LinearLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:visibility="gone"
android:id="#+id/fullimage"/>
</android.support.design.widget.CoordinatorLayout>

<android.support.design.widget.CoordinatorLayout
android:id="#+id/coordinatorlayout"
android:layout_width="fill_parent"
android:layout_height="match_parent"
app:expandedTitleMarginStart="70dp">
<android.support.design.widget.AppBarLayout
android:id="#+id/actionbarlayout"
android:layout_width="fill_parent"
android:layout_height="207dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/CollapsingToolbarLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:contentScrim="#color/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="#+id/details_Image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:background="#color/colorAccent"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar1"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:minHeight="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:id="#+id/new_order"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
card_view:cardBackgroundColor="#color/cardview_shadow_end_color"
card_view:cardCornerRadius="7dp"
card_view:cardElevation="3dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:gravity="center"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<ImageButton
android:id="#+id/download"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="#drawable/ic_action_ic_file_download_white_36dp"
android:background="#null" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<ImageView
android:id="#+id/favourite"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<ImageButton
android:id="#+id/zoom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="#drawable/ic_action_ic_zoom_out_map_white_36dp"
android:background="#null" />
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="20dp">
<TextView
android:id="#+id/imageDescription"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="keckwcbjbewbcbcbcwjbejwkbcwkbcbwjc"
/>
</ScrollView>
</LinearLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<ImageView
android:id="#+id/fullimage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:visibility="gone" />
</android.support.design.widget.CoordinatorLayout>
Replace your code with this.

How to show ViewPager in NestedScrollView in android?

Please help me, my ViewPager is not visible in NestedScrollView. What should i do? I have spent much time to try to make vp visible but it's not success. If i set fixed height of viewpager then it will be visible, but i don't want that. Here is my xml:
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".activities.StoryDetailActivity">
<android.support.design.widget.AppBarLayout
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/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="#+id/img_banner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:contentDescription="#string/app_name"
android:src="#drawable/test"
app:layout_collapseMode="parallax"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.CollapsingToolbarLayout>
</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="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="#dimen/dimen_6x"
android:orientation="horizontal"
android:paddingLeft="#dimen/dimen_1x"
android:paddingRight="#dimen/dimen_1x">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginLeft="#dimen/dimen_1x"
android:layout_marginRight="#dimen/dimen_1x"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical"
android:paddingLeft="#dimen/dimen_1x"
android:paddingRight="#dimen/dimen_1x">
<com.nm.story.widgets.textview.TextViewLight
android:id="#+id/lbl_views"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/textColorSecondary"
android:textSize="#dimen/text_size_xnormal" />
<ImageView
android:layout_width="#dimen/tiny_icon"
android:layout_height="#dimen/tiny_icon"
android:contentDescription="#string/app_name"
android:src="#drawable/ic_visibility_grey" />
</LinearLayout>
<View
android:layout_width="#dimen/divider"
android:layout_height="match_parent"
android:layout_marginBottom="#dimen/dimen_1x"
android:layout_marginTop="#dimen/dimen_1x"
android:background="#color/dividerColor" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginLeft="#dimen/dimen_1x"
android:layout_marginRight="#dimen/dimen_1x"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical"
android:paddingLeft="#dimen/dimen_1x"
android:paddingRight="#dimen/dimen_1x">
<com.nm.story.widgets.textview.TextViewLight
android:id="#+id/lbl_likes"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/textColorSecondary"
android:textSize="#dimen/text_size_xnormal" />
<ImageView
android:layout_width="#dimen/tiny_icon"
android:layout_height="#dimen/tiny_icon"
android:contentDescription="#string/app_name"
android:src="#drawable/ic_like_grey" />
</LinearLayout>
<View
android:layout_width="#dimen/divider"
android:layout_height="match_parent"
android:layout_marginBottom="#dimen/dimen_1x"
android:layout_marginTop="#dimen/dimen_1x"
android:background="#color/dividerColor" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginLeft="#dimen/dimen_1x"
android:layout_marginRight="#dimen/dimen_1x"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical"
android:paddingLeft="#dimen/dimen_1x"
android:paddingRight="#dimen/dimen_1x">
<com.nm.story.widgets.textview.TextViewLight
android:id="#+id/lbl_chapter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:textColor="#color/textColorSecondary"
android:textSize="#dimen/text_size_xnormal" />
</LinearLayout>
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="#dimen/divider"
android:layout_marginLeft="#dimen/dimen_2x"
android:layout_marginRight="#dimen/dimen_2x"
android:background="#color/dividerColor" />
<com.nm.story.widgets.textview.TextViewItalic
android:id="#+id/lbl_review"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="#dimen/dimen_2x"
android:maxLines="6"
android:textColor="#color/textColorPrimary"
android:textSize="#dimen/text_size_xnormal" />
<android.support.v4.view.ViewPager
android:id="#+id/pager_chapter"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/dimen_2x"
android:layout_marginRight="#dimen/dimen_2x" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs_chapter"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/dimen_2x"
android:layout_marginRight="#dimen/dimen_2x"
app:tabMode="scrollable" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView></android.support.design.widget.CoordinatorLayout>

AppBarLayout not working with RecyclerView in android 23.0.1

I am facing an issue while implementing AppBarLayout animation with RecyclerView. It is not working. But if i replace RecyclerView with NesterRecyclerView it works fine. Please help me to fix this...
<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:clickable="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/main.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/main.collapsing"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="#+id/Company_Cover_Image"
android:layout_width="match_parent"
android:layout_height="250dp"
android:scaleType="centerCrop"
android:src="#drawable/bg"
android:tint="#11000000"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.9" />
<FrameLayout
android:id="#+id/main.framelayout.title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:background="#color/bottom_bar_color"
android:orientation="vertical"
android:padding="10dp"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.3">
<LinearLayout
android:id="#+id/main.linearlayout.title"
android:layout_width="match_parent"
android:layout_height="65dp"
android:layout_gravity="center"
android:gravity="bottom"
android:orientation="vertical">
<TextView
android:id="#+id/Company_Name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="bottom|center"
android:text="Name"
android:textColor="#android:color/white"
android:textSize="25sp" />
<TextView
android:id="#+id/Company_Location"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="Location"
android:textColor="#android:color/white" />
</LinearLayout>
</FrameLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/Company_Detail_Listview"
android:layout_width="match_parent"
android:layout_height="400dp"
android:nestedScrollingEnabled="false"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</android.support.design.widget.CoordinatorLayout>
Thanks

Replace your layout code with this layout code:
<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:clickable="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/main.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/main.collapsing"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="#+id/Company_Cover_Image"
android:layout_width="match_parent"
android:layout_height="250dp"
android:scaleType="centerCrop"
android:src="#drawable/bg"
android:tint="#11000000"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.9" />
<FrameLayout
android:id="#+id/main.framelayout.title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:background="#color/bottom_bar_color"
android:orientation="vertical"
android:padding="10dp"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.3">
<LinearLayout
android:id="#+id/main.linearlayout.title"
android:layout_width="match_parent"
android:layout_height="65dp"
android:layout_gravity="center"
android:gravity="bottom"
android:orientation="vertical">
<TextView
android:id="#+id/Company_Name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="bottom|center"
android:text="Name"
android:textColor="#android:color/white"
android:textSize="25sp" />
<TextView
android:id="#+id/Company_Location"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="Location"
android:textColor="#android:color/white" />
</LinearLayout>
</FrameLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</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">
<android.support.v7.widget.RecyclerView
android:id="#+id/Company_Detail_Listview"
android:layout_width="match_parent"
android:layout_height="400dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
<!--android:nestedScrollingEnabled="false"-->
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
I hope it work.

Categories

Resources