Develop Reference

SwipeRefreshLayout height is always 0

I have a fragment with a SwipeRefreshLayout and will be added inside a FrameLayout in the activity on run time.
The problem is that SwipeRefreshLayout height is always 0 whatever the height parameter value is (wrap_content or match_parent).
Here is my fragment code:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.SwipeRefreshLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/refresh_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/expensesLL"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.RecyclerView
android:id="#+id/expenses_list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clipToPadding="false"
android:paddingBottom="#dimen/recycler_view_padding_bottom"
android:paddingTop="#dimen/list_item_margin" />
</LinearLayout>
</android.support.v4.widget.SwipeRefreshLayout>
And here is my activity code:
<?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"
android:layoutDirection="ltr"
tools:context=".expenses.ExpensesActivity">
<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:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/dr_nav_header"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleGravity="center_horizontal|bottom"
app:expandedTitleMarginBottom="#dimen/title_margin_bottom"
app:expandedTitleTextAppearance="#style/ExpandedTitle"
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"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/scroll"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<FrameLayout //Inside this frame my fragment will be added
android:id="#+id/contentFrame"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab_add_expense"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/controllers_padding"
android:src="#drawable/ic_add"
app:fabSize="normal"
app:layout_anchor="#id/app_bar_layout"
app:layout_anchorGravity="bottom|end" />
</android.support.design.widget.CoordinatorLayout>
Any suggestions please?

The problem solved, I just removed the NestedScrollView and I gave its behavior to the FrameLayout.

Hiding tablayout inside coordinator layout, which is outside activity

I have some problem with coordinator layout. I have activity toolbar inside appBarLayout with parent CoordinatorLayout (I want to make toolbar hideable) and fragment with tablayout inside appBarLayout and viewPager. Here is activity's 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:background="#drawable/gradient"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/toolbar_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways|snap"
app:popupTheme="#style/AppTheme.PopupOverlay"/>
</android.support.design.widget.AppBarLayout>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.design.widget.CoordinatorLayout>
And it's fragment's 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:background="#drawable/gradient"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
style="#style/MyCustomTabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"/>
</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>
For now, I have this situation where the toolbar is somewhere.
If I change coordinator layout inside activity to linear layout I get toolbar visible, but as you can imagine with no hiding option.
Actually, I have play with coordinator layout a lot:hiding and showing toolbar in a few cases such parallax and others - https://github.com/Iamtodor/toolbars, so you can be sure, I have a little understand how it works :)
Also, I had wantch this sources:
- https://github.com/codepath/android_guides/wiki/Handling-Scrolls-with-CoordinatorLayout
- https://github.com/codepath/android_guides/wiki/Using-the-App-ToolBar#using-toolbar-as-actionbar
- https://github.com/chrisbanes/cheesesquare
But there is all examples when tablayout exists inside same appbarlayout with toolbar.
How can I fix it?

Here is what worked for me:
Fragment XML:
<android.support.design.widget.AppBarLayout
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/app_bar_layout"
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"
app:layout_scrollFlags="scroll|enterAlways|snap" >
<include layout="#layout/include_time_line"
android:layout_height="wrap_content"
android:layout_width="match_parent" />
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
style="#style/TabLayout"
android:id="#+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="54dp"
android:layout_gravity="bottom"
android:background="#color/egg"
android:elevation="0dp"
app:tabGravity="fill"
app:tabMode="scrollable"
app:tabIndicatorColor="#fcd131"
app:tabPadding="0dp"
app:tabIndicatorHeight="4dp"/>
</android.support.design.widget.AppBarLayout>
<com.woot.woot.productbrowse.ui.ConfigurablePagingViewPager
android:id="#+id/viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
/>
<FrameLayout
android:id="#+id/selectByWeightKeyboard"
android:layout_width="match_parent"
android:layout_height="#dimen/weight_keyboard_container_height"
android:background="#color/keyboard"
android:clipToPadding="false"
android:elevation="16dp"
android:clickable="true"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior">
<include layout="#layout/add_product_by_weight_keyboard" />
</FrameLayout>
Activity XML:
<FrameLayout
android:id="#+id/contentFrame"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<FrameLayout
android:id="#+id/layout_done_button"
android:visibility="gone"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:elevation="8dp"
tools:visibility="visible"
android:background="#color/ice">
<Button
android:id="#+id/button_done"
style="?android:attr/borderlessButtonStyle"
android:layout_width="match_parent"
android:layout_height="#dimen/button_height"
android:layout_marginRight="#dimen/button_done_horizontal_margin"
android:layout_marginLeft="#dimen/button_done_horizontal_margin"
android:layout_marginTop="#dimen/activity_horizontal_margin"
android:layout_marginBottom="#dimen/activity_horizontal_margin"
android:background="#drawable/rounded_green_button"
android:text="#string/done"
android:textSize="#dimen/button_text_size"
android:textAllCaps="true"
android:textColor="#color/egg" />
</FrameLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:contentDescription="#string/drawer_content_description"
app:menu="#menu/menu_navigation_product_browse" />

fragment from viewPager hidding behind on tab of action bar

Actually i am trying to build a listView/recyclerView . On scrolling of list the actionbar get hide where action bar is toolbar but the some part of listview is hiding behind the tab. Here i have used AppBarLayout and toolbar having app:layout_scrollFlags="scroll|enterAlways" and in my recylerview have app:layout_behavior="#string/appbar_scrolling_view_behavior" behaviour. I can use linear Layout but problem is for sliding of toolbar the AppBarLayout must be the child of CoordinatorLayout.
My activity having 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"
tools:context="ameyo.genie.activity.HomeActivity">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="50dp">
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</FrameLayout>
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
app:popupTheme="#style/Theme.AppCompat.Light.DarkActionBar"
app:theme="#style/Toolbar">
<android.support.v7.widget.Toolbar
android:id="#+id/action_bars"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_scrollFlags="scroll|enterAlways"
/>
<ameyo.genie.SlidingTabLayout
android:id="#+id/sliding_tabs"
android:layout_width="match_parent"
android:layout_height="48dp"
android:background="#color/colorPrimary"
/>
</android.support.design.widget.AppBarLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/home_fab_dial"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:clickable="true"
android:src="#drawable/ic_dialpad_white"
app:layout_anchor="#id/pager"
app:layout_anchorGravity="bottom|center" />
</android.support.design.widget.CoordinatorLayout>
and my fragment having
<?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:background="#color/white">
<android.support.v7.widget.RecyclerView
android:id="#+id/recentcall_recyclerview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="vertical"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
/>
</android.support.design.widget.CoordinatorLayout>
Am I doing something wrong in making the toolbar to slide on sliding the listview or there is another way of doing this without using any third library.

try this:
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
app:popupTheme="#style/Theme.AppCompat.Light.DarkActionBar"
app:theme="#style/Toolbar">
<android.support.v7.widget.Toolbar
android:id="#+id/action_bars"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_scrollFlags="scroll|enterAlways"
/>
<ameyo.genie.SlidingTabLayout
android:id="#+id/sliding_tabs"
android:layout_width="match_parent"
android:layout_height="48dp"
android:background="#color/colorPrimary"
/>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="50dp">
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</FrameLayout>
</android.support.design.widget.AppBarLayout>
When you put your component, order them by the position, every component will be over the precedent, if there's no space !

Thanks to Daniel Nugent that I forgot to write android:layout_below="#+id/sliding_tabs" inside viewpager and also remove framelayout and height must be wrapcontent now my final code is this which is working
<?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="ameyo.genie.activity.HomeActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="6dp">
<android.support.v7.widget.Toolbar
android:id="#+id/action_bars"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
app:popupTheme="#style/Theme.AppCompat.Light.DarkActionBar"
app:theme="#style/Toolbar"
app:elevation="0dp"
app:layout_scrollFlags="scroll|enterAlways"
/>
<ameyo.genie.SlidingTabLayout
android:id="#+id/sliding_tabs"
android:layout_below="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="48dp"
android:background="?attr/colorPrimary"
app:elevation="0dp"
android:minHeight="?attr/actionBarSize"
/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_below="#+id/sliding_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
/>
<android.support.design.widget.FloatingActionButton
android:id="#+id/home_fab_dial"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:clickable="true"
android:src="#drawable/ic_dialpad_white"
app:layout_anchor="#id/pager"
app:layout_anchorGravity="bottom|center" />
</android.support.design.widget.CoordinatorLayout>

Static header and footer for Viewpager

I've created a Simple ViewPager Project. I'm trying to add one standard header (CardView) above the ViewPager and Two Buttons below the Viewpager. Adding CardView or Any other views (TextView) is not shows. ViewPager only Shows
Here is my default layout with my comments (tries)...
activity_home.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:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="grabit.viewpageronly.MainActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/appbar_padding_top"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end|bottom"
android:layout_margin="#dimen/fab_margin"
android:src="#android:drawable/ic_dialog_email" />
<!-- I Can't Add any views here if I added anything like TextView it doesn't Show up -->
<!-- Some Standard CardView -->
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
<!-- Two Button below Viewpager -->
</android.support.design.widget.CoordinatorLayout>
Here What I've Tried
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout>
<appbar ... />
<toolbar .... />
<TextView android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Hello World"/>
<android.support.v4.view.ViewPager
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>

The point is that you should add behavior to your LinearLayout instead of your ViewPager.
Following xml works , It's add TextView with red background on Top of your viewPager :
<?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/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">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:layout_scrollFlags="scroll|enterAlways|snap" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.design.widget.AppBarLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<TextView
android:background="#f22"
android:id="#+id/tes"
android:text="this is test"
android:textColor="#fff"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
</LinearLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end|bottom"
android:layout_margin="#dimen/fab_margin"
android:src="#drawable/ic_done" />
</android.support.design.widget.CoordinatorLayout>

Collapsing toolbar with image, tabs and FAB

I'm having difficulties trying to implement the toolbar as in images below:
However, I've failed to add the Floating Action Button like shown on image. I'm using Googles design support library. Any ideas?
My current XML code:
<?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/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="250dp"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.7">
<ImageView
android:id="#+id/imgBackdrop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop" />
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#20000000" />
</FrameLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
style="#style/Widget.PinList.ActionBar.Transparent"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|enterAlways">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
style="#style/PinListTabLayout"
android:layout_width="match_parent"
android:layout_height="60dp"
app:layout_collapseMode="pin" />
</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"
android:background="#color/background"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>

I've found a solution. I thought that app:layout_anchorGravity could only reference elements like RelativeLayout's positioning attributes. But obviously, I was wrong. I've only added this code above the ViewPager in previous xml:
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="10dp"
android:layout_marginRight="10dp"
android:src="#drawable/ic_action_add"
app:layout_anchor="#id/collapsing_toolbar"
app:layout_anchorGravity="bottom|right|end" />

See my solution here.
It works on API 14-23.
Hope to help you