Search code examples
androidxmlkotlinbottomnavigationviewandroid-bottomnav

KOTLIN - First item in BottomNavigationBar isn't visible, title issues


I have a BottomNavigationBar with 5 items. The first item is the same as the rest, apart from the name and icon. Here is the xml for the bottom_nav menu

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:id="@+id/name_configuration"
        android:title="Name Mech"
        android:icon="@drawable/ic_action_name"
        />

    <item
        android:id="@+id/mech_skills"
        android:title="Skills"
        android:icon="@drawable/ic_action_skills"
        />

    <item
        android:id="@+id/stat_hub"
        android:title="Stat Hub"
        android:icon="@drawable/ic_action_stats"
        />

    <item
        android:id="@+id/mech_weapons"
        android:title="Weapons"
        android:icon="@drawable/ic_action_weapon"
        />

    <item
        android:id="@+id/mech_systems"
        android:title="Systems"
        android:icon="@drawable/ic_action_system"
        />
</menu>

And here is the xml for the drawable I am using for the icons

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:viewportWidth="24"
    android:viewportHeight="24"
    android:tint="#FFFFFF"
    android:alpha="0.8">
    <path
        android:fillColor="#FF000000"
        android:pathData="M3,17.25V21h3.75L17.81,9.94l-3.75,-3.75L3,17.25zM20.71,7.04c0.39,-0.39 0.39,-1.02 0,-1.41l-2.34,-2.34c-0.39,-0.39 -1.02,-0.39 -1.41,0l-1.83,1.83 3.75,3.75 1.83,-1.83z"/>
</vector>

Lastly, here is the xml that I use to for the Bar itself

<com.google.android.material.bottomnavigation.BottomNavigationView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/btm_nav"
        app:layout_constraintBottom_toBottomOf="parent"
        android:background= "@color/colorPrimary"
        app:menu="@menu/bottom_nav"/>

The xml for the rest of the drawables is the exact same (they use different icons but that's not relevant in the xml itself). However, the name_configuration item is invisible in the bottom navigation bar. It behaves the same as the other items when clicked (they pass SharedPreferences values and move to different activities), it is just invisible. However, when other buttons on the bottom navigation bar are pressed, the Name button briefly becomes the right color/transparency before the app goes to the next activity and the Name button becomes invisible again.

Additionally, the title for Name Mech is the only title that appears for any of the buttons in the bottom navigation bar. "Name Mech" appears below the icon in the bottom navigation bar, but "Skills", "StatHub", "Weapons", and "Systems" do not appear under their respective icons in the bottom navigation bar.

Any guidance would be greatly appreciated.


Solution

  • I had the same problem, but now my code works correctly. Try my code:

    In build.gradle(:app):

    dependencies {
        implementation fileTree(dir: 'libs', include: ['*.jar'])
        implementation"org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlin_version"
        implementation 'com.android.support:appcompat-v7:28.0.0'
        implementation 'com.android.support.constraint:constraint-layout:1.1.3'
        testImplementation 'junit:junit:4.12'
        androidTestImplementation 'com.android.support.test:runner:1.0.2'
        androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
        implementation 'com.android.support:design:28.0.0'
    }
    

    In XML:

    <?xml version="1.0" encoding="utf-8"?>
    <androidx.constraintlayout.widget.ConstraintLayout android:layout_height="match_parent"
        android:layout_width="match_parent"
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto">
        <com.google.android.material.bottomnavigation.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="@color/colorPrimary"
            app:itemIconTint="#fff"
            app:itemTextColor="#fff"
            app:menu="@menu/menu"
            app:labelVisibilityMode="unlabeled"/>
    </androidx.constraintlayout.widget.ConstraintLayout>