Bottom Navigation Bar with Fragments - Android Studio Java Tutorial 2023 | Step by Step
HTML-код
- Опубликовано: 30 июл 2024
- Hello Coders!
I'm Surya Pratap Raj, and I'm excited to welcome you back to our Android development journey. In today's video, we're diving into the world of Android app development, focusing on one of the key user interface elements - the Bottom Navigation Bar.
You might wonder why Bottom Navigation Bars are so popular in mobile app design. Well, these nifty user interface elements allow for easy navigation between different sections or pages of your app. Positioned at the bottom of your screen, they make it effortless for users to switch between various features and functionalities.
By the end of this video, you'll have a deeper understanding of how to implement a Bottom Navigation Bar in Android Studio using Java. This is a valuable skill for Android app developers looking to create intuitive and user-friendly apps.
If you found this tutorial helpful, don't forget to hit the like button and subscribe to my channel for more exciting Android development tutorials and tips. Your feedback is invaluable, so feel free to leave any questions or comments in the section below.
Bottom Navigation Bar with Fragments - Android Studio Java Tutorial 2023 | Step by Step
Chapters :
00:00 Intro
00:16 UI Design
01:37 Create Navigation Items
03:27 Import Icons
04:21 Implement Icons into Navigation Items
05:39 Java Code
06:41 Create Fragments
07:45 Fragments Design
08:17 Navigation Item Selected Listener
11:54 Create loadFragment Method
13:30 Resolving Issues
17:05 Run App in Physical Device
#android #androidstudio #java #programming #codewithsurya #ui #tutorial #app 
Наука
i was stuck in this bottom navigation for weeks. you Have finished my job. Thanks❤
Your video explanation is excellent. Keep us updating. Thank you 😊
Wow, this tutorial is amazing! I really appreciate the effort you put into explaining code. Your clear instructions made it easy to follow along. Can't wait for more videos on Android UI design and backend tutorials. Keep up the fantastic work! 👏👍
I appreciate the positive feedback! Thanks! 👍
Your code is working excellent.
Your clear instructions made it easy to learn can you start android full course basic to advance explanation is excellent 👌
sir you are doing a good job. thankyou so much your video helped me.
thanks bro you saved me
I was finding solution from one week, but your video gave me solution. And code is working fine 👌
Glad to hear that!
You are a great teacher. Thumbs Up for you! Keep up good work. You will get thousands of subscribers. 😊
Loved your appreciation, Thankyou so much! 💚
Hello, the video was helpful. I followed the procedure and understood how it works. Is there a way to navigate between the various fragments without losing their data?
thanks bro
Hi, im stucked, can you tell me the logic of instagram: imagine we have an inner fragment inside the main fragment and we swtich to other item bottom navigation, and then come back to the previous item bottom navigation but it has to open the inner fragmnet as it was the last opened fragment(instead of the main fragment), just like the search nav in instagram, we open a post and it has the bottom nav, if we go to profile nav and then come back to search box nav, it opens the last post instead of whole search box!, how can we achieve this behavior?
Actually this video is not helpful, it is the best video on RUclips for beginners, lot's of love sir keep doing well
Thankyou so much for your appreciation, means a lot :)
Hello, is it possible to achieve for the home fragment to have a listView and inside each item of the listView it contains a gridView?
How can I achieve this please? 😅
Yes, it is possible.
I will Create a video for it. Thanks
@@codewithsurya101 yes please 🥹 thank you so muchh ❤️
can you pls give us the source code? Great job!
How to remove the background highlight of the selected tab in the bottom nav bar!
Create a new style with parent "Widget.Material3.BottomNavigationView.ActiveIndicator" and name it as you want.
In this style tag, add the following code :
@color/ _@android:color/transparent_
Now add the following code in your *BottomNavigationView* :
app:itemActiveIndicatorStyle="@style/ _your_style_name_ "
and its done.
Let us know if it worked for you. Thanks
Thank you, brother, it worked! I really appreciate it. You've earned yourself a new subscriber. ❤️
how the other icons doesn't have title visible except home?
Same error
Hello sir I'm having issues that's says default activity not found so what can I do to make the activity start
When are you getting this error?
bro, why all my icons at the navigation bar become notification icon? home, search and profile displayed a same icon as notification
You can change these icons in "bottom_nav_items.xml" file, each item have its own icon and can be changed in "android:icon="@drawable/your_icon..xml" attribute.
у меня также было, просто очисти кэш в file - Invalidate Caches - Invalidate and Restart. проект перезапустится и все нормально будет
5:18 how to make icons colored? In my project it just grey...
Just add this attribute to your BottomNavigationView
app:itemIconTint="_your_color_"
@@codewithsurya101 I tried, on the page where the navbar is shown, everything is colorless (gray)...
how to change the color of background of icon?
*If you wanted to change the selected icon background (not the selected item background) :*
Create a new style with parent "Widget.Material3.BottomNavigationView.ActiveIndicator" and name it as you want.
In this style tag, add the following code :
@color/ _your_color_
Now add the following code in your *BottomNavigationView* :
app:itemActiveIndicatorStyle="@style/ _your_style_name_ "
and its done.
Let us know if it worked for you. Thanks
Aur video dala karo bro
Sure 👍
здравствуйте! благодаря вашему видео я смог сделать эту навигацию, спасибо вам огромное! но есть один недочет, скорее всего из-за моей невнимательности. у меня почему то высоко смещена полоска навигации. сто раз пересмотрел ваш xml код, все равно не могу понять в чем ошибся. можете помочь мне пожалуйста?
Hi, thanks for your appreciation! but I am not getting your flaw completely, I don't understand that what you mean of "NavigationBar set high", can you please elaborate your query?
In case you need to share your screenshots or something else, you can message me to my Instagram : instagram.com/coding.lab_?igsh=a3BxOW0yNzZsYXhu
@@codewithsurya101 написал
I have a issue and I tried my best to spot the issue but it seems whenever I click in nagivation bottom view to go to another fragment, it overlaps the text meaning it overlaps another fragment on to it. I dont know how to fix this
Can you please share your Java code?
@@codewithsurya101 Its the same one I followed your's in this video. Just the fragment's name is different
There is one line of code which I have placed in another method, I have added a note in this video, I think you didn't noticed that note.
That may be causing the issue. Revise the video once again and try.
If it doesn't works, please provide me your java code.
Hello sir give me a Navigation Drawer video
Bro in my code it hasn't shown any fragments.why is that?
Can I see your code?
I watched from start to end though I don't understand what he is saying. Please can u do some in English
You can watch this video with English subtitles.
why is my navigation bar appearing on the top instead of the bottom. Nice video by the way
Please message me on Instagram, I need to see your xml code.
instagram.com/coding.lab_?igshid=OGQ5ZDc2ODk2ZA==
I tried your code and this is what happened. "Attempt to invoke virtual method 'android.view.View com.google.android.material.bottomnavigation.BottomNavigationView.findViewById(int)' on a null object reference" how can i fix this?
Can you please share your Java code where you are getting this error?
Surya Sir I need your contact number, as I am making an android application but I am stucke somewhere. Your videos are very knowledgeable. Please help and reply.
Hlo bro I got an erron in this code please share me your social media account where I can ask solution for the the error.
Sure, I'm on Instagram as @coding.lab_. instagram.com/coding.lab_?igsh=YzljYTk1ODg3Zg==