I use new android.support.v4.widget.NestedScrollView and I faced with issue.
Here is my layout:
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="250dp">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.7">
<!-- some views inside -->
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:layout_collapseMode="pin"
/>
</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"
>
<WebView
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</android.support.v4.widget.NestedScrollView>
I need to load html inside textView, so I make:
content.setText(Html.fromHtml(htmlString));
And it looks strange. My textview placed at the bottom of screen.
After I swipe on the text it starts to look normal.
And I think textview is not only view with these issue.
I tried use webview, but it even does not show content (I think due to incorrect height computation).
So I need webview or textview to correct work with NestedScrollView.
P.S. If I set textview height in dp then text looks correctly, but I need wrap_content for height.
Updated 08.07.15
Finally I need to use WebView. Alex Facciorusso answer partly works, but I faced with another issue. When WebView content has some specific height then I can see part of the content, but I can't scroll down.
Example:
Read a lot of posts, and custom implementation of WebView as well, but I was keen about experimenting with attributes and found out what works for me, which is this:
For NestedScrollView use attribute
android:fillViewport="true"
and for the underlying WebView make sure you are using height as wrap
<WebView
android:id="#+id/webview"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</WebView>
so as a pseudo code you have
<NestedScrollView> // height= match_parent
<Parent_layout>//could be Realtive/Linear with height= match_parent
<Some_View></Some_View>
<Some_View></Some_View>
<WebView></WebView> // height= wrap_content
</Parent_layout>
</NestedScrollView>
A simple workaround will be to add an empty View with 500dp height below your TextView inside of your LinearLayout. That View shall push up your TextView to the right position.
<android.support.v4.widget.NestedScrollView
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- Your scrolling content -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="#string/random_text" />
<View
android:layout_width="match_parent"
android:layout_height="500dp"/>
</LinearLayout>
I've found a workaround:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
android:id="#+id/main_content"
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:fitsSystemWindows="true">
<android.support.v4.widget.NestedScrollView
android:id="#+id/nestedScrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:minHeight="300dp">
<WebView
android:id="#+id/webview"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</FrameLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="256dp"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsingToolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
I added a minHeight of 500dp to NestedScrollView, and now the WebView is fitting all the height of the layout, and the collapsing toolbar is working.
UPDATED: wrapped WebView with FrameLayout and added minHeight to it.
As Mayur Raiyani said: this issue is resolved in support library version 22.2.1: code.google.com/p/android/issues/detail?id=175234. Thanks all for answers.
wrapped WebView with FrameLayout and added View(android:layout_height="800dp") as WebView'minHeight to it.
This is a bug, update you sdk, replace "compile 'com.android.support:design:22.2.0'" with "compile 'com.android.support:design:22.2.1'" in build.gradle.
That's work for me.
adding android:layout_gravity="fill_vertical" in NestedScrollView will solve your issue
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_gravity="fill_vertical"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="24dp" />
</android.support.v4.widget.NestedScrollView>
Related
I am trying to implement pull to refresh but I'm having an issue with SwipeRefreshLayout not wrapping the child view's height. In the view preview and in a live build it appears to have 0 height.
The layout as as follows:
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="0dp">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
app:layout_collapseMode="pin">
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/swipe_refresh_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include layout="#layout/child_layout" />
</android.support.v4.widget.SwipeRefreshLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
I have also tried making the SwipeRefreshLayout the parent of the AppBarLayout without any success as well as putting a singular LinearLayout inside of the SwipeRefreshLayout. The only thing that seems to prevent the height of the swipe layout from being 0 is to set it statically but I want it to be dynamic based upon the height of the child view.
Is there something I'm missing here? It seems like there may be a bug with SwipeRefreshLayout because replacing it with a LinearLayout that also wraps the content works as expected.
The problem is your SwipeRefreshLayout is inside the Toolbar and AppBarLayout. You must wrap AppBarLayout with another layout and put SwipeRefreshLayout below the AppBarLayout. An example is at the below.
<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"
xmlns:tools="http://schemas.android.com/tools"
android:fitsSystemWindows="true"
tools:context="com.vsahin.moneycim.View.MainActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="250dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark"
android:fitsSystemWindows="true"
app:expanded="false">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="?attr/colorPrimary"
android:fitsSystemWindows="true"
android:background="#drawable/gradient_background">
<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" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.SwipeRefreshLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v4.widget.SwipeRefreshLayout>
</android.support.design.widget.CoordinatorLayout>
if your SwipeRefreshLayout height is wrapping the content of your child_layout, then your child_layoutheight should be set to match_parent OR both SwipeRefreshLayout and child_layout height should be set to match_parent as shown in the Android Documentation
<android.support.v4.widget.SwipeRefreshLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/swiperefresh"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!--Child View-->
<ListView
android:id="#android:id/list"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.v4.widget.SwipeRefreshLayout>
SwipeRefreshLayout is a transparent View, so best solution to set it match_parent it will not conflict with other Views and don't include View or Layout within it, keep it clean
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/swipe_refresh_layout"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="0dp">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
app:layout_collapseMode="pin">
<include layout="#layout/child_layout" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
SwipeRefreshLayout has to be in top to overlay other layers and be clickable
I encountered a problem on first launch of a fragment. It seems like CoordinatorLayout adds a negative margin to NestedScrollView which is equal to CollapsingToolbarLayout's height in collapsed state (I tested it by changing the height's value). As a result RecyclerView which lives in the NestedScrollView cannot scroll up to show few of its bottom items.
There are some similar questions on SO (like this, this and this), but they don't provide a solution that worked for me, and moreover, they don't give any explanations of what can cause the issue.
One interesting note is that if I rotate, or turn the screen off and on it would rebuild the layout and afterwords it will show up correctly. Also, if I click on an item it will trigger something so then I would be able to scroll those hidden items. As a workaround it would be nice to call a function that rebuilds the layout correctly manually but I failed to figure out what it was (see what I tried to do below)
What I tried to do:
adding bottom margin equal to toolbar's height to NestedScrollView. Although it helped on first launch but after I clicked on an item or rotate the screen the extra margin would push the view up from the bottom of the screen.
I couldn't find any problem in my code while debugging.
calling getView.invalidate() didn't help as well.
Can somebody help me to figure out what can cause the issue, please?
fragment_player.xml
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="ru.orgin.glagol.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
android:stateListAnimator="#animator/appbar_always_elevated">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:titleEnabled="false">
<include layout="#layout/player_view"/>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="#dimen/player_toolbar_height"
app:layout_collapseMode="none"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior" >
<ViewAnimator
android:id="#+id/viewAnimator"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inAnimation="#android:anim/fade_in"
android:outAnimation="#android:anim/fade_out">
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="64dp"
android:layout_gravity="center"
style="?android:attr/progressBarStyle"/>
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:nestedScrollingEnabled="false"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<TextView
android:layout_width="match_parent"
android:layout_height="64dp"
android:gravity="center"
android:layout_gravity="center"
android:text="#string/empty_history_books" />
<TextView
android:layout_width="match_parent"
android:layout_height="64dp"
android:gravity="center"
android:layout_gravity="center"
android:text="#string/error_loading_data" />
</ViewAnimator>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
Update:
Still don't know the reason but it seems like adding minHeight attribute to CollapsingToolbarLayout does the trick.
Adding minHeight attribute prevents CollapsingToolbarLayout from unexpected behavior:
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
android:stateListAnimator="#animator/appbar_always_elevated">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/toolbarLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:minHeight="#dimen/player_toolbar_height"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:titleEnabled="false">
<include layout="#layout/player_view"/>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="#dimen/player_toolbar_height"
app:layout_collapseMode="none"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
I have a coordinator layout, which consists of appbarlayout and nestedscrollview. The problem is that when I open the activity, some part of nestedscrollview is by default hidden behind the expanded action bar (difference shown in the images).
XML File :
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:card_view="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/my_appbar_container"
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/collapsing_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:contentScrim="#color/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="#+id/ivToolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:scaleType="fitXY"
android:alpha="0.6"
app:layout_collapseParallaxMultiplier="0.7" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_collapseMode="pin"
android:alpha="1.0"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</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="match_parent"
android:orientation="vertical">
......
.......
I am not able to figure out what's the issue here, and couldn't find anywhere online. Maybe it's a bug. Please check.
I ran into the same problem, setting the layout height of the NestedScrollView to android:layout_height="wrap_content" fixed it for me.
Hope it helps
I solved this problem by having the NestedScrollView inside a FrameLayout like this
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v4.widget.NestedScrollView
android:background="#color/main_color_white"
android:layout_width="match_parent"
android:layout_height="wrap_content">
...............
.............
</android.support.v4.widget.NestedScrollView>
</FrameLayout>
Or you can try adding a padding to your NestedScrollView like this
<android.support.v4.widget.NestedScrollView
android:background="#color/main_color_white"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="?attr/actionBarSize">
................
................
</android.support.v4.widget.NestedScrollView>
Don't know why but this answer worked on my issue.
Btw I faced with this problem only when I change visibility of any view inside nestedScrollView
I am having issues with the expected scroll behavior of a collapsing toolbar layout within an app. To ensure I kinda knew what I was doing I created a simple test project and was able to achieve the desired result, but a NestedScrollView was used in that example and the content that required scrolling was just a RelativeLayout containing a CardView with a lot of text. In the real app the scroll content is a RecyclerView, which I assume is the problem. It is as if the RecyclerView is handling the scrolling and the parent CollapsingToolbar is left out of the loop.
Notice that the app:layout_behavior="#string/appbar_scrolling_view_behavior" is not currently in the layout. I have tried adding it to various places without the desired result.
Attached is an image of the app after a small amount of scrolling has been performed with the collapsing toolbar above not reducing it's height.
<?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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ui.ArticleListActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/toolbar_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/Theme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/theme_primary"
app:contentScrim="#color/theme_primary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
android:src="#drawable/empty_detail"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/app_name"
android:src="#drawable/logo" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/swipe_refresh_layout"
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/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.v4.widget.SwipeRefreshLayout>
</android.support.design.widget.CoordinatorLayout>
According to your code what's missing is that you have to set the scrolling flag "scroll" to the imageview above the Toolbar.
I've done a similar thing and as you can see on the code below, all the views that are meant to react to the RecyclerView Scrolling have the scrolling flag and they are before the views that we don't want to scroll such asthe Toolbar:
<android.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:id="#+id/collapsingToolbar"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="?attr/colorPrimary"
>
<include layout="#layout/movie_details_header_layout" android:id="#+id/headerLayout"
app:layout_scrollFlags="scroll"
/>
<android.support.v7.widget.Toolbar
android:layout_height="56dp"
android:layout_width="match_parent"
android:id="#+id/toolbar"
app:navigationIcon="#drawable/ic_arrow_back"
android:navigationContentDescription="Back"
app:layout_collapseParallaxMultiplier="0.7"
app:layout_collapseMode="pin"
/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
The project came using version 22.x of the compat libraries, updating to 23 seemed to fix everything.
I'm trying to use the newest design library to make my toolbar hide/show on scroll. My issue is the scrolling content I have is in the fragment, I'm just injecting it into the FrameLayout container and it doesn't work. Here's my activity:
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include layout="#layout/layout_toolbar" />
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
<FrameLayout
android:id="#+id/navigation_drawer_container"
android:layout_width="#dimen/navigation_drawer_width"
android:layout_height="match_parent"
android:layout_gravity="start"
tools:layout="#layout/fragment_nav_drawer_anon" />
and my fragment:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/pull_to_refresh"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ListView
android:id="#android:id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</android.support.v4.widget.SwipeRefreshLayout>
<TextView
android:id="#android:id/empty"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textSize="18sp"
android:fontFamily="sans-serif"
android:color="#color/dark_grey"
android:padding="60dp"/>
and toolbar:
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
app:layout_scrollFlags="scroll|enterAlways"
style="#style/Widget.MyApp.ActionBar" />
I'm following official doc and this demo, and still can't figure out how to make it work.
Replace your FrameLayout with android.support.v4.widget.NestedScrollView
NestedScrollView is just like ScrollView, but it supports acting as both a nested scrolling parent and child on both new and old versions of Android. Nested scrolling is enabled by default.
Link to doc
Using FrameLayout as child of CoordinatorLayout works quite well. The toolbar is collapsing like it's supposed to. I had a problem in the beginning, when I used outdated libraries.
Here are the gradle dependencies I'm using right now:
compile 'com.android.support:appcompat-v7:22.2.1'
compile 'com.android.support:cardview-v7:22.2.0'
compile 'com.android.support:recyclerview-v7:22.2.0'
compile 'com.android.support:design:22.2.0'
I'm using FrameLayout with the attribute app:layout_behavior="#string/appbar_scrolling_view_behavior" as a child of CoordinatorLayout in an activity's layout. The FrameLayout serves as container for fragments. My fragment layouts' root elements are either a RecyclerView or a NestedScrollView.
Here is the layout of the activity:
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<FrameLayout
android:id="#+id/..."
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
/>
<android.support.design.widget.AppBarLayout
android:layout_height="192dp"
android:layout_width="match_parent"
>
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
>
<ImageView
android:id="#+id/.."
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
android:src="#drawable/..."
app:layout_collapseMode="parallax"/>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_sessions"
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent"
app:layout_collapseMode="pin"
/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
My first fragment's layout looks like this:
<android.support.v7.widget.RecyclerView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:scrollbars="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="..."
/>
My second fragment's layout looks like this:
<android.support.v4.widget.NestedScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="..."
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="..."
>
...
</android.support.v4.widget.NestedScrollView>
The reason for that behaviour is that the Framelayout doesn't specify a Behaviour. The CoordinatorLayout relies on the child view to handle the Behaviour.
You can read at the bottom here
http://android-developers.blogspot.in/2015/05/android-design-support-library.html
It states that
CoordinatorLayout and custom views
One thing that is important to note is that CoordinatorLayout doesn’t
have any innate understanding of a FloatingActionButton or
AppBarLayout work - it just provides an additional API in the form of
a Coordinator.Behavior, which allows child views to better control
touch events and gestures as well as declare dependencies between each
other and receive callbacks via onDependentViewChanged().
Views can declare a default Behavior by using the
CoordinatorLayout.DefaultBehavior(YourView.Behavior.class)
annotation,or set it in your layout files by with the
app:layout_behavior="com.example.app.YourView$Behavior" attribute.
This framework makes it possible for any view to integrate with
CoordinatorLayout.
Edit: Although FrameLayout is not a custom view, it doesnt specify a behaviour which CoordinateLayout seeks.
In my app it works only with RecyclerView. Maybe you should use RecyclerView instead of ListView.
You can achieve scrolling with Framelayout inside your CoordinatorLayout. For it you have to use app:layout_behavior="#string/appbar_scrolling_view_behavior" inside your frameLayout as well as inside the scrolling view with which you want this collapsing effect.
For ex- If you are inflating RecyclerView inside your frameLayout, then you have to use app:layout_behavior="#string/appbar_scrolling_view_behavior" inside your recyclerrView also.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:orientation="vertical">
<android.support.v7.widget.RecyclerView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
/>
</Relativelayout>
or,
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:orientation="vertical">
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_above="#+id/bNext"
android:fillViewport="true"
android:scrollbars="none"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<!-- your content -->
</android.support.v4.widget.NestedScrollView>
</Relativelayout>
Thus, using this process you can achieve scrolling with frameLayout whether it contains recycler or nestedScrollview.
It's a good question. I too had the same.
Your container FrameLayout is defined right the problem lies with the Fragment. The Fragment should have RecyclerView & not ListView as it is now deprecated.
Example:
<android.support.v7.widget.RecyclerView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
android:paddingTop="#dimen/activity_vertical_margin"/>
I use the same structure in my app & it works perfect.
ListView does not implement NestedScrollingChild so it does not work.
RecyclerView does, so it can propagate the scroll to the NestedScrollingParent (the CoordinatorLayout).
You only need to replace
FrameLayout
to
android.support.v4.widget.NestedScrollView
in this way:
<android.support.design.widget.CoordinatorLayout
android:id="#+id/root_coordinator"
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.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways">
<ImageView
android:layout_width="match_parent"
android:layout_height="192dp"
android:scaleType="centerCrop"
android:src="#drawable/header"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<!-- This was before FrameLayout -->
<android.support.v4.widget.NestedScrollView
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|right"
android:layout_margin="16dp"
android:src="#drawable/ic_drawer_alertas"
app:borderWidth="0dp"
app:fabSize="mini" />
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_drawer"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="#layout/drawer_header"
app:itemIconTint="#color/colorAccent"
app:itemTextColor="#color/colorSecondaryText"
app:menu="#menu/menu_main" />
Move the app:layout_scrollFlags="scroll|enterAlways" from the toolbar to the Framelayout. Sorry for being late.
You must add behavior to the scroll view:
<android.support.v4.widget.SwipeRefreshLayout
android:layout_marginTop="5dp"
android:id="#+id/swipe_main"
android:enabled="false"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<com.marshalchen.ultimaterecyclerview.UltimateRecyclerView
android:id="#+id/rvUserProfile"
app:recyclerviewEmptyView ="#layout/ev_home"
app:recyclerviewClipToPadding="false"
android:layout_width="match_parent"
android:layout_height="match_parent"></com.marshalchen.ultimaterecyclerview.UltimateRecyclerView>
</android.support.v4.widget.SwipeRefreshLayout>