I need to create a Coordinatorlayout with a Linear Layout and a RecyclerView with the same space for both.
I've tried setting layout_weight 0.5 but the RecyclerView is taking all the space.
This is my code.
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:background="#android:color/holo_green_light">
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/lvToDoList"
android:layout_weight="0.5"
android:background="#android:color/holo_blue_bright"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v7.widget.RecyclerView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end|right"
android:layout_marginBottom="#dimen/activity_vertical_margin"
android:layout_marginEnd="#dimen/activity_horizontal_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:src="#android:drawable/ic_input_add" />
</android.support.design.widget.CoordinatorLayout>
How can I achive that?
Regards, Diego.
layout_weight working only in LinearLayout. So, put LinearLayout as middle layer:
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.5"
android:background="#android:color/holo_green_light">
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/lvToDoList"
android:background="#android:color/holo_blue_bright"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.5"
>
</android.support.v7.widget.RecyclerView>
</LinearLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end|right"
android:layout_marginBottom="#dimen/activity_vertical_margin"
android:layout_marginEnd="#dimen/activity_horizontal_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:src="#android:drawable/ic_input_add" />
</android.support.design.widget.CoordinatorLayout>
You need to include a LinearLayout inside the CoordinatorLayout. The inner LinearLayout provides the hook so that Android can do weighted views.
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:background="#android:color/holo_green_light">
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/lvToDoList"
android:layout_weight="0.5"
android:background="#android:color/holo_blue_bright"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v7.widget.RecyclerView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end|right"
android:layout_marginBottom="#dimen/activity_vertical_margin"
android:layout_marginEnd="#dimen/activity_horizontal_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:src="#android:drawable/ic_input_add" />
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
You can use weight like this
<android.support.constraint.ConstraintLayout 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_marginTop="#dimen/margin_10_dp"
android:layout_height="wrap_content">
<View
android:id="#+id/view1"
android:layout_width="0dp"
android:layout_height="5dp"
android:background="#212121"
android:text="Button 1"
app:layout_constraintEnd_toStartOf="#+id/view2"
app:layout_constraintHorizontal_weight="1"
app:layout_constraintStart_toStartOf="parent" />
<View
android:id="#+id/view2"
android:layout_width="0dp"
android:layout_height="5dp"
android:background="#3cff42"
android:text="Button 2"
app:layout_constraintEnd_toStartOf="#+id/view3"
app:layout_constraintHorizontal_weight="1"
app:layout_constraintStart_toEndOf="#+id/view1" />
<View
android:id="#+id/view3"
android:layout_width="0dp"
android:layout_height="5dp"
android:background="#f93d3d"
android:text="Button 3"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_weight="1"
app:layout_constraintStart_toEndOf="#+id/view2" />
Related
in my layout i have recyclerview of product listing..below that im displaying total price in linearlayout ...but on scroll linearlayout is not displaying
sceneorio of my code:
1--> when i have one item on recyclerview -->linearlayout displays fine
2--> when i have more items on recyclerview -->on scrolling down linearlayout cant be seen(linear layout is not displaying)
need help in second sceneorio...thanks in advance
Following here is code xml:--
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
xmlns:app="http://schemas.android.com/apk/res-auto">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/relative">
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:collapseIcon="#drawable/ic_arrow_back_black_24dp"
android:id="#+id/toolbartable"
android:background="#color/colorPrimaryDark">
</androidx.appcompat.widget.Toolbar>
</RelativeLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/relative"
android:id="#+id/nest"
android:scrollbars="vertical">
<androidx.recyclerview.widget.RecyclerView
android:layout_width="match_parent"
android:layout_below="#id/relative"
android:layout_height="wrap_content"
android:id="#+id/recyleview"/>
</ScrollView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="100dp"
android:id="#+id/linearlayoutorder"
android:layout_below="#id/nest"
android:orientation="horizontal"
android:weightSum="2"
android:background="#drawable/border"
android:backgroundTintMode="#color/colorPrimary">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TOTAL"
android:layout_gravity="center"
android:layout_weight="1"></TextView>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="#+id/totalidcost"
android:layout_gravity="right|center"
android:textAlignment="textEnd"
tools:ignore="RtlCompat"></TextView>
</LinearLayout>
</RelativeLayout>
Updated code:--
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
xmlns:app="http://schemas.android.com/apk/res-auto">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/relative">
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:collapseIcon="#drawable/ic_arrow_back_black_24dp"
android:id="#+id/toolbartable"
android:background="#color/colorPrimaryDark">
</androidx.appcompat.widget.Toolbar>
</RelativeLayout>
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/nest"
android:scrollbars="vertical"
android:layout_below="#id/relative">
<androidx.recyclerview.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:nestedScrollingEnabled="false"
android:id="#+id/recyleview"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="100dp"
android:id="#+id/linearlayoutorder"
android:orientation="horizontal"
android:weightSum="2"
android:background="#drawable/border"
android:backgroundTintMode="#color/colorPrimary">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TOTAL"
android:layout_gravity="center"
android:layout_weight="1"></TextView>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="#+id/totalidcost"
android:layout_gravity="right|center"
android:textAlignment="textEnd"
tools:ignore="RtlCompat"></TextView>
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</RelativeLayout>
error getting--:Caused by: android.view.InflateException: Binary XML file line #34: ScrollView can host only one direct child
`Caused by: java.lang.IllegalStateException: ScrollView can host only one direct child`
need help
following solution worked for me:-
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
xmlns:app="http://schemas.android.com/apk/res-auto">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/relative">
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:collapseIcon="#drawable/ic_arrow_back_black_24dp"
android:id="#+id/toolbartable"
android:background="#color/colorPrimaryDark">
</androidx.appcompat.widget.Toolbar>
</RelativeLayout>
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/nest"
android:scrollbars="vertical"
android:layout_below="#id/relative">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.recyclerview.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:nestedScrollingEnabled="false"
android:id="#+id/recyleview"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="100dp"
android:id="#+id/linearlayoutorder"
android:layout_below="#id/recyleview"
android:orientation="horizontal"
android:weightSum="2"
android:background="#drawable/border"
android:backgroundTintMode="#color/colorPrimary">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TOTAL"
android:layout_gravity="center"
android:layout_weight="1"></TextView>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="#+id/totalidcost"
android:layout_gravity="right|center"
android:textAlignment="textEnd"
tools:ignore="RtlCompat"></TextView>
</LinearLayout>
</RelativeLayout>
</androidx.core.widget.NestedScrollView>
</RelativeLayout>
You haven't added weightSum and orientation values for LinearLayout.
Source
You can use a NestedScrollView instead of the ScrollView. And also put your RecyclerView as well as the LinearLayout inside the NestedScrollView. And enable android:nestedScrollingEnabled=true. Should work for you.
<NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:nestedScrollingEnabled=true>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyleview"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#id/linearlayoutorder"
app:layout_constraintTop_toBottomOf="#id/relative" />
<LinearLayout
android:id="#+id/linearlayoutorder"
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#000000"
android:backgroundTintMode="#color/colorPrimary"
android:orientation="horizontal"
android:weightSum="2"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:text="TOTAL" />
<TextView
android:id="#+id/totalidcost"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right|center"
android:layout_weight="1"
android:textAlignment="textEnd"
tools:ignore="RtlCompat" />
</LinearLayout>
</LinearLayout>
And in your java class where you have your recyclerview set recyclerView.setNestedScrollingEnabled(true or false);
Use ConstraintLayout like this way, Here is full xml code what you need
<?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">
<RelativeLayout
android:id="#+id/relative"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbartable"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimaryDark"
app:collapseIcon="#drawable/back" />
</RelativeLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyleview"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#id/linearlayoutorder"
app:layout_constraintTop_toBottomOf="#id/relative" />
<LinearLayout
android:id="#+id/linearlayoutorder"
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#000000"
android:backgroundTintMode="#color/colorPrimary"
android:orientation="horizontal"
android:weightSum="2"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:text="TOTAL" />
<TextView
android:id="#+id/totalidcost"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right|center"
android:layout_weight="1"
android:textAlignment="textEnd"
tools:ignore="RtlCompat" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
I have an AppBar and other things in my layout. When the user scrolls down, I want AppBar(actually, the Toolbar to hide. This is what I have tried, the app bar isn't hiding all small part it just stays there. Actually I think the problem is with my header of the screen it gets collapsed and adds a small space when I scroll.
As you can see in second image some part stays it doesn't hide. I need to hide that part while scrolling.
Please provide me solution what am I doing wrong?
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:orientation="vertical">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleTextAppearance="#style/TextAppearance.AppCompat.Title"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:titleEnabled="false">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/slideIV"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/ic_dish" />
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bottomButtonRL"
android:layout_gravity="bottom"
android:background="#drawable/gradient_bg" />
<View style="#style/itemBottomViewLarge" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_margin="#dimen/_20"
android:gravity="center_vertical"
android:orientation="vertical">
<de.hdodenhof.circleimageview.CircleImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/fake_chef_bg"
app:civ_border_color="#color/border_grey_color"
app:civ_border_width="#dimen/_2" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/_5"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/bold_font"
android:text="#string/fatima_al_zahraa"
android:textColor="#color/white"
android:textSize="#dimen/large_text_size"
android:textStyle="bold" />
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:fontFamily="#font/regular_font"
android:text="#string/presenter_of_the_cuient"
android:textColor="#color/white"
android:textSize="#dimen/app_text_size" />
</LinearLayout>
</LinearLayout>
<RelativeLayout
android:id="#+id/bottomButtonRL"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_below="#+id/slideIV"
android:layout_marginTop="-25dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<View
android:layout_width="match_parent"
android:layout_height="#dimen/_0"
android:layout_weight="1" />
<View
android:layout_width="match_parent"
android:layout_height="#dimen/_0"
android:layout_weight="1"
android:background="#color/defaultColor" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingStart="#dimen/_20"
android:paddingLeft="#dimen/_20">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/ic_share" />
<RelativeLayout
android:layout_width="220dp"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/_10"
android:layout_marginLeft="#dimen/_10"
android:background="#drawable/ic_rec1">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fontFamily="#font/regular_font"
android:gravity="center"
android:layout_centerInParent="true"
android:text="#string/add_to_fav"
android:textColor="#color/white"
android:textSize="#dimen/medium_text_size" />
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/bottom_radius_view">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/regular_font"
android:padding="#dimen/_20"
android:text="#string/galetes_fires_au_plates_fires_au_plates_fires_au_plates_fires_au_plates_fires_au_plates"
android:textColor="#color/white"
android:textSize="#dimen/app_text_size" />
</LinearLayout>
</LinearLayout>
<androidx.appcompat.widget.Toolbar
android:visibility="gone"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
/>
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingLeft="#dimen/_20"
android:paddingTop="#dimen/_10"
android:paddingRight="#dimen/_20">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/bold_font"
android:padding="#dimen/_5"
android:text="#string/les_videos"
android:textColor="#color/medium_grey_text_color"
android:textSize="#dimen/large_text_size" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/itemFRV"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="#dimen/_5" />
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</layout>
This is the header code:
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="#dimen/header_height"
android:background="#color/white"
android:gravity="center"
android:orientation="horizontal"
android:paddingLeft="#dimen/_20"
android:paddingRight="#dimen/_20">
<LinearLayout
android:id="#+id/backLL"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="left"
android:gravity="center"
android:paddingRight="#dimen/_20"
android:layout_marginBottom="#dimen/_10"
android:visibility="gone">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/ic_back" />
</LinearLayout>
<ImageView
android:id="#+id/logoIV"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:adjustViewBounds="true"
android:paddingStart="0dp"
android:paddingTop="#dimen/_15"
android:paddingEnd="#dimen/_10"
android:layout_marginBottom="#dimen/_10"
android:src="#drawable/ic_header_logo" />
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1" />
<ImageView
android:id="#+id/profileIV"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:adjustViewBounds="true"
android:paddingStart="#dimen/_10"
android:paddingTop="#dimen/_15"
android:paddingEnd="0dp"
android:layout_marginBottom="#dimen/_10"
android:src="#drawable/ic_default_user" />
</LinearLayout>
</layout>
Answer to the problem is just remove
android:fitsSystemWindows="true"
Change the layout_scrollFlags
app:layout_scrollFlags="scroll|exitUntilCollapsed"
replace above line with
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed"
I was trying to have a map displayed on one of the fragments of the Bottom Navigation.
But, attached fragment is not covering complete screen. i tried adding background color to the fragment is as below:
While trying to add a map to the fragment it also is not convering the complete screen instead it shows only a bit of the screen.
Below my layout code:
Bottom Navigation.xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/grey_5">
<include
android:id="#+id/search_bar"
layout="#layout/include_card_view_search_bar" />
<androidx.core.widget.NestedScrollView
android:id="#+id/nested_scroll_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="none"
android:scrollingCache="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:descendantFocusability="blocksDescendants"
android:orientation="vertical">
<View
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_marginBottom="#dimen/spacing_middle" />
<FrameLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#color/blue_500"/>
</LinearLayout>
</androidx.core.widget.NestedScrollView>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:background="#color/blue_grey_700"
app:itemIconTint="#drawable/color_state_white_2"
app:itemTextColor="#drawable/color_state_white_2"
app:menu="#menu/menu_bottom_navigation_shifting" />
</RelativeLayout>
My Map Fragment:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/grey_5">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<fragment
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical">
<View
android:layout_width="match_parent"
android:layout_height="5dp"
android:background="#drawable/bg_gradient_soft" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#android:color/white"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:orientation="horizontal"
android:padding="#dimen/spacing_medium">
<ImageButton
android:id="#+id/map_button"
android:layout_width="?attr/actionBarSize"
android:layout_height="?attr/actionBarSize"
android:background="?attr/selectableItemBackgroundBorderless"
android:onClick="clickAction"
android:tint="#color/colorPrimary"
app:srcCompat="#drawable/ic_near_me" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Map"
android:textAppearance="#style/Base.TextAppearance.AppCompat.Subhead"
android:textColor="#color/colorPrimary"
android:textStyle="bold" />
</LinearLayout>
<View
android:layout_width="?attr/actionBarSize"
android:layout_height="0dp" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:padding="#dimen/spacing_medium">
<ImageButton
android:id="#+id/list_button"
android:layout_width="?attr/actionBarSize"
android:layout_height="?attr/actionBarSize"
android:background="?attr/selectableItemBackgroundBorderless"
android:onClick="clickAction"
android:tint="#color/colorPrimary"
app:srcCompat="#drawable/ic_format_list_bulleted" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="List"
android:textAppearance="#style/Base.TextAppearance.AppCompat.Subhead"
android:textColor="#color/colorPrimary"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/add_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerInParent="true"
android:layout_marginBottom="15dp"
android:clickable="true"
android:onClick="clickAction"
android:tint="#android:color/white"
app:backgroundTint="#color/colorPrimary"
app:elevation="2dp"
app:fabSize="normal"
app:rippleColor="#color/deep_orange_400"
app:srcCompat="#drawable/ic_add" />
</RelativeLayout>
Attaching the Map using my code:
mapFragment = (SupportMapFragment) this.getChildFragmentManager().findFragmentById(R.id.map);
The app looks like below:
add android:fillViewport="true" in NestedScrollView
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/grey_5">
<include
android:id="#+id/search_bar"
layout="#layout/include_card_view_search_bar" />
<androidx.core.widget.NestedScrollView
android:id="#+id/nested_scroll_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="none"
android:scrollingCache="true"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:descendantFocusability="blocksDescendants"
android:orientation="vertical">
<View
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_marginBottom="#dimen/spacing_middle" />
<FrameLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#color/blue_500"/>
</LinearLayout>
</androidx.core.widget.NestedScrollView>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:background="#color/blue_grey_700"
app:itemIconTint="#drawable/color_state_white_2"
app:itemTextColor="#drawable/color_state_white_2"
app:menu="#menu/menu_bottom_navigation_shifting" />
</RelativeLayout>
If NestedScrollView is not necessary try using some other ViewGroup i.e LinearLayout or RelativeLayout in its place. It seems the issue is in wrapping fragment content inside NestedScrollView.
You have taken FrameLayout(id-content) inside NestedScrollView, try removing NestedScrollView from there and adding it to the layout by which you are replacing it with FrameLayout(id-content)
I have this layout:
<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.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/listitem_1"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="16dp"
android:gravity="center"
android:text="item 1"
android:background="#ff0000"/>
<TextView
android:id="#+id/listitem_2"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="16dp"
android:gravity="center"
android:text="item 2"
android:background="#ff0000"/>
<TextView
android:id="#+id/listitem_3"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="16dp"
android:gravity="center"
android:text="item 3"
android:background="#ff0000"/>
<View
android:id="#+id/scroller_bottom_bar"
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#0000ff" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/fab_margin"
app:layout_anchor="#id/scroller_bottom_bar"
app:layout_anchorGravity="end"
app:srcCompat="#android:drawable/ic_dialog_email" />
</android.support.design.widget.CoordinatorLayout>
that translates to the following UI animation:
As you can see, the floating action button overlaps with the blue bottom view. I want to avoid this. How do I do that?
This can be fixed by adding insetEdge and dodgeInsetEdges attributes. Basically, insetEdge lets the CoordinatorLayout know that its other children can dodge it if they want to. Setting the dodgeInsetEdges on other views let's them actually dodge the dodge-able view (marked by insetEdge).
Rewriting the original xml layout as:
<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.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/listitem_1"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="16dp"
android:gravity="center"
android:text="item 1"
android:background="#ff0000"/>
<TextView
android:id="#+id/listitem_2"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="16dp"
android:gravity="center"
android:text="item 2"
android:background="#ff0000"/>
<TextView
android:id="#+id/listitem_3"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="16dp"
android:gravity="center"
android:text="item 3"
android:background="#ff0000"/>
<View
android:id="#+id/scroller_bottom_bar"
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#0000ff" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/fab_margin"
app:layout_anchor="#id/fab_anchor"
app:layout_anchorGravity="end"
app:layout_dodgeInsetEdges="bottom"
app:srcCompat="#android:drawable/ic_dialog_email" />
<View
android:id="#+id/fab_anchor"
android:layout_width="match_parent"
android:layout_height="1dp"
app:layout_anchor="#id/scroller_bottom_bar"
app:layout_insetEdge="bottom" />
</android.support.design.widget.CoordinatorLayout>
should result to the expected UI behavior:
I am trying to have 3 FAB's between two views. But the FAB's are below the top view as shown below.
How do I bring them to the front?
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:clickable="true"
android:focusableInTouchMode="true"
android:id="#+id/parentPanel"
android:background="#ffffff">
<LinearLayout
android:id="#+id/mapView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1">
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
card_view:cardCornerRadius="6dp"
android:layout_margin="10dp"
android:clickable="true"
android:focusable="true"
android:foreground="?android:selectableItemBackground"
android:id="#+id/deviceCard">
<fragment
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="io.tegaru.beepr.AddNewMapsLocationActivity" />
</android.support.v7.widget.CardView>
</LinearLayout>
<LinearLayout
android:id="#+id/bottomPanel"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:layout_weight="4"
android:background="#android:color/white">
<LinearLayout
android:id="#+id/btnPanel1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1"
android:background="#android:color/white">
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:onClick="AddNewReminderBtnClicked"
app:backgroundTint="#292929"
app:fabSize="normal"
app:srcCompat="#drawable/ic_menu_send"
android:layout_gravity="top|center"
android:layout_marginTop="-20dp" />
</LinearLayout>
<LinearLayout
android:id="#+id/btnPanel2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1"
android:background="#android:color/white">
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:onClick="AddNewReminderBtnClicked"
app:backgroundTint="#292929"
app:fabSize="normal"
app:srcCompat="#drawable/ic_menu_send"
android:layout_gravity="top|center"
android:layout_marginTop="-20dp" />
</LinearLayout>
<LinearLayout
android:id="#+id/btnPanel3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1"
android:background="#android:color/white">
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:onClick="AddNewReminderBtnClicked"
app:backgroundTint="#292929"
app:fabSize="normal"
app:srcCompat="#drawable/ic_menu_send"
android:layout_gravity="top|center"
android:layout_marginTop="-20dp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
LinearLayout does not allow children views to be overlapped.
You should use RelativeLayout (or FrameLayout, etc) instead of LinearLayout as the parent if you want to display FABs above (overlapping) other views.
In your case, set the root layout to RelativeLayout. You may need to make other adjustments though.
To space the fabs equally and use them as an overlay for a web view for example, look at my code:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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"
android:theme="#style/ThemeOverlay.AppCompat.Dark">
<WebView
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"></WebView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:clickable="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/fab2"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:clickable="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/fab3"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/fab1" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:clickable="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/fab2" />
</android.support.constraint.ConstraintLayout>