CODEWITHSUNDEEP
androidandroid-layout
user21597761
user21597761

Reputation:

Android BottomNavigationView has strange bottom padding

I have main_layout with bottom_navigation and fragment with some other components. Left fragment is in portrait orientation and the NavigationBottomView here looks fine, but on the right fragment where the orientation is set to landscape there is also a padding on the bottom. The question is how to remove that padding on the bottom of navigationview in landscape mode? First screenshots:

enter image description here enter image description here

Now code:

main_activity.xml

<?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:id="@+id/main_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorBackground"
    android:filterTouchesWhenObscured="true"
    tools:context="pl.anwim.zcspa.activities.MainActivity">

    <ProgressBar
        android:id="@+id/progress"
        style="?android:attr/progressBarStyleLarge"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:indeterminate="true"
        android:visibility="gone"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <androidx.fragment.app.FragmentContainerView
        android:id="@+id/nav_host_fragment"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:defaultNavHost="true"
        app:layout_constraintBottom_toTopOf="@+id/bottom_navigation"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@id/toolbar_include"
        app:navGraph="@navigation/nav_graph" />

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottom_navigation"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:background="@color/colorWhite"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/nav_host_fragment"
        app:menu="@menu/role_dispatcher_menu" />

    <include
        android:id="@+id/toolbar_include"
        layout="@layout/common_toolbar_hamburger"
        app:layout_constraintBottom_toTopOf="@+id/nav_host_fragment"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

(left) opponent_station_list_fragment.xml

<?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">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/card_list"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <com.omadahealth.github.swipyrefreshlayout.library.SwipyRefreshLayout
            android:id="@+id/admin_card_list_refresh"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintTop_toBottomOf="@id/card_list_title"
            app:srl_direction="bottom">

            <se.emilsjolander.stickylistheaders.StickyListHeadersListView
                android:id="@+id/admin_card_list"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                tools:context="pl.anwim.mobile.v2.customer.activities.adminCard.AdminCardListFragment"
                tools:listitem="@layout/opponent_station_list_row_fragment" />

        </com.omadahealth.github.swipyrefreshlayout.library.SwipyRefreshLayout>

        <pl.anwim.zcspa.ui.component.CustomTextView
            android:id="@+id/card_list_title"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="@dimen/dp_10"
            android:text="@string/no"
            android:textAppearance="@style/Primary20BoldText"
            app:ctv_backgroundColor="@color/colorTransparent"
            app:ctv_iconColor="@color/colorPrimary"
            app:ctv_iconDrawable="@drawable/ic_card"
            app:ctv_iconPadding="@dimen/dp_15"
            app:ctv_iconSize="@dimen/list_icon_size"
            app:ctv_textColor="@color/colorPrimary"
            app:layout_constraintTop_toTopOf="parent" />

    </androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

(right) history_fragment.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.core.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <RelativeLayout
            android:id="@id/rl1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/card_list_title">

            <View
                android:id="@+id/hline1"
                android:layout_width="fill_parent"
                android:layout_height="5dip"
                android:layout_marginTop="10dp"
                android:layout_marginBottom="2dp"
                android:layout_toLeftOf="@+id/header1"
                android:background="#000000" />

            <TextView
                android:id="@+id/header1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerHorizontal="true"
                android:layout_marginHorizontal="10dp"
                android:text="Filtrowanie"
                android:textColor="#000000"
                android:textSize="20dp"
                android:textStyle="bold" />

            <View
                android:id="@+id/hline2"
                android:layout_width="fill_parent"
                android:layout_height="5dip"
                android:layout_marginTop="10dp"
                android:layout_toRightOf="@+id/header1"
                android:background="#000000" />

        </RelativeLayout>


        <LinearLayout
            android:id="@+id/ll2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:weightSum="3"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/rl1">

            <RelativeLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1">

                <EditText
                    android:id="@+id/date_filter1"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_weight="1"
                    android:focusableInTouchMode="false"
                    android:gravity="center"
                    android:hint="Data od"
                    android:inputType="none"
                    android:textColor="@color/ms_black"
                    android:textSize="20sp" />

                <EditText
                    android:id="@+id/date_filter2"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_below="@id/date_filter1"
                    android:layout_weight="1"
                    android:focusableInTouchMode="false"
                    android:gravity="center"
                    android:hint="Data do"
                    android:inputType="none"
                    android:textColor="@color/ms_black"
                    android:textSize="20sp" />

            </RelativeLayout>

            <EditText
                android:id="@+id/report_history_station_value"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:gravity="center"
                android:hint="Nazwa stacji"
                android:textColor="@color/ms_black"
                android:textSize="20sp" />

            <CheckBox
                android:id="@+id/report_history_proper_value"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:gravity="center"
                android:hint="Prawidłowość"
                android:textColor="@color/ms_black"
                android:textSize="20sp" />
        </LinearLayout>

        <Button
            android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Filtruj"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/ll2" />

        <RelativeLayout
            android:id="@+id/rl2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="@dimen/dp_10"
            android:orientation="vertical"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/button">

            <View
                android:id="@+id/hline3"
                android:layout_width="fill_parent"
                android:layout_height="5dip"
                android:layout_marginTop="10dp"
                android:layout_marginBottom="2dp"
                android:layout_toLeftOf="@+id/header2"
                android:background="#000000" />

            <TextView
                android:id="@+id/header2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerHorizontal="true"
                android:layout_marginHorizontal="10dp"
                android:text="Filtrowanie"
                android:textColor="#000000"
                android:textSize="20dp"
                android:textStyle="bold" />

            <View
                android:id="@+id/hline4"
                android:layout_width="fill_parent"
                android:layout_height="5dip"
                android:layout_marginTop="10dp"
                android:layout_toRightOf="@+id/header2"
                android:background="#000000" />

        </RelativeLayout>

        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/history_recycler"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/colorLightGray"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toBottomOf="@id/rl2" />


        <pl.anwim.zcspa.ui.component.CustomTextView
            android:id="@+id/card_list_title"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="@dimen/dp_10"
            android:text="@string/no"
            android:textAppearance="@style/Primary20BoldText"
            app:ctv_backgroundColor="@color/colorTransparent"
            app:ctv_iconColor="@color/colorPrimary"
            app:ctv_iconDrawable="@drawable/ic_card"
            app:ctv_iconPadding="@dimen/dp_15"
            app:ctv_iconSize="@dimen/list_icon_size"
            app:ctv_textColor="@color/colorPrimary"
            app:layout_constraintTop_toTopOf="parent" />


    </androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>

If there is anything else you need to know just tell me. Thank you in advance!

Upvotes: 2

Views: 4259

Answers (4)

Đức L&#234; C&#244;ng
Đức L&#234; C&#244;ng

Reputation: 414

Android API >=30, UI keep spacing for bottom navigation UI even when it's hidden the spacing is called inset bottom, you set it to 0, add following kotlin's code on onViewCreated()

binding.bottomNavigationView.setOnApplyWindowInsetsListener { view, insets ->
        view.updatePadding(bottom = 0)
        insets
    }

Upvotes: 3

Smirky
Smirky

Reputation: 197

I had a similar problem, extra bottomPadding was getting added to BottomNavigationView after rotating from Fullscreen Landscape to Portrait Mode.

Found some relevant links -

In the end what worked for me was - https://github.com/material-components/material-components-android/issues/499#issuecomment-519618931

In MainActivity, onCreate() -

 mainBinding.bottomNavigationView.setOnApplyWindowInsetsListener(null)
 mainBinding.bottomNavigationView.setPadding(0,0,0,0)

Upvotes: 8

Zain
Zain

Reputation: 1

You need to give specific height to the bottom navigation view. Use this android:layout_height="?attr/actionBarSize" in bottom navigation view

Upvotes: 0

dennisrufigill
dennisrufigill

Reputation: 379

Remove app:layout_constraintTop_toBottomOf="@id/nav_host_fragment" in the bottom_navigation (BottomNavView) and add fix height android:layout_height="56dp" change 56 according to your requirement.

Upvotes: 0

Related Questions