From f681e5e81a9ff89c7cdb8e98b89efd9d6bcae6a9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Oskar=20Kwa=C5=9Bniewski?= Date: Thu, 12 Dec 2024 10:20:20 +0100 Subject: [PATCH] Fix/translucent with default scroll edge (#191) * fix: translucent with default scroll edge * docs(changeset): fix: make translucent prop work properly with default apperance --- .changeset/curly-snails-crash.md | 5 +++++ .../react-native-bottom-tabs/ios/TabViewImpl.swift | 12 +++++++++--- 2 files changed, 14 insertions(+), 3 deletions(-) create mode 100644 .changeset/curly-snails-crash.md diff --git a/.changeset/curly-snails-crash.md b/.changeset/curly-snails-crash.md new file mode 100644 index 0000000..e676857 --- /dev/null +++ b/.changeset/curly-snails-crash.md @@ -0,0 +1,5 @@ +--- +'react-native-bottom-tabs': patch +--- + +fix: make translucent prop work properly with default apperance diff --git a/packages/react-native-bottom-tabs/ios/TabViewImpl.swift b/packages/react-native-bottom-tabs/ios/TabViewImpl.swift index 0ae05d5..f7f315e 100644 --- a/packages/react-native-bottom-tabs/ios/TabViewImpl.swift +++ b/packages/react-native-bottom-tabs/ios/TabViewImpl.swift @@ -199,7 +199,6 @@ private func configureTransparentAppearance(tabBar: UITabBar, props: TabViewProp private func configureStandardAppearance(tabBar: UITabBar, props: TabViewProps) { let appearance = UITabBarAppearance() - tabBar.isTranslucent = props.translucent // Configure background switch props.scrollEdgeAppearance { @@ -208,8 +207,15 @@ private func configureStandardAppearance(tabBar: UITabBar, props: TabViewProps) default: appearance.configureWithDefaultBackground() } - appearance.backgroundColor = props.barTintColor - + + if props.translucent == false { + appearance.configureWithOpaqueBackground() + } + + if props.barTintColor != nil { + appearance.backgroundColor = props.barTintColor + } + // Configure item appearance let itemAppearance = UITabBarItemAppearance() let fontSize = props.fontSize != nil ? CGFloat(props.fontSize!) : tabBarDefaultFontSize