I want to have an that will include a layout that contains a progress bar. The problem is that the background does not fill in the bottom and in the top, and I want that the background goes in front of the bottom navigation bar and the bottom bar. Here is a image of the problem.
Here is my include
<include
android:id="#+id/loadingProductDetails"
layout="#layout/dialog_login"
android:layout_width="0dp"
android:layout_height="0dp"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
Here is my full layout
<?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"
xmlns:tools="http://schemas.android.com/tools">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimaryDark"
android:minHeight="?attr/actionBarSize"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.appcompat.widget.AppCompatTextView
style="#style/RepsolText"
android:id="#+id/categoryText"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center"
android:textSize="20sp"
android:textColor="#android:color/white"
tools:layout_editor_absoluteX="16dp"
tools:layout_editor_absoluteY="14dp" />
</androidx.appcompat.widget.Toolbar>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerViewOffersByCategories"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginStart="21dp"
android:layout_marginTop="32dp"
android:layout_marginEnd="21dp"
android:layout_marginBottom="80dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/toolbar"
app:layout_constraintVertical_bias="0.0" />
<include
android:id="#+id/loginLoadingProduct"
layout="#layout/dialog_login"
android:layout_width="0dp"
android:layout_height="0dp"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
</layout>
Related
I am practing recyclerView in a fragment in Android Studio, I made this Application;
As you can see there is a whitespace between the toolbar (appbar) and the contents (i.e the recyclerview in this case)
Please, how do I get rid of this whitespace..
Here's the .xml file of the fargment I put the recyclerview:
<androidx.constraintlayout.widget.ConstraintLayout 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"
tools:context=".ui.newscreen.NewScreenFragment">
<!-- TODO: Update blank fragment layout -->
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerview"
android:layout_width="0dp"
android:layout_height="0dp"
app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:listitem="#layout/new_screen_recyclerview_look" />
</androidx.constraintlayout.widget.ConstraintLayout>
Here's the sample layout listItem;
<androidx.constraintlayout.widget.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_height="wrap_content">
<androidx.cardview.widget.CardView
android:id="#+id/cardView"
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_marginStart="8dp"
android:layout_marginTop="12dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
app:cardCornerRadius="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:id="#+id/card_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
app:srcCompat="#drawable/nav_header_image_nature"
android:contentDescription="#string/images_for_the_stories" />
</androidx.cardview.widget.CardView>
<TextView
android:id="#+id/card_title"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:text="#string/Leonardo_Del_Vecchio"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="#+id/cardView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/cardView"
app:layout_constraintTop_toTopOf="#+id/cardView"
app:layout_constraintVertical_bias="0.04000002" />
<TextView
android:id="#+id/card_tontent"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="16dp"
android:maxLines="3"
android:text="#string/sample_story_content"
android:textSize="18sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/cardView"
app:layout_constraintTop_toBottomOf="#+id/card_title" />
</androidx.constraintlayout.widget.ConstraintLayout>
Thanks in Advance for your Help!
I have been able to solve the issue.
There was a attribute in the main_activity.xml that cause this.
which was android:paddingTop="?attr/actionBarSize
<androidx.constraintlayout.widget.ConstraintLayout 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:paddingTop="?attr/actionBarSize">
In my cardview layout I've placed one Constraint Layout in which's NestedScrollView that isn't scrolling.
I've searched Stack Overflow, nothing works. This cardView layout is later placed in RecyclerView, if that matters. Below I launch also blueprint of layout. Only part of it is shown in recycler view, where user click's Floating Action Button view is expanding. Where's problem?
<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_margin="10dp"
android:layout_height="wrap_content">
<androidx.cardview.widget.CardView
android:id="#+id/main_cardview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/entire_card_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="#+id/main_cardview">
<!--This is a ConstraintLayout for the fixed portion
of the CardView. The elements
that lie within the fixed portion of the CardView
can be constrained to this layout.-->
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/fixed_container"
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="#color/teal_700"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0">
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/fab_expand"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:background="#FFFFFF"
android:backgroundTint="#color/white"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.954"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.888"
app:srcCompat="#drawable/ic_baseline_expand_more_24" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/hidden_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/fixed_container"
tools:visibility="visible">
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="parent">
<com.google.android.material.textview.MaterialTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/lorem_ipsum_long" />
</androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>
Blueprint of layout:
your code is working fine. modified a little bit. please check it.
<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_margin="10dp"
android:layout_height="wrap_content">
<androidx.cardview.widget.CardView
android:id="#+id/main_cardview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/entire_card_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="#+id/main_cardview">
<!--This is a ConstraintLayout for the fixed portion
of the CardView. The elements
that lie within the fixed portion of the CardView
can be constrained to this layout.-->
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/fixed_container"
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="#color/teal_700"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0">
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/fab_expand"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:background="#FFFFFF"
android:backgroundTint="#color/white"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.954"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.888"
app:srcCompat="#drawable/ic_launcher_foreground"
android:layout_marginRight="16dp"
tools:ignore="VectorDrawableCompat" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/hidden_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/fixed_container"
tools:visibility="visible">
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fillViewport="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="parent">
<com.google.android.material.textview.MaterialTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/lorem_ipsum_long"
android:layout_marginBottom="16dp"/>
</androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>
In my activity (ConstraintLayout) I have an actionbar and a container (for my viewpage adapater). In this container I am displaying various fragments.
My problem is that the fragments (also in ConstraintLayout) are not completely displayed, meaning they are cut off at the end. My assumption is that this happens because the fragment "doesnt know" about the action bar in the activity and thus thinks it has the full screen to use but instead this part which the action bar takes up is moved down and off from the screen. That's just an assumption maybe I am completely wrong. Anybody can help on how to make sure the fragment layout is somehow "fitted" right to the screen?
my activity xml with the actionbar:
<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="wrap_content"
tools:context=".TourActivity">
<include
android:id="#+id/app_bar"
layout="#layout/app_bar"
tools:layout_editor_absoluteY="8dp"></include>
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
app:layout_constraintTop_toBottomOf="#+id/app_bar" />
</android.support.constraint.ConstraintLayout>
the fragment xml:
<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"
tools:context=".TourActivity">
<TextView
android:id="#+id/test"
android:layout_width="388dp"
android:layout_height="wrap_content"
android:layout_marginStart="24dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="24dp"
android:gravity="center"
android:text="testtest testtest"
android:textSize="25dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.52"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/imageView"
android:layout_width="365dp"
android:layout_height="185dp"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/question"
tools:src="#android:color/darker_gray" />
<Button
android:id="#+id/answerButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="156dp"
android:layout_marginEnd="8dp"
android:text="answerButton1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageView" />
<Button
android:id="#+id/answerButton2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="32dp"
android:layout_marginEnd="8dp"
android:text="answerButton2"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/answerButton1" />
<Button
android:id="#+id/answerButton3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="32dp"
android:layout_marginEnd="8dp"
android:text="answerButton3"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/answerButton2" />
</android.support.constraint.ConstraintLayout>
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="8dp"
app:layout_constraintTop_toBottomOf="#+id/app_bar"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent" />
Pls give that a go.
Use Relative Layout in the main XML file
<RelativeLayout 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="wrap_content"
tools:context=".TourActivity">
<include
android:id="#+id/app_bar"
layout="#layout/app_bar"
tools:layout_editor_absoluteY="8dp"/>
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/app_bar" />
</RelativeLayout>
I have implemented a bottom navigation view in my android application. With five fragments. However, I have a problem that each time I change the fragment the content of the fragment overlaps the toolbar.
layout for the bottom navigation view
<?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"
tools:context=".DashboardActivity">
<include layout="#layout/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</include>
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_above="#+id/navigationView"
android:layout_height="match_parent"
/>
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigationView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="0dp"
android:layout_marginStart="0dp"
android:background="?android:attr/windowBackground"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:itemBackground="#android:color/white"
app:itemIconTint="#color/cardview_dark_background"
app:itemTextColor="#android:color/black"
app:menu="#menu/navigation_menu"
/>
</android.support.constraint.ConstraintLayout>
an example of one of the fragments layout
<?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:id="#+id/frameLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".AttendanceFragment">
<android.support.constraint.Guideline
android:id="#+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.7" />
<android.support.v7.widget.CardView
android:id="#+id/cardView2"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toTopOf="#+id/barrier3"
app:layout_constraintEnd_toStartOf="#+id/guideline"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<Spinner
android:id="#+id/spinner_courses"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:paddingBottom="4dp"
android:paddingTop="4dp"
app:layout_constraintEnd_toStartOf="#+id/guideline"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.v7.widget.CardView>
<TextView
android:id="#+id/tv_time"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="center"
android:textColor="#color/colorPrimaryDark"
android:textSize="12sp"
app:layout_constraintBottom_toTopOf="#+id/barrier3"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="#+id/guideline"
app:layout_constraintTop_toTopOf="parent"
tools:text="Date" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/add_fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|right"
android:layout_margin="16dp"
android:src="#drawable/ic_add_icon"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
<!--<android.support.design.widget.FloatingActionButton
android:id="#+id/floatingActionButton"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginBottom="4dp"
android:layout_marginEnd="8dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="4dp"
android:clickable="true"
app:srcCompat="#drawable/ic_more_vert_black_24dp"
app:fabSize="mini"
app:layout_constraintBottom_toBottomOf="#+id/textView3"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/spinner"
app:layout_constraintTop_toTopOf="parent"
android:focusable="true" />-->
<android.support.constraint.Barrier
android:id="#+id/barrier3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="bottom"
app:constraint_referenced_ids="cardView2,tv_time"
tools:layout_editor_absoluteY="511dp" />
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginTop="4dp"
app:cardBackgroundColor="#color/colorMainBackground"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/barrier3">
<android.support.v7.widget.RecyclerView
android:id="#+id/rv_register"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v7.widget.RecyclerView>
</android.support.v7.widget.CardView>
</android.support.constraint.ConstraintLayout>
This is what the screen look like with overlapping content
I removed from my ConstraintLayout the default generated marginTop field, and changed my fragment's layout_height to 0dp. Then in all of my Fragments' layout's the outermost layout_height I always set to match parent.
<?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"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/nav_view"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="0dp"
android:layout_marginEnd="0dp"
android:background="?android:attr/windowBackground"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="#menu/bottom_nav_menu" />
<fragment
android:id="#+id/nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
app:defaultNavHost="true"
app:layout_constraintBottom_toTopOf="#id/nav_view"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Add margins to container:
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_above="#+id/navigationView"
android:layout_height="match_parent"
android:layout_marginBottom="{bottom_navigation_height}"
android:layout_marginTop="{tool_bar_height}"
/>
You should add constraints to your #id/container.
To the top to your toolbar and to the bottom to the BottomNavigationBar. The same should you do to these elements. Toolbar top to parent and toolbar bottom to container. BottomNavigationBar top to container and bottom to parent. Then set the height of the container to 0dp.
<include layout="#layout/toolbar"
android:id="#+id/toolbar"
android:layout_width="0dp"
android:layout_height="?attr/actionBarSize"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"/>
<FrameLayout
android:id="#+id/container"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="#+id/navigationView"
app:layout_constraintTop_toTopOf="#id/toolbar"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"/>
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigationView"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
Didn't test the code but should work.
Its overlapping because You have not giving proper constraint to your controls.
You can try this way.
<?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">
<include
android:id="#+id/include"
layout="#layout/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
<FrameLayout
android:id="#+id/container"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/navigationView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/include" />
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigationView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="0dp"
android:layout_marginStart="0dp"
android:background="?android:attr/windowBackground"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:itemBackground="#android:color/white"
app:itemIconTint="#color/cardview_dark_background"
app:itemTextColor="#android:color/black"
app:menu="#menu/navigation_menu"
/>
</android.support.constraint.ConstraintLayout>
In Recent Android Studio Versions (4.0.beta 1), if the hierarchy on the default generated activity_main.xml (omitted attributes) is as following,
<androidx.constraintlayout.widget.ConstraintLayout>
<com.google.android.material.bottomnavigation.BottomNavigationView />
<fragment />
</androidx.constraintlayout.widget.ConstraintLayout>
The fragments seems overlapping the bottom navigation, just rearranging it as shown below,
<androidx.constraintlayout.widget.ConstraintLayout>
<fragment />
<com.google.android.material.bottomnavigation.BottomNavigationView />
</androidx.constraintlayout.widget.ConstraintLayout>
fixed the problem for me without touching any constraints and NOT adding any padding or margins
your fragment container used "match_parent",which take up the position of toolbar and navigationBar,maybe you can choice nested LinearLayout and use height=warp_content, weight=1
I am using two child ConstraintLayouts inside another. The first child contains the empty view, and the second contains my listview and floating action button. When there is no data in the listview, the empty view rightly appears in its position. However, when there is data in listview, the listview shows up after a big empty area on the layout, as if the empty view still takes its space, though it is not shown.
This is the layout:
<?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"
android:id="#+id/content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
>
<android.support.v7.widget.Toolbar xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
<android.support.constraint.ConstraintLayout
app:layout_constraintTop_toTopOf="parent"
android:layout_below="#+id/toolbar"
android:id="#+id/empty_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="?attr/actionBarSize">
<TextView
app:layout_constraintTop_toTopOf="parent"
android:id="#+id/tv_empty_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/list_is_empty"
android:textSize="#dimen/large_text"
android:textStyle="bold"
/>
<ImageView
android:id="#+id/iv_empty_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#id/tv_empty_view"
app:layout_constraintRight_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
android:contentDescription="#string/list_is_empty"
android:src="#drawable/emptybox" />
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/content_area"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
android:layout_marginTop="?attr/actionBarSize"
>
<ListView
android:id="#+id/listview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
/>
<android.support.design.widget.FloatingActionButton
android:layout_below="#+id/listview"
android:id="#+id/fab"
android:layout_width="#android:dimen/notification_large_icon_width"
android:layout_height="#android:dimen/notification_large_icon_height"
android:layout_gravity="end|bottom"
android:src="#drawable/plus"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toRightOf="parent"
/>
</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>
Here is the layout on app launch with and without listview items:
Use this in your code .
view.setVisibility(View.VISIBLE);
view.setVisibility(View.GONE);
And default xml layout .
<?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:id="#+id/content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="584dp"
android:layout_height="64dp"
android:background="?attr/colorPrimary"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
<android.support.constraint.ConstraintLayout
android:id="#+id/empty_view"
android:layout_width="584dp"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar"
android:layout_marginTop="64dp"
android:visibility="gone"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:layout_editor_absoluteX="8dp">
<TextView
android:id="#+id/tv_empty_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/list_is_empty"
android:textSize="#dimen/large_text"
android:textStyle="bold"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:layout_editor_absoluteX="0dp"/>
<ImageView
android:id="#+id/iv_empty_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/list_is_empty"
android:src="#drawable/emptybox"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tv_empty_view"/>
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout
android:id="#+id/content_area"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="64dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ListView
android:id="#+id/listview"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="64dp"
android:layout_height="64dp"
android:layout_below="#+id/listview"
android:layout_gravity="end|bottom"
android:src="#drawable/plus"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>
The content_area is visible ,and empty_view is gone .
And in your code .
If ListView 's data is not null ,you do not do any thing .
If ListView 's data is null ,you should do this .
// set empty_view visible
ConstraintLayout empty_view = (ConstraintLayout) findViewById(R.id.empty_view);
empty_view.setVisibility(View.VISIBLE);
// set content_area gone
ConstraintLayout content_area = (ConstraintLayout) findViewById(R.id.content_area);
content_area.setVisibility(View.GONE);