CODEWITHSUNDEEP
androidxmlandroid-fragments
Tio
Tio

Reputation: 1036

How to show only fragment area when I use a BottomNavigationView?

I'm currently developing an application using android-studio with Kotlin.

This app has a BottomNavigationView and 4 fragments.

My question is How I can show only fragment area using BottomNavigationView?

ex) when I divide a fragment area using two LinearLayouts, each LinearLaytout has a different height like the photo below: enter image description here And I want to divide each LinearLaytout as the same heights.

Here are the codes:

fragment.xml

<?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"
              tools:context=".fragments.HowToUseFragment" android:orientation="vertical">
    <LinearLayout
            android:id="@+id/viewBag"
            android:visibility="visible"
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:background="@android:color/holo_blue_bright">
    </LinearLayout>
    <LinearLayout
            android:id="@+id/viewReceipt"
            android:visibility="visible"
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:background="@android:color/holo_blue_dark">
    </LinearLayout>
</LinearLayout>

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">

    <com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottom_navigation"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:background="?android:attr/windowBackground"
            app:menu="@menu/bottom_navigation_menu"/>
    <fragment
            android:id="@+id/nav_host_fragment"
            android:layout_height="match_parent"
            android:layout_width="match_parent"
            android:name="androidx.navigation.fragment.NavHostFragment"
            app:navGraph="@navigation/navigation_graph"/>
</FrameLayout>

Android Studio : 3.3.2

Upvotes: 0

Views: 27

Answers (1)

shmakova
shmakova

Reputation: 6426

Try LinearLayout instead of FrameLayout:

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <fragment
        android:id="@+id/nav_host_fragment"
        android:layout_height="match_parent"
        android:layout_width="match_parent"
        android:layout_weight="1"
        android:name="androidx.navigation.fragment.NavHostFragment"
        app:navGraph="@navigation/navigation_graph"/>

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="?android:attr/windowBackground"
        app:menu="@menu/bottom_navigation_menu"/>
</LinearLayout>

Or add android:layout_marginBottom="56dp" to your <fragment/>

Upvotes: 1

Related Questions