Navbar overlapping last ListView item (Android)

Question

My problem is similar to above Image

I am getting this issue in Nexus Devices. I added margin from bottom by getting Bottom Navigation Bar height. But my application is showing extra margin from the bottom on a tablet.

I do not want to change anything in my style file.

Code:- 
<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/main_coordinator_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/clubhouse_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.v7.widget.Toolbar
            xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:id="@+id/clubhouse_toolbar_main"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:minHeight="?attr/actionBarSize"
            android:background="@android:color/holo_red_dark"
            app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            app:layout_scrollFlags="scroll|enterAlways">

            <TextView
                             android:id="@+id/toolbar_title"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:textAppearance="@android:style/TextAppearance.Holo.Medium.Inverse"
                android:gravity="center"
                android:singleLine="true"
                android:maxLines="1"
                android:paddingLeft="2dp"
                android:ellipsize="end"
                android:textColor="@color/white"
                />


        </android.support.v7.widget.Toolbar>

    </android.support.design.widget.AppBarLayout>

    <ImageView
        android:id="@+id/iv_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_ab_arrowup"/>
    <FrameLayout
        android:id="@+id/drop_down_overlay_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/white"
        android:layout_marginTop="60dp"
        android:fitsSystemWindows="true"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>

The drop_down_overlay_container in this framelayout is where I am showing my Fragment.

Can you complete the question by posting additional details, such as the layout you are using, or any relevant code? — Jose Gómez, Apr 23 '16 at 15:45
Can you provide us with a screenshot and mark the exact spot of the problem — jobbert, Apr 28 '16 at 14:34
Thanks, I am working on it :) What is the test device tablet? — jobbert, Apr 28 '16 at 14:51
try removing `android:fitsSystemWindows="true"` from the `FrameLayout` — Akash Raghav, May 04 '16 at 08:49

jobbert · Answer 1 · 2016-04-28T14:56:48.817

39

Ok the problem is the following, the cardview match parent height is actually the full screen height with top bar. An very easy fix for this is to add:

    android:layout_marginBottom="?attr/actionBarSize"

like this:

<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="match_parent"
    android:layout_marginBottom="?attr/actionBarSize"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context="com.example.jburg.empty.Main22Activity"
    tools:showIn="@layout/activity_main22"
    android:background="@color/colorAccent"/>

This works on my emulator nexus 10 tablet. Let me know if this helps you otherwise I'll keep searching :)

edited Apr 28 '16 at 14:56

answered Apr 28 '16 at 13:39

jobbert

3,297
27
43

even i checked by removing the margin. I just want to know the root cause – sharma_kunal Apr 28 '16 at 14:07
Really Thanks, I checked on Sony Xperia Model number:- SGP771 and Version :- 5.02 – sharma_kunal Apr 28 '16 at 15:00
1

But i do not resolve my problem.Because my problem is related to other devices margin from bottom is not the perfect solution. If you want +50 point not an issue but i am curious for root cause – sharma_kunal Apr 28 '16 at 15:04
Still not? Still same result? – jobbert Apr 28 '16 at 15:06
Yes, Even i am surprise way this thing happens. – sharma_kunal Apr 28 '16 at 15:08
Thanks my friend for you cooperation Really appriciable :) Its working now. and its for all please add android:layout_marginBottom="?attr/actionBarSize" its works for me – sharma_kunal Apr 28 '16 at 15:14
Can you please tell the exact region why we need to add this. – sharma_kunal Apr 28 '16 at 15:20
I think you mean reason and yes I can: The top bar has a certain height, the fragment tries to be the full height of the screen without looking at the top bar so the bottom of this fragment will be outside the screen. – jobbert Apr 29 '16 at 15:56
6

This is not any solution. There is extra bottom margin on devices without soft navbar. – user1209216 Sep 20 '16 at 12:04
@user1209216, I think you are right. You could try adding this to styles false , like the solution in the link Smartiz supplied http://stackoverflow.com/q/27723322/1607191. – jobbert Sep 20 '16 at 15:32
1

No, I could not try to add this to styles. I want color status bar. WTF, where is the real reason? Google fault or what? – user1209216 Sep 20 '16 at 16:14
This gives too much margin at the bottom, it doesn't fit the bottom soft navbar. – FerDensetsu Oct 12 '18 at 18:09

score 1 · Answer 2 · edited Apr 28 '16 at 14:19

1

Try adding this line android:fitsSystemWindows="true" to the CoordinatorLayout.

edited Apr 28 '16 at 14:19

shim

9,289
12
69
108

answered Apr 28 '16 at 13:26

Bob

13,447
7
35
45

score 1 · Answer 3 · edited May 23 '17 at 12:02

1

did you try this

Bottom soft NavigationBar overlaps my ListView

The Only problem is that you mention you don't want to change your style file ( didn't mention why! ) and that user achieve your result by changing style file.

edited May 23 '17 at 12:02

Community

1
1

answered May 01 '16 at 05:30

Omid Heshmatinia

5,089
2
35
50

score 0 · Answer 4 · answered May 04 '16 at 08:45

0

try to add this code in imageview.

android:layout_below="@+id/clubhouse_toolbar_main"

answered May 04 '16 at 08:45

Albert Louise

1

score 0 · Answer 5 · answered May 04 '16 at 09:26

0

Just a suggestion :
You could add a dummy button with visibility="invisible"(not "gone"). The default height of a button is almost same as that of the Navigation Bar. So even if the Navigation bar is over the button, your important data will be fully visible(Above the navigation bar). And you don't have to think about the button being seen.

In your case i'm assuming that you have some scrollable view in your Fragment. So you should put the button inside your fragment xml under your scrolllable view(listview, recyclerview ...) or at the bottom of your fragment xml.

answered May 04 '16 at 09:26

Akhil Soman

2,077
2
17
30

The problem with this is that you don't know how many dp the navbar takes on every device. – techfly Feb 12 '17 at 12:18
you don't have to worry about the dp. In every screen size the default height of a button is almost same as that of the navigation bar. – Akhil Soman Feb 13 '17 at 03:06

score 0 · Answer 6 · answered May 04 '16 at 11:33

0

just add bottom padding same as height of bottom navigation bar in RecyclerView.

answered May 04 '16 at 11:33

MohdTausif

498
4
13

1

The problem with this is that you don't know how many dp the navbar takes on every device. – techfly Feb 12 '17 at 12:18

score 0 · Answer 7 · answered Feb 24 '20 at 06:17

I was facing the similar problem. I tried with all possible solution But din't work. Then I tried by myself by adding the View element to my parent as below:

<?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=".FilterLocationActivity">

  <include layout="@layout/app_bar" />

  <ExpandableListView
    android:id="@+id/lvLocations"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:divider="@null"
    app:layout_constraintBottom_toBottomOf="@+id/tester"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/toolbar" />

  <View
    android:id="@+id/tester"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:layout_constraintBottom_toBottomOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>

This doesn't fix the problem for me. – ThomasW Jul 05 '20 at 10:44 — ThomasW, Jul 05 '20 at 10:44

score 0 · Answer 8 · answered Mar 14 '21 at 11:12

I know this is an old question but I would like to share this with you. Inside the activity

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    window.goEdgeToEdge()
    binding = ActivityStoreBinding.inflate(layoutInflater)
    setContentView(binding.root)
    findNavController().setGraph(R.navigation.store_nav_graph, getStoreBundle())
}

/**
 * Set various flags to go edge to edge
 */
private fun Window.goEdgeToEdge() {
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
        addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS)
        statusBarColor = Color.TRANSPARENT
    }
    WindowCompat.setDecorFitsSystemWindows(this, true)
}

Rahul Sharma · Answer 9 · 2021-05-24T02:53:48.930

I faced similar issue. I was using theme NoActionBar and ConstraintsLayout as parent layout. None of the answer here worked in my case. Finally the following solution worked for me. Hopefully it help someone.

Just add these line to your RecyclerView/ListView

android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"

Here is my complete recyclerview

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/rvProducts"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/toolbar"/>

score -1 · Answer 10 · answered Apr 27 '16 at 22:49

-1

It looks like something related to SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION. Make sure that your activity does not have this flag set in setSystemUiVisibility

answered Apr 27 '16 at 22:49

mbonnin

6,893
3
39
55

Sry i didn't added this flag – sharma_kunal Apr 27 '16 at 23:20
Do you have any other idea. I added by getting navbar height but i am getting extra margin from bottom in certain devices – sharma_kunal Apr 27 '16 at 23:37

Navbar overlapping last ListView item (Android)

10 Answers10

Linked