Develop Reference

How to make an object constatnt at collapsing toolbar layout?

I am making an app that develop a profile activity
my profile activity has a collapse toolbar layout, how to make some view constant under the toolbar while scrolling the screen, these are screen shots of what I mean
before collapsing
This what I want to make

So , just create layout named activity_profile_detail and past this 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.support.design.widget.AppBarLayout
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"
app:contentScrim="?colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:layout_width="match_parent"
android:layout_height="200dp"
android:fitsSystemWindows="true"
/>
<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>
//your main content here
</android.support.design.widget.CoordinatorLayout>

Negative margin Layout to overlay parent layout

I have an activity that has a toolbar and a framelayout where I inject fragments.
This is the layout for that activity:
<android.support.v4.widget.DrawerLayout
android:id="#+id/drwDrawerRoot"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/background_main_selector"
android:theme="#style/AppTheme">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include
android:id="#+id/viewMainToolbar"
layout="#layout/view_toolbar" />
</LinearLayout>
<FrameLayout
android:id="#+id/frmDrawerContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="#dimen/toolbar_height"
android:clipChildren="false"
android:clipToPadding="false"
android:orientation="vertical" />
<include
android:id="#+id/viewDrawer"
layout="#layout/view_drawer"
bind:name="#{name}"/>
<include
android:id="#+id/viewUserDrawer"
layout="#layout/view_user_drawer"
bind:name="#{name}"/>
</android.support.v4.widget.DrawerLayout>
I have the framelayout with a margin so that the contents from the fragments do not overlay the toolbar, but I set clipChildren and clipToPadding to false as per some other posts I have seen here.
On some fragments however I have a loading view, which I would like to occupy all the screen.
This is a sample fragment:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/layout_main"
style="#style/Layout.FullScreen"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/layout_footer"
android:orientation="vertical">
<TextView
android:id="#+id/textView7"
style="#style/Text.Header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/login_header" />
<EditText
android:id="#+id/edtMessage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:elevation="1dp"
android:ems="10"
android:inputType="textMultiLine" />
<Button
android:id="#+id/btnSend"
style="#style/Button.Primary"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/support_button" />
</LinearLayout>
<LinearLayout
android:id="#+id/layout_footer"
style="#style/Layout.FullScreen.Footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical">
<TextView
android:id="#+id/footerInfo"
style="#style/Text.White.Small.Centered"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/footer_info" />
</LinearLayout>
<include
layout="#layout/view_loading"
android:visibility="invisible"
bind:loading="#{loading}" />
</RelativeLayout>
Ans this is the included loading view, which I have set with negative margin, hoping it would move up to the top of the screen:
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="-40dp"
android:background="#color/colorLoadingBackground"
android:clickable="true"
android:visibility="#{loading ? View.VISIBLE : View.GONE}">
</FrameLayout>
Am I missing something here?
Is this doable or do I need to change how I am doing this?
Clarification:
The first / root layout includes a toolbar and the second layout is included within the frame layout of the first. this means that the content of the second layout starts below the toolbar. However, I would like the third layout (a loading screen that is included in the second layout) to have a negative margin so that it overlays the full screen, not just starting below the toolbar.

You need to use CoordinatorLayout then you wont need negative margins. here are the sample layout u can customise according to your need
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
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">
<android.support.design.widget.CoordinatorLayout
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/AppTheme.AppBarOverlay"
app:layout_behavior= "#string/appbar_scrolling_view_behavior">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:popupTheme="#style/AppTheme.PopupOverlay"
app:title="My App" />
</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"/>
<!--include a full screen loading layout here and hide/show according to your need-->
<include layout="#layout/loading_layout/>
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="#layout/nav_header"/>
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>

Appbar not hiding when recyclerview scrolled

I am trying to hide appbar when user scrolled recyclerview layout code as per follows:
<?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:fitsSystemWindows="true"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/my_appbar_container"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<include
android:layout_width="fill_parent"
android:layout_height="wrap_content"
layout="#layout/plp_header_card_view"
app:layout_scrollFlags="scroll|enterAlways" />
</LinearLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/item_list_recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:scrollbars="none" />
</android.support.design.widget.CoordinatorLayout>
I want to hide appbar when this screen intialize & show appbar when user scroll the recyclerview. Please help me to do this one.

The below code is proper way to make toolbar hide when the scroll down.
<?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/tabanim_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/tabanim_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways|snap"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>

Apply app:layout_scrollFlags="scroll|enterAlways" on LinearLayout work hide action recycleview scroll.
But you question is hide appbar when this screen intialize & show appbar when user scroll the recyclerview
My suggestion as belowit will help you to achieved target
1. Hide and show toolbar on scroll
2. you can use CollapsingToolbar

Android Toolbar scroll behavior

I want that the Toolbar will have the behavior of scroll|enter_always. However, when I scroll, the bottom of the Toolbar shows under my Transparent status bar, and gets stuck there.
What do you think the problem is with my layout?
<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:layoutDirection="rtl"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
app:layout_scrollFlags="scroll|enterAlways"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/halachotToolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:layout_scrollFlags="scroll|enterAlways"
app:titleTextColor="#color/White"
android:layoutDirection="rtl" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v7.widget.RecyclerView
android:id="#+id/halachotRecyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layoutDirection="rtl"
android:layout_gravity="center_horizontal"
android:scrollbars="vertical"
android:clickable="true" />
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>

Try setting the android:elevation for the toolbar

HomeAsUp icon showing a bit off

I have this weird issue with the getSupportActionBar().setDisplayHomeAsUpEnabled(true); because it is showing the left arrow a bit off the layout.
This is how the left icon looks
This is the code I use to set the Toolbar as the SupportActionBar
Toolbar toolbar;
...
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
And this is the activity 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:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="192dip"
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="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ml.dannyb.packagetracker.workers.SquareImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:elevation="4dp"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/rvPackageDetails"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fabEditPackage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|right"
android:layout_marginBottom="16dip"
android:layout_marginRight="16dip"
android:src="#drawable/ic_mode_edit_white_24dp"
app:elevation="10dip"
app:layout_behavior="ml.dannyb.packagetracker.workers.ScrollAwareFABBehavior" />
</android.support.design.widget.CoordinatorLayout>

See:
https://www.google.com/design/spec/layout/metrics-keylines.html#metrics-keylines-keylines-spacing
Set:
Status bar height: 24dp
Toolbar height: 56dp
Remove android:fitsSystemWindows="true"

So the problem seems to be Android 5.0+ specific.. I get the indicator placed correctly on other pre 5.0 Android versions and I fixed it by adding a styles-v21/styles.xml file where I extended the base theme.. That was all I needed to do so if anyone else gets this problem now you have the fix! :)