I'm trying to implement a bottomr navigation bar for an app.
I'm using the BottomNavigationView
I was following the explanation from a youtube video step by step yet when getting to that part, when adding the menu in it doesnt even display in the activity main
I have not found an answer to a similar problem anywhere else, and im hoping its something im just missing as codes are almost identical to the explanations
This is my activity main
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout `
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=".MainActivity">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/constraintLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bnv"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#d6ecef"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEndtoEndof="parent"
app:layout_constraintStart_toStartOf="parent"
app:labelVisibilityMode="labeled"
app:menu="#menu/m_1"/>
<androidx.fragment.app.FragmentContainerView
android:id="#+id/fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="409dp"
android:layout_height="673dp"
app:defaultNavHost="true"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintEndtoEndof="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:navGraph="#navigation/my_nav"
tools:ignore="MissingConstraints" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
This is linked from my menu class, which have ids linked to my fragments in a nav graph
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="#+id/firstFragment"
android:icon="#drawable/ic_baseline_home_24"
android:title="Home"></item>
<item
android:id="#+id/secondFragment"
android:icon="#drawable/ic_baseline_directions_bus_24"
android:title="Bus"></item>
<item
android:id="#+id/frag3"
android:icon="#drawable/ic_baseline_settings_24"
android:title="Settings"></item>
</menu>
I struggled with your code for about half an hour. The main problem is choosing a theme.
Change the theme to "Theme.AppCompat.Light.NoActionBar" The problem is solved
Related
<FrameLayout
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#+id/bottomnav">
</FrameLayout>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomnav"
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" />
Whenever i try to add bottom navigation bar the whole activity goes blank
If you would like to display buttons in the Bottom Navigation Bar, you need to add app:menu to BottomNavigationView:
<?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:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<FrameLayout
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#+id/bottomnav">
</FrameLayout>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomnav"
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:menu="#menu/bottom_nav_menu"/>
</androidx.constraintlayout.widget.ConstraintLayout>
Under res/menu, create a bottom_nav_menu.xml:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="#+id/main" android:title="Main" />
<item android:id="#+id/secondary" android:title="Secondary" />
</menu>
Then you should see 2 buttons in your Bottom Navigation Bar.
The above should work fine on a Physical Android Device. If you are not able to preview the Bottom Navigation Bar in Design view of Android Studio, please check if your build.gradle has the following dependency:
implementation 'com.google.android.material:material:1.5.0'
You can either downgrade it to:
implementation 'com.google.android.material:material:1.3.0'
or upgrade it to:
implementation 'com.google.android.material:material:1.6.0'
I am trying to add a bottom navigation menu for the application i am trying to make, I followed every step of the video and the bottom nav menu still not showing up. Can someone help me?
Dashboard 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"
tools:context="Dashboard.Dashboard">
<androidx.fragment.app.FragmentContainerView
android:id="#+id/fragmentContainerView"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
app:defaultNavHost="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:navGraph="#navigation/bottom_nav" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_nav_view"
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:menu="#menu/bottom_nav_menu"/>
</androidx.constraintlayout.widget.ConstraintLayout>
Bottom_Nav_Menu xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="#+id/feedFragment"
android:title="#string/home"
android:icon="#drawable/home_icon"/>
<item
android:id="#+id/searchFragment"
android:title="#string/search"
android:icon="#drawable/search_icon"/>
<item
android:id="#+id/postFragment"
android:title="#string/add"
android:icon="#drawable/add_post"/>
<item
android:id="#+id/notificationFragment"
android:title="#string/notification"
android:icon="#drawable/notification_icon"/>
<item
android:id="#+id/profileFragment"
android:title="#string/profile"
android:icon="#drawable/person_icon"/>
</menu>
never mind, I got it work somehow. Everything was working perfectly. I just needed to add a library before I use the bottom navigation bar.
This library in your build.grandle
implementation 'androidx.navigation:navigation-fragment:2.4.1'
implementation 'androidx.navigation:navigation-ui:2.4.1'
I don't know why fragment is not working. I am creating bottom navigation. My code is here. Please solve my problem.
<?xml version="1.0" encoding="utf-8"?>
<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"
android:id="#+id/draw">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bot_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_navigation_menu" />
This is the fragment part. Please solve my problem. The app is not working.
This is the fragment part. Please solve my problem. The app is not working.
<fragment
android:id="#+id/nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:defaultNavHost="true"
app:layout_constraintBottom_toTopOf="#id/bot_nav_view"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:navGraph="#navigation/bot_navigation"
/>
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
app:layout_constraintTop_toTopOf="parent"
tools:ignore="MissingConstraints">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:fitsSystemWindows="false"
app:popupTheme="#style/AppTheme.AppBarOverlay." />
</com.google.android.material.appbar.AppBarLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
This is the bot_navigation.xml code. Please check it also.
<?xml version="1.0" encoding="utf-8"?>
<navigation 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/bot_navigation"
tools:ignore="UnusedNavigation">
<fragment
android:id="#+id/navigation_feed"
android:name="com.example.reducestress.ui.feed.feed"
android:label="#string/title_feed"
tools:layout="#layout/feed_fragment" />
<fragment
android:id="#+id/navigation_diary"
android:name="com.example.reducestress.ui.diary.diary"
android:label="#string/title_diary"
tools:layout="#layout/diary_fragment" />
<fragment
android:id="#+id/navigation_profile"
android:name="com.example.reducestress.ui.profile.profile"
android:label="#string/title_profile"
tools:layout="#layout/profile_fragment" />
</navigation>
With the new JetPack Navigation, you need to add the fragments you want to show to your NavGraph. You can find your NavGraph under the navigation directory from the res directory. In your case, your NavGraph is bot_navigation.xml.
If you don't see the fragment you want to show, once you are inside your NavGraph, there will be this icon
Click it and you will see a list of the available fragments and activities. Just click the one you want.
If your fragments are already placed, make sure the id's match with the id's in your bottom_navigation_menu.xml. Also, make sure that in your host activity you are setting up the Navigation with the right NavController and with the right BottomNavigationView.
Let me know if it helped.
try to change <fragment to <FrameLayout its work for me when i use FrameLayout
and turn black when i change it to <fragment
You forgot in navigation app: startDestination = "# id / navigation_feed instead of navigation_feed put the fragment that should be launched first and i think you should remove unusedNavigation
The code that should look like:
<?xml version="1.0" encoding="utf-8"?>
<navigation 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/bot_navigation"
app:startDestination="#id/navigation_feed">
...
</navigation>
I've been trying to get a BottonNavigationView working. It just keeps sticking to the top of the layout and it's driving me nuts.
I've looked at Material Design Documentation for BottomNavigationView and it seems really simple, but I can't get it to work, https://material.io/develop/android/components/bottom-navigation/. I even tried making a completely clean project where I tried it and the same thing happened.
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout 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"
android:orientation="vertical"
tools:context=".MainActivity"
android:id="#+id/mainLayout">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomNavigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="start"
app:menu="#menu/bottom_bar_menu" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="#+id/content"
android:enabled="true"
android:icon="#drawable/ic_menu_black_24dp"
android:title="Content"/>
<item
android:id="#+id/document"
android:enabled="true"
android:icon="#drawable/ic_picture_as_pdf_black_24dp"
android:title="Document"/>
<item
android:id="#+id/search"
android:enabled="true"
android:icon="#drawable/ic_search_black_24dp"
android:title="Search"/>
</menu>
Screenshot
Any ideas?
The gravity of your bottom navigation is set to start android:layout_gravity="start" changing it to android:layout_gravity="bottom" should work for you.
I would like to recommend to use ConstraintLayout and set constraints in Designer tool. Will be easier if you are new in android world.
<?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/mainLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomNavigation"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:menu="#menu/bottom_bar_menu" />
</androidx.constraintlayout.widget.ConstraintLayout>
Hi friends please help me out i want to make layouts like first two screens but i am getting layouts like 3,4 screens i had made using the selector.here in the xml i used tabBackground by called selector drawable in it if i can able get the tabBackground in the java code then i can able set it by using the position but i cant able found that please help me out guys
Here is my layout code
<LinearLayout 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"
android:orientation="vertical"
>
<android.support.design.widget.TabLayout
android:id="#+id/icon_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/toolbar_bg"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp"
android:layout_marginTop="10dp"
app:tabBackground="#drawable/tab_background"
app:tabIndicatorColor="#color/transparent"
app:tabGravity="fill"
app:tabMode="fixed" />
<FrameLayout
android:id="#+id/main_fragment"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
My Selector code
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/tab_bg_redcolor" android:state_selected="true"/>
<item android:drawable="#drawable/toolbar_bg"/>
</selector>