I have a main activity with a appbar layout(also containing a navigation view) and a fragment with a tablayout . I want the user to be able to hide and show both of them while scrolling like Google Play Music app.But I just can't get the app bar to hide as it is not in the fragment although the tablayout is getting hidden fine.Also I can't move the appbar layout into the fragment as this will make my code for switching between fragments using navigation view very complicated.I am using coordinator layout for achieving this.How do I achieve this?.My code is as below-
WelcomeActivity
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include
android:id="#+id/welcome_toolbar"
layout="#layout/default_toolbar_layout"
app:layout_scrollFlags="scroll|enterAlways"/>
<FrameLayout
android:id="#+id/welcome"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|enterAlways">
</FrameLayout>
</LinearLayout>
<android.support.design.widget.NavigationView
android:id="#+id/welcome_nav"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:menu="#menu/welcome_menu_drawer"/>
</android.support.v4.widget.DrawerLayout>
Myfragment.xml
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/toolbar_gradient">
<android.support.design.widget.AppBarLayout
android:id="#+id/welcome_feeds_appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.TabLayout
android:id="#+id/welcome_feeds_tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/toolbar_gradient"
app:tabGravity="fill"
app:tabSelectedTextColor="#fff"
app:tabIndicatorColor="#color/accent"
app:layout_scrollFlags="scroll|enterAlways"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/welcome_feeds_viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
<com.software.shell.fab.ActionButton
android:id="#+id/welcome_feeds_fab"
android:layout_width="56dp"
android:layout_height="56dp"
android:layout_gravity="bottom|right"
android:layout_marginRight="16dp"
android:layout_marginBottom="16dp"
app:button_color="#color/accent"
app:image="#mipmap/add"
app:image_size="24dp"
/>
</android.support.design.widget.CoordinatorLayout>
I haven't tried your code yet.....
Is your tabLayout correctly swipe out the screen on scrolling?
Have you tried to move inside CoordinatorLayout also the Toolbar?
To use the features by design Library all the elements have to be inside CoordinatorLayout and you have to set as your needs the correct property "app:layout_scrollFlags"
Related
I'm trying to implement BottomAppBar where I would handle the navigation of a WebView.
<androidx.coordinatorlayout.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=".MainActivity">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.swiperefreshlayout.widget.SwipeRefreshLayout
android:id="#+id/swipe_refresh_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<WebView
android:id="#+id/web_view"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<com.google.android.material.bottomappbar.BottomAppBar
android:id="#+id/bottom_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
app:layout_behavior="com.google.android.material.bottomappbar.BottomAppBar$Behavior"
app:hideOnScroll="true"
app:fabAttached="true"
app:fabAlignmentMode="end"
app:layout_scrollFlags="scroll|enterAlways"/>
</android.support.design.widget.AppBarLayout>
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_share"
android:tint="#fff"
app:layout_anchor="#id/bottom_bar"
app:backgroundTint="#color/colorPrimary"/>
Everything works fine but I want to be able to show and hide the BottomAppBar when the users scrolls down and up respectively just as is the behavior here.
I couldn't find a tutorial on that anywhere so has someone implemented a solution on it?
Try settting app:hideOnScroll without setting app:layout_behavior or app:layout_scrollFlags. And remove the AppBarLayout parent view so the BottomAppBar is just a direct child of the CoordinatorLayout.
HideOnScroll does not work with ScrollView instead, use NestedScrollView.
you can use this, when you wont to hide or show your BottomNavigationView or BottomAppBar add one of this line in your method of Scrolling :
..
int height = bottomAppBar.getHeight();
//Hide
bottomAppBar.clearAnimation();
bottomAppBar.animate().translationY(height).setDuration(200);
//Show
bottomAppBar.clearAnimation();
bottomAppBar.animate().translationY(0).setDuration(200);
..
I have the following layout file
activity_main.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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/my_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
app:contentInsetEnd="0dp"
app:contentInsetStart="0dp"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
<ImageView
android:id="#+id/toolbar_icon_image_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:paddingBottom="7dp"
android:paddingLeft="5dp"
android:paddingTop="7dp"
android:scaleType="centerInside"
android:src="#drawable/toolbar_icon"/>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/swipeRefreshLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:id="#+id/main_grid_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.ViewPager
android:id="#+id/content_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/sliding_tabs"/>
<com.ili.view.SlidingTabLayout
android:id="#+id/sliding_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"/>
</RelativeLayout>
</android.support.v4.widget.SwipeRefreshLayout>
<!-- The navigation drawer -->
<ListView
android:id="#+id/left_drawer"
android:layout_width="275dp"
android:layout_height="match_parent"
android:layout_gravity="left"
android:choiceMode="singleChoice"
android:descendantFocusability="beforeDescendants"/>
</android.support.v4.widget.DrawerLayout
</android.support.design.widget.CoordinatorLayout>
Expected behavior:
I would like the latter to show when I open the app, and the toolbar to hide upon scrolling.
But with my activity_main.xml I am getting the following behavior:
And after scrolling down, the toolbar hides(as expected) and the SlidingTabLayout shows.
But I would like my tab layout to remain fixed below the view pager.
Now I know that this may be because I'm setting the behavior of the whole drawer layout to app:layout_behavior="#string/appbar_scrolling_view_behavior", so I tried to separate the SlidingTabLayout and put it outside the drawer layout and it worked as expected, except that the SlidingTabLayout stayed over the last row of the list in my ViewPager, since in CoordinatorLayout I cannot tell DrawerLayout to remain on top of my SlidingTabLayout.
So anyone knows how I can make the toolbar hide upon scrolling but with my SlidingTabLayout to remain fixed and not hide the last row of the list?
I want to create a layout like the below image:
A CoordinatorLayout which contain :
CollapsingToolbarLayout( contain ImageView & Toolbar)
RecyclerView
TabLayout
ViewPager( that each fragment of it contain a RecyclerView)
I wanna responding to scroll events in this way:
CollapsingToolbarLayout expand and collapse by scrolling
Toolbar sticks to the top until TabLayout reach to the top
After that toolbar scroll up and TabLayout stick to the top
I'm having trouble with the RecyclerView between CollapsingToolbarLayout and TabLayout. I can implement this layout without that RecyclerView( I put CollapsingToolbarLayout and TabLayout inside the AppBarLayout and the ViewPager outside it, inside the CoordinatorLayout).
My Question:
Where should I put that RecyclerView?
Which & where layout_scrollFlags and layout_behavior should I set for each layouts?
It seems that AppBarLayout have a limited height. When I put the RecyclerView inside AppBarLayout, only a portion part of the RecyclerView is visible and also TabLayout disappear.
I read lots of tutorials like this one and lots of questions like this one and this one, but non of them help me.
use this as a main layout
activity_main
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.SwipeRefreshLayout 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/swipe_refresh_layout_profile"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:ignore="RtlHardcoded">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/co_profile_activity_root_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
android:visibility="visible">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar_profile"
android:layout_width="match_parent"
android:layout_height="#dimen/profile_img_placeholder_height"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapse_toolbar_profile"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">
<RelativeLayout
android:id="#+id/rel_top"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop">
<ImageView
android:id="#+id/img_bg_placeholder_profile"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:tint="#11000000"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.9" />
<LinearLayout
android:id="#+id/lin_top_inner"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#BF473e6b"
android:orientation="vertical"
android:scaleType="centerCrop">
</LinearLayout>
</RelativeLayout>
<FrameLayout
android:id="#+id/frame_detail_profile"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center|center_horizontal"
android:orientation="vertical"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.3">
<android.support.v7.widget.RecyclerView
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</android.support.v7.widget.RecyclerView>
</FrameLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_profile"
android:layout_width="match_parent"
android:layout_height="#dimen/profile_toolbar_height"
android:gravity="top|center"
app:layout_anchor="#id/frame_detail_profile"
app:layout_collapseMode="pin"
app:theme="#style/ThemeOverlay.AppCompat.Dark"
app:title="">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/tv_toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/profile_toolbar_title_left_margin"
android:gravity="center_vertical|center"
android:ellipsize="end"
android:singleLine="true"
android:layout_gravity="center"
android:textColor="#android:color/white"
android:textSize="20sp" />
</LinearLayout>
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout_profile"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="bottom"
android:layout_marginTop="#dimen/profile_tab_layout_top_margin"
android:background="#color/white"
app:tabIndicatorColor="#color/colorPrimary"
app:tabSelectedTextColor="#color/colorPrimary"
app:tabTextColor="#color/charcoal_grey" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/view_pager_profile"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
</RelativeLayout>
</android.support.v4.widget.SwipeRefreshLayout>
and for grid layout of tabs use adapter classes.
Start with AppBarLayout under which you add CollapsingToolbarLayout with scrollFlags="scroll|exitUntilCollapsed",
add LinearLayout with vertical orientation to CollapsingToolbarLayout and add the
FrameLayout with ImageView + Toolbar
RecyclerView
TabLayout
Two things to be done:-
When the search button is clicked, set the visibility of recycler view to VISIBLE
When the back button is pressed, set the visibility of recycler view to GONE
Following are the implementations:
1. Setting the visibility of recycler view to VISIBLE:
public boolean onOptionsItemSelected(MenuItem item) {
if (item.getItemId() == R.id.searchView) {
rView.setVisibility(VISIBLE);
}
return true;
}
2. Setting the visibility of recycle adapter to GONE
MenuItem searchMenuItem = menu.findItem(R.id.searchView);
MenuItemCompat.setOnActionExpandListener(searchMenuItem, new MenuItemCompat.OnActionExpandListener() {
#Override
public boolean onMenuItemActionExpand(MenuItem item) {
return true;
}
#Override
public boolean onMenuItemActionCollapse(MenuItem item) {
recyclerView.setVisibility(GONE);
return true;
}
});
NOTE: Do not forget to keep the visibilty as GONE initially when the activity is started
I know I might be late to this answer but I have also been trying to implement this for a while. The solution I have feels a bit hacky but it is an option for trying to get the tabs to stick. In a simpler solution lets say we wanted the following:
A Collapsing toolbar layout
Which links to a scroll view.
In that scroll view we want the following:
A recyclerview that say scrolls horizontally
Below the recycler view a tab layout
Below the tab layout we want a view pager that will load dynamic fragments within a fixed space.
activity_scrolling.xml the outer parent xml file may look something like this
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.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=".temp.ScrollingActivity">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="#dimen/app_bar_height"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:toolbarId="#+id/toolbar">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_marginBottom="5dp"
app:layout_collapseMode="pin"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<include layout="#layout/content_scrolling" />
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/fab_margin"
app:layout_anchor="#id/app_bar"
app:layout_anchorGravity="bottom|end"
app:srcCompat="#android:drawable/ic_dialog_email" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Then the inner content_scrolling.xml may look something like this
<?xml version="1.0" encoding="utf-8"?>
<androidx.core.widget.NestedScrollView 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"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context=".temp.ScrollingActivity"
tools:showIn="#layout/activity_scrolling">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="20dp"
android:gravity="center"
android:text="A Heading"
android:textSize="#dimen/text_xl"
android:textStyle="bold" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/title" />
<com.google.android.material.tabs.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/recycler_view"
android:layout_gravity="center"
android:minHeight="60dp"
app:tabGravity="fill"
app:tabIndicatorColor="#color/colorAccent"
app:tabMode="fixed"
app:tabSelectedTextColor="#color/colorPrimaryDark" />
<androidx.viewpager.widget.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="680dp"
android:layout_below="#+id/tabs" />
</RelativeLayout>
</androidx.core.widget.NestedScrollView>
This will allow you to forcefully place the tab layout in a location of your choosing (even if its after a recyler view).
The hacky part which i dont like is this specific line android:layout_height="680dp" which forces the viewpager height to be something specific. I am not sure why wrap_content or match_parent do not work. But this is the best thing to a solution I can provide for the issue of placing TabLayout and ViewPager in specific places.
In the examples for CoordinatorLayout, it's always placed in the Activity, and the Fragments are all scrolling.
It's reasonable to imagine a scenario though where some of the fragments being loaded are scrollable and some of the fragments are not, but they get loaded in the same placeholder in the activity. In this scenario, should the CoordinatorLayout be placed in the Activity or in the Fragments?
On one hand, because you specify the Toolbar as a child of it, it seems that it should all be in the Activity.
On the other hand, if you have both scrolling and non-scrolling fragments loaded in the same placeholder, then this seems difficult to configure (e.g. what scrolling behaviour do you specify for the Fragment placeholder?), so it seems like it should live in the Fragment. In that case though, does each Fragment have to set the Toolbar again?
Q:should the CoordinatorLayout be placed in the Activity or in the Fragments?
A:You can use CoordinatorLayout in activity or fragment in different situation
Q:On one hand, because you specify the Toolbar as a child of it, it seems that it should all be in the Activity.
you can add toolbar to fragment layout instead of activity layout like below
in this example I create activity with NavigationView and viewPager :
so create layout for my activity(this layout is for MainActivity):
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer_layout"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:fitsSystemWindows="true">
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</FrameLayout>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_height="match_parent"
android:layout_width="240dp"
android:layout_gravity="right"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header"
app:menu="#menu/drawer_view"
app:itemIconTint="#color/tint_item_color"
app:itemTextColor="#color/tint_item_color"
/>
</android.support.v4.widget.DrawerLayout>
for create viewPager with tablayout I create this layout(this layout is for fragmentViewPager):
<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/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<include layout="#layout/toolbar_main"
android:id="#+id/toolbar"/>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
app:tabIndicatorColor="#color/tab_color"
app:tabSelectedTextColor="#color/tab_color"
/>
</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>
then use another layout for listFragment that I use in viewPager :
<android.support.design.widget.CoordinatorLayout
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:id="#+id/main_list_content"
xmlns:fab="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:background="#color/background_window">
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="0dp"
android:layout_marginRight="0dp"
android:layout_marginBottom="8dp"
android:layout_marginTop="0dp"
android:id="#+id/exersice_listviwe"/>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="16dp"
android:layout_marginBottom="64dp"
android:clickable="true"
android:src="#drawable/ic_done"
fab:layout_anchor="#+id/main_list_content"
fab:layout_anchorGravity="bottom|right"
/>
</android.support.design.widget.CoordinatorLayout >
I'm using the CoordinatorLayout and a ViewPager inside. The problem is, that the first entries of the List (in first page of the ViewPager) are hidden by the Tabs. When I use LinearLayout instead of the CoordinatorLayout, everything works fine.
How to fix that overlap?
Should the FloatingButton be added here or in the ListView XML?
Here's the 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"
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"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.TabLayout
android:id="#+id/sliding_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/pager_list_views"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v4.view.ViewPager>
<android.support.design.widget.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|right"
android:layout_margin="16dp"
android:src="#android:drawable/ic_menu_add"
app:layout_anchor="#id/pager_list_views"
app:layout_anchorGravity="bottom|right|end" />
</android.support.design.widget.CoordinatorLayout>
add this to ViewPager
app:layout_behavior="#string/appbar_scrolling_view_behavior"
if you use CoordinatorLayout you'll have to specifify a behaviour, it's safer if you control these aspects of your design.