Develop Reference

webview hides behind bottom app bar android

I have created material.io bottom app bar with a webview, but the bottom app bar overlaps with the webview and hides webview's bottom content.
I'm using im-delight's advance web view which works exactly same as the default android web view
how can I stop the overlapping and make the bottom app bar hide while scrolling in webview ?
Here's the layout file
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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.coordinatorlayout.widget.CoordinatorLayout
android:id="#+id/container_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<im.delight.android.webview.AdvancedWebView
android:id="#+id/webview"
android:layout_width="match_parent"
android:layout_height="match_parent">
</im.delight.android.webview.AdvancedWebView>
<com.google.android.material.progressindicator.LinearProgressIndicator
android:id="#+id/progressBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:indeterminate="true"
app:indicatorColor="#4326EC" />
<com.google.android.material.bottomappbar.BottomAppBar
android:id="#+id/bottom_app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:backgroundTint="#F44336"
app:fabAnimationMode="slide"
app:hideOnScroll="true"
app:layout_behavior="#string/hide_bottom_view_on_scroll_behavior">
<ImageView
android:id="#+id/imageViewFavicon"
android:layout_width="15dp"
android:layout_height="15dp"
android:layout_gravity="left"
android:src="#drawable/ic_baseline_home_24"
android:visibility="invisible" />
<TextView
android:id="#+id/webpagename"
android:layout_width="160dp"
android:layout_height="30dp"
android:fontFamily="#font/artifika"
android:gravity="left"
android:text="Torus"
android:textColor="#color/white"
android:textSize="18sp" />
</com.google.android.material.bottomappbar.BottomAppBar>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

Layout design over navigation action bar

I am looking for a solution to design an element on the top of the navigation action bar and also a way to increase the size of the action bar. One way I can think of, is to disable the navigation action bar and then design. Is there any way if it's achievable without disabling the action bar?
Here is the design template:
just to be clear i am looking for an idea to design connect tab where one half is on the navigation action bar while other is on scroll view
xml for main
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:tools="http://schemas.android.com/tools"
tools:context=".MainActivity"
android:background="#696969">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<include layout="#layout/toolbar" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="80dp"
android:background="#696969">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginTop="15dp">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Filter"
android:layout_marginLeft="20dp"
android:textSize="26sp"
android:textColor="#color/white"
>
</Button>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="scan"
android:textSize="26sp"
android:layout_marginLeft="20dp"
android:textColor="#color/white"
>
</Button>
</LinearLayout>
</ScrollView>
</RelativeLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
here is xml for toolbar
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="#drawable/backkground">
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:cardCornerRadius="10dp"
app:cardElevation="10dp"
android:layout_marginEnd="10dp"
android:layout_marginStart="10dp"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"
android:layout_centerHorizontal="true"
android:background="#color/black">
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:padding="2dp"
android:layout_height="match_parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="8dp"
android:src="#drawable/ic_baseline_cast_connected_24">
</ImageView>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:text="Connected"
android:textSize="44sp">
</TextView>
</LinearLayout>
</androidx.cardview.widget.CardView>
</RelativeLayout>
I am afraid i can show all the codes as its proprietry but i just wrote some to mitigate my current solution by dividing the background colo.lol.

After hard work of 30min. I got your answer. In your image, Toolbar is already in use with backButton, refreshButton, BluetothButton, and locationButton and they created the Connect button in TabLayout that's why it shows half on TabLayout and half on Blank Spaces.
I created it as shown in the template.
This is my XML layout code.
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout 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:layout_width="match_parent"
android:layout_height="match_parent">
<!-- Your ToolBar Code or Other Code-->
<TableLayout
android:id="#+id/myTooBar"
android:layout_width="match_parent"
android:layout_gravity="top"
android:layout_height="?actionBarSize">
<!-- Here is sample textView with color-->
<TextView
android:background="#color/purple_500"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</TableLayout>
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:gravity="center"
android:layout_marginLeft="50dp"
android:layout_marginRight="50dp"
app:cardCornerRadius="15dp"
app:cardElevation="10dp"
app:layout_anchor="#+id/myTooBar"
app:layout_anchorGravity="bottom|center"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="bottom"
android:background="#color/white"
android:padding="15dp"
android:gravity="left"
android:text="#string/connect"
android:textColor="#color/gray"
android:textSize="22sp"
android:textStyle="bold"
app:drawableLeftCompat="#drawable/ic_baseline_cell_wifi_24"
app:drawableTint="#color/gray" />
</androidx.cardview.widget.CardView>
<!-- Your more code of Activity-->
</androidx.coordinatorlayout.widget.CoordinatorLayout>
and this is the result
I hope it'll help you.
EDIT -1: Added more radius to cardView

How do I use parallax to scroll through my content?

I have some issues with parallax for android, where I currently have an image on top (with text content in the center) and a button on the top right.
Now as I scroll, I want the text and button to remain fixed on screen. As I scroll past the appbar (toolbar), the toolbar should be fixed to the top and the button should be on top right of it, fixed to it , while the rest of the content stays scrollable.
Here's my code (without parallax), any clue how i can achieve this ?
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/cl_root_view"
android:background="#color/white"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipChildren="false">
<LinearLayout
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="0dp"
app:elevation="0dp">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
style="#style/Toolbar"
android:background="#color/white"
android:contentInsetStart="5dp"
android:contentInsetLeft="5dp"
android:contentInsetEnd="5dp"
android:contentInsetRight="5dp"
app:contentInsetEnd="5dp"
app:contentInsetLeft="5dp"
app:contentInsetRight="5dp"
app:contentInsetStart="5dp"
app:titleTextAppearance="#style/Toolbar.TitleText">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/toolbar_title"
style="#style/Toolbar.AltTitleText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_centerInParent="true"
android:drawableStart="#drawable/ic_dots"
android:gravity="center_vertical" />
<ImageButton
android:id="#+id/my_button"
style="#style/Widget.AppCompat.Button.Borderless"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentEnd="true"
android:layout_centerVertical="#+id/toolbar_title"
android:layout_marginEnd="20dp"
android:background="#drawable/ic_my_button"
android:tint="#color/black" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<ScrollView
android:id="#+id/scrollView"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FFFFFF">
<TextView
android:id="#+id/roomsTitle"
style="#style/Headline2LeftBlack"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_toStartOf="#+id/btnMore"
android:paddingStart="20dp"
android:paddingEnd="20dp"
android:text="#string/meeting_rooms"
android:textAppearance="#style/TextAppearance.Text.Chronicle"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/btnMore"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/transparent"
android:fontFamily="sans-serif"
android:letterSpacing="0.02"
android:lineSpacingExtra="2sp"
android:paddingStart="20dp"
android:paddingEnd="20dp"
android:text="#string/all_rooms"
android:textColor="#color/reddish"
android:textSize="18sp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<android.support.v4.view.ViewPager
android:id="#+id/roomViewPager"
android:layout_width="match_parent"
android:layout_height="400dp"
android:clipToPadding="false"
android:overScrollMode="never"
android:paddingStart="15dp"
android:paddingTop="16dp"
android:paddingEnd="15dp"
android:paddingBottom="45dp"
app:layout_constraintTop_toBottomOf="#id/roomsTitle" />
<RelativeLayout
android:id="#+id/register_a_visitor_container"
android:layout_width="0dp"
android:layout_height="75dp"
android:layout_margin="5dp"
android:layout_marginTop="35dp"
android:background="#color/white"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/roomViewPager">
<ImageView
android:id="#+id/register_visitor_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:tint="#color/reddish"
android:src="#drawable/ic_register_visitor_icon"
/>
<TextView
android:id="#+id/register_a_visitor_button"
style="#style/Body1RegLeftBlack"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:letterSpacing="0.01"
android:layout_marginStart="16dp"
android:layout_toEndOf="#+id/register_visitor_icon"
android:lineSpacingExtra="8sp"
android:text="#string/register_a_visitor"
android:textAllCaps="false"
android:textAppearance="#style/TextAppearance.Text.Roboto.Regular" />
<ImageView
android:id="#+id/reset_password_chevron"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:layout_marginEnd="16dp"
android:tint="#color/brownish_grey"
android:background="#drawable/ic_baseline_chevron_right_24px"
/>
</RelativeLayout>
<!-- TODO work on it after MVP -->
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:visibility="gone"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/container">
<TextView
android:id="#+id/upcoming_events"
style="#style/Headline3LeftGrey"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_marginStart="25dp"
android:text="#string/upcoming_events" />
<android.support.v7.widget.RecyclerView
android:id="#+id/event_recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/upcoming_events"
android:background="#color/black"
tools:listitem="#layout/item_repo_view" />
</RelativeLayout>
</android.support.constraint.ConstraintLayout>
</ScrollView>
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
As you can see from the above layout. I want to add an image (and add the my_button on top right of that image) that is above the toolbar and scrolls off the screen as you scroll up while my button stays in its place until the toolbar gets on top ,after which the toolbar is affixed to the top as you scroll further up, unless you scroll down and the image is visible again and the button is no more fixed.
Please let me know if this is confusing,I will try to explain it better with diagrams if possible.
Any examples will be helpful! thanks!

Please refer below code, i have made something like you.
<?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:id="#+id/view_profile_parent_layout"
android:background="#color/splash_bg_color"
tools:context=".view_profile.ViewProfileActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_barLayout"
android:layout_width="match_parent"
android:layout_height="#dimen/view_profile_profile_app_bar_height"
android:elevation="#dimen/view_profile_app_bar_elevation"
android:theme="#style/ThemeOverlay.AppCompat.Light">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_bar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:contentScrim="?attr/colorPrimary"
app:titleEnabled="false"
android:fitsSystemWindows="true"
app:layout_scrollFlags="exitUntilCollapsed|scroll">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize">
<de.hdodenhof.circleimageview.CircleImageView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/view_profile_imageView"
android:layout_width="#dimen/view_profile_profile_width"
android:layout_height="#dimen/view_profile_profile_height"
android:src="#drawable/ic_profile_icon"
android:layout_centerHorizontal="true"
app:civ_border_width="#dimen/view_profile_profile_border_width"
app:civ_border_color="#color/textPrimary"/>
<TextView
android:id="#+id/view_profile_profile_name_textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/view_profile_profile_name_margin_top"
android:layout_below="#id/view_profile_imageView"
android:fontFamily="#font/roboto_regular"
android:text=""
android:textSize="#dimen/view_profile_profile_name_text_size"
android:gravity="center"
android:textColor="#color/white"/>
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
app:layout_collapseMode="pin"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:elevation="#dimen/login_btn_elevation"
app:popupTheme="#style/AppTheme.PopupOverlay"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
android:contentInsetStart="0dp"
android:contentInsetLeft="0dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<LinearLayout
android:id="#+id/back_button"
android:layout_width="#dimen/back_btn_layout_w"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:layout_alignParentStart="true"
android:orientation="horizontal">
<Button
android:layout_gravity="center_vertical|center_horizontal"
android:layout_width="#dimen/back_btn_w"
android:layout_height="#dimen/back_btn_w"
android:layout_marginStart="#dimen/default_padding"
android:clickable="false"
android:background="#drawable/ic_arrow_back_white_24dp"
android:elevation="#dimen/login_btn_elevation" />
</LinearLayout>
<TextView
android:id="#+id/nav_title"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:layout_marginStart="#dimen/nav_outer_h_space"
android:fontFamily="#font/roboto_regular"
android:text=""
android:gravity="center"
android:textColor="#color/white"
android:textSize="#dimen/title_size" />
<Button
android:id="#+id/edit_button"
android:layout_width="#dimen/back_btn_w"
android:layout_height="#dimen/back_btn_w"
android:layout_gravity="right"
android:layout_centerInParent="true"
android:layout_alignParentEnd="true"
android:layout_marginEnd="#dimen/nav_outer_h_space"
android:background="#drawable/edit_white_icon"
android:elevation="#dimen/login_btn_elevation" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
Use
app:layout_scrollFlags="exitUntilCollapsed|scroll"
in collapsing layout
app:layout_collapseMode="pin"
in Toolbar

Bottom Sheet and FAB margin

How do you add margin between a bottom sheet and a Floating Action Button in android. I made it working by using another FAB and making it invisible but the FAB is only just above the Bottom Sheet. See this picture : 1
And the code :
<android.support.design.widget.CoordinatorLayout
android:id="#+id/coordinator"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:theme="#style/Theme.AppCompat.NoActionBar"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<RelativeLayout
android:id="#+id/search_relativeLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:theme="#style/Theme.AppCompat.NoActionBar">
<com.google.android.gms.maps.MapView
android:id="#+id/mapView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/bottom_sheet"
android:layout_width="match_parent"
android:layout_height="300dp"
android:background="#android:color/white"
android:elevation="1dp"
app:behavior_hideable="true"
app:behavior_peekHeight="0dp"
app:layout_behavior="#string/bottom_sheet_behavior">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/circle_picture"
android:src="#mipmap/login_background"
android:layout_margin="10dp"
android:layout_width="50dp"
android:layout_height="50dp" />
<TextView
android:id="#+id/name_bottom_sheet"
android:layout_toEndOf="#id/circle_picture"
android:text="Title"
android:textColor="#color/buttonLoginColor"
android:layout_margin="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/address_bottom_sheet"
android:layout_below="#id/name_bottom_sheet"
android:layout_toEndOf="#id/circle_picture"
android:layout_marginStart="10dp"
android:textColor="#color/btn_create"
android:text=""
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="invisible"
android:layout_margin="15dp"
app:layout_anchor="#id/bottom_sheet"
app:layout_anchorGravity="top|end"/>
<android.support.design.widget.FloatingActionButton
android:id="#+id/floatingButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="50dp"
android:layout_marginEnd="15dp"
app:backgroundTint="#color/buttonLoginColor"
app:borderWidth="0dp"
app:elevation="6dp"
app:layout_anchor="#id/fab2"
app:layout_anchorGravity="top"/>
</android.support.design.widget.CoordinatorLayout>
I'm using a NestedScrollView to display the bottom sheet.

I had the same issue. After hours of researching I figured out it can't be made through layout_anchor because of Material design guidelines. You need to use trick like one below. I'm using a transparent view that makes margin between fab and bottom sheet content view.
This is how I solved the issue:
FAB itself:
<android.support.design.widget.FloatingActionButton
...
app:layout_anchor="#+id/bottomPanel"
app:layout_anchorGravity="right"/>
BottomSheet:
<FrameLayout
android:id="#+id/bottomPanel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:backgound="#android:color/transparent"
app:layout_behavior="#string/bottom_sheet_behavior">
<ContentView
android:layout_width="match_parent"
android:layout_height="300dp"
android:layout_marginTop="44dp"
android:backgound="#color/colorPrimary" />
</FrameLayout>
Just make the root view transparent and your content view put inside that and add margin of 44dp (fab size = 56dp. fab padding = 16dp. 56/2 + 16 = 44)

Yes, you can try with RelativeLayout , I'm still not able to understand why you have gave bottom sheet fixed height with 300dp, anyway this will do it without another fab button..
<RelativeLayout
android:id="#+id/coordinator"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:theme="#style/Theme.AppCompat.NoActionBar"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<RelativeLayout
android:id="#+id/search_relativeLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:theme="#style/Theme.AppCompat.NoActionBar">
<com.google.android.gms.maps.MapView
android:id="#+id/mapView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/bottom_sheet"
android:layout_width="match_parent"
android:layout_height="300dp"
android:layout_alignParentBottom="true"
android:background="#android:color/white"
android:elevation="1dp"
app:behavior_hideable="true"
app:behavior_peekHeight="0dp"
app:layout_behavior="#string/bottom_sheet_behavior">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/circle_picture"
android:src="#mipmap/login_background"
android:layout_margin="10dp"
android:layout_width="50dp"
android:layout_height="50dp" />
<TextView
android:id="#+id/name_bottom_sheet"
android:layout_toEndOf="#id/circle_picture"
android:text="Title"
android:textColor="#color/buttonLoginColor"
android:layout_margin="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/address_bottom_sheet"
android:layout_below="#id/name_bottom_sheet"
android:layout_toEndOf="#id/circle_picture"
android:layout_marginStart="10dp"
android:textColor="#color/btn_create"
android:text=""
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/floatingButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/bottom_sheet"
android:layout_margin="15dp"
app:backgroundTint="#color/buttonLoginColor"
app:borderWidth="0dp"
android:layout_alignParentRight="true"
app:elevation="6dp"
app:layout_anchorGravity="top"/>
</RelativeLayout>
You can also set your fab button margins as per your requirement.

Part of Fragment items hides under Action bar

I am learning android dev and my question might be very simple. I am stuck at the below part and requesting your help
Description
I am using the android's default "Navigation Drawer" activity to implement a small project. I have created a fragment and when user selects an option from Navigation drawer, the fragment opens.
Problem faced
When the fragment opens, part of the fragment & action bar is clipped. Image below
Code
fragment layout
<LinearLayout 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:fitsSystemWindows="true"
android:clipToPadding="false"
android:orientation="vertical"
android:background="#ffffff"
android:layout_weight="120"
tools:context="test.navigationdrawcheck.RateCalculator">
<EditText
android:layout_width="wrap_content"
android:layout_height="5dp"
android:inputType="number"
android:ems="12"
android:gravity="center"
android:layout_weight="10"
android:hint="text 1"
android:textColorHint="#color/colorDivider"
android:id="#+id/editText"
android:layout_gravity="center_horizontal" />
<EditText
android:layout_width="wrap_content"
android:layout_height="5dp"
android:inputType="number"
android:hint="text 2"
android:textColorHint="#color/colorDivider"
android:ems="12"
android:gravity="center"
android:layout_weight="10"
android:id="#+id/editText1"
android:layout_gravity="center_horizontal" />
<EditText
android:layout_width="wrap_content"
android:layout_height="5dp"
android:inputType="number"
android:hint="text 3"
android:textColorHint="#color/colorDivider"
android:ems="12"
android:gravity="center"
android:layout_weight="10"
android:id="#+id/editText3"
android:layout_gravity="center_horizontal" />
<EditText
android:layout_width="wrap_content"
android:layout_height="5dp"
android:inputType="number"
android:hint="text 4"
android:textColorHint="#color/colorDivider"
android:ems="12"
android:gravity="center"
android:layout_weight="10"
android:id="#+id/editText4"
android:layout_gravity="center_horizontal" />
<TextView
android:layout_width="wrap_content"
android:layout_height="15dp"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Total "
android:textColor="#color/colorDivider"
android:layout_weight="10"
android:textStyle="bold"
android:gravity="center_vertical"
android:id="#+id/textView"
android:layout_gravity="center_horizontal"
/>
<Button
android:layout_width="match_parent"
android:layout_height="10dp"
android:inputType="number"
android:ems="15"
android:gravity="center"
android:layout_weight="5"
android:id="#+id/editText6"
android:text="Submit"
android:textSize="20sp"
android:textColor="#color/colorWhite"
android:background="#color/colorPrimary"
android:layout_gravity="center_horizontal" />
App Bar 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"
tools:context="test.navigationdrawcheck.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:elevation="4dp"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:fitsSystemWindows="true"
app:popupTheme="#style/AppTheme.PopupOverlay"/>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="#+id/framecheck"
android:layout_width="match_parent"
android:layout_height="match_parent">
</FrameLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="#dimen/fab_margin"
android:src="#android:drawable/ic_dialog_email" />
</android.support.design.widget.CoordinatorLayout>
Actual output i am looking for
Below is my actual fragment layout xml. When i merge it with Navigation drawer it should not be clipped and fragment items should be displayed correctly
What I have tried so far
I tried adding this android:windowActionBarOverlay=false in my styles.xml but no luck
Requesting your suggestions

This might come from the default behaviour of the CoordinatorLayout.
I also assume that you add your fragments in the frameLayout frameCheck.
In your app bar code layout, replace
<FrameLayout
android:id="#+id/framecheck"
android:layout_width="match_parent"
android:layout_height="match_parent">
</FrameLayout>
with :
<FrameLayout
android:id="#+id/framecheck"
app:layout_behavior="android.support.design.widget.AppBarLayout$ScrollingViewBehavior"
android:layout_width="match_parent"
android:layout_height="match_parent" />

use FrameLayout instead of LinearLayout
and add this to your FrameLayout of the fragment
android:layout_marginTop="?attr/actionBarSize"
at leaset worked for me.