Filter
Exclude
Time range
-
Near
React Navigation now supports native iOS & Android bottom tabs. If you’re using bottom tabs in a React Native app, you’ve likely used the JS-based version (createBottomTabNavigator). But now there’s an experimental native-backed alternative: createNativeBottomTabNavigator. 𝗪𝗵𝗮𝘁 𝗱𝗼𝗲𝘀 𝘁𝗵𝗮𝘁 𝗺𝗲𝗮𝗻? ➡️ On iOS, it uses UITabBarController ➡️ On Android, it uses BottomNavigationView ➡️ You still write tabs using React components — but under the hood, the UI is rendered using actual native components. 𝗪𝗵𝘆 𝘂𝘀𝗲 𝗶𝘁? ➡️ Better platform fidelity — animations, accessibility, gestures all work as users expect ➡️ No JS rendering of the tab bar = less overhead ➡️ Some built-in behaviors are free: like search tabs turning into native search bars on iOS 16 𝗧𝗵𝗶𝗻𝗴𝘀 𝘁𝗼 𝗻𝗼𝘁𝗲: ➡️ Still marked as 𝗲𝘅𝗽𝗲𝗿𝗶𝗺𝗲𝗻𝘁𝗮𝗹 — APIs may change ➡️ Works on 𝗶𝗢𝗦 𝗮𝗻𝗱 𝗔𝗻𝗱𝗿𝗼𝗶𝗱 𝗼𝗻𝗹𝘆 (no web support) ➡️ Requires 𝗥𝗲𝗮𝗰𝘁 𝗡𝗮𝘁𝗶𝘃𝗲 𝟬.𝟳𝟵 or 𝗘𝘅𝗽𝗼 𝗦𝗗𝗞 𝟱𝟯 if using Expo ➡️ On Android, you’re limited to 5 tabs max (platform constraint) If you're targeting Catalyst/macOS, tvOS, iPadOS (with proper sidebar adaptation), or visionOS, the Callstack react-native-bottom-tabs integration (recommended in the official React Navigation blog) is currently more mature and supports all these platforms out-of-the-box with beautiful native adaptations. Would you switch to native tabs in your RN app? Or do the JS-based ones still give you all the flexibility you need? #ReactNative #ReactNavigation #BottomTabs #MobileDev #iOSDevelopment #AndroidDev #OpenSource #JSI #NativeComponents #Navigation
4
8
91
7,877
Replying to @Zhuinden
Currently adding support on my project despite me not actually liking it. Immediately encountered fragmented behavior using ViewPager2 vs BottomNavigationView for OnApplyWindowInsetsListener, the insets are immediately consumed on ViewPager for Android 5 but not in Android 15.
2
1
2
749
2 Oct 2024
Replying to @Baconbrix
Thanks! BottomNavigationView from Android supports only 6 items so it shows an error 😆 However, on iOS you get the "More" button which is currently not working as lazy loading is not getting any events about entering these views from "more" list but we can fix it
15
1,297
2 Oct 2024
What is the difference between React Native JS Bottom Tabs and Native Bottom Tabs? 👀 Native bottom tabs use native platform primitives to render tabs (TabView from SwiftUI and BottomNavigationView on Android), while JS Tabs recreate this UI as closely as possible. This approach works well but tabs can have different appearances on different platforms, here is an example:
13
13
171
15,833
28 Sep 2024
I got native BottomNavigationView to work! I guess it is time to change the name from SwiftUI TabView 😅 Any ideas?
4
18
568
28 Sep 2024
I’m thinking about either falling back to JS bottom navigation or supporting BottomNavigationView from Android
2
6
616
記事を投稿しました! 【Kotlin練習帳】BottomNavigationViewの裏にViewが埋もれる場合の対処 on #Qiita qiita.com/meowmoto/items/b34…

3
113
9 Jul 2024
ガイドライン的には非推奨だけど一応使えるようにする的なやつかな🤔 [BottomNavigationView] Update max item count to 6 github.com/material-componen…

4
436
22 Jan 2024
基本なのかもしれんけどBottomNavigationViewだけ固定にしといて上を全部Fragmentで遷移するようにして、各Fragmentのひな型を作ってToolbarの動作を各画面で制御とかやるの発想がなかった
2
121
4 Jul 2023
In a long-overdue update, I've added accessibility support similar to BottomNavigationView for the custom regular XML bottom navigation in BottomNavChildFragmentExample (which shows how you can use fragments in fragments, even without Jetpack Navigation). github.com/Zhuinden/BottomNa…

1
8
2,426
5 Nov 2022
気にしたことなかったけど、BottomNavigationViewのアイテムを長押しするとラベルがToastみたいに出るものがある
1
2
※技術向け BottomNavigationViewに紐付けるFragmentの中にRecyclerViewを表示する方法に難儀した。MainでContextをthis@MainActivityと書くところを、this.requireContext()と書く。このクセ。初見殺し。そしてMainに書いていた処理はほぼFragmentに行く。 よくアプリで見る機能だが難しかった。
2
Last week I worked on my project (on android development), Revised previous topics of Dsa and solved LeetCode questions. Today I learnt aboutl BottomNavigationView in #Android . And solved few Dsa questions.
2
Day 4 of #100DaysOfGADS Managed to implement my dashboard UI using BottomNavigationView and fragments....now to see if I can populate it well. #100DaysOfCode #GADS2022 @pluralsight @Andela #Android @growwithgoogle #programming #Android #CodeNewbie

ALT Code Its Fun Code GIF

6
14
12 Jun 2022
Everything about the BottomNavigationbar in Flutter by @Maheshmnj at #ITNEXT. #materialdesign #bottomnavigationview #widget #flutter itnext.io/everything-about-t… (s)

2
記事を投稿しました! BottomNavigationViewの戻る処理について [Android] on #Qiita qiita.com/noboru_i/items/7fa…

2