-
Notifications
You must be signed in to change notification settings - Fork 79
Closed
Labels
bugSomething isn't workingSomething isn't working
Description
Before submitting a new issue
- I tested using the latest version of the library, as the bug might be already fixed.
- I tested using a supported version of react native.
- I checked for possible duplicate issues, with possible answers.
Bug summary
Why I try doing a basic non-navigator example, I see an extremely weird empty blob that I can't seem to disable show up on top of the tab bar.
Code:
const [index, setIndex] = useState(0);
const [routes] = useState<TabViewRoute[]>([
{
key: 'home',
title: 'Home',
focusedIcon: { sfSymbol: 'house' },
},
{
key: 'settings',
title: 'Settings',
focusedIcon: { sfSymbol: 'gear' },
},
]);
const renderScene = useCallback<TabViewProps['renderScene']>(({ route, jumpTo }) => {
return <IndexSceneIOS />;
}, []);
return (
<TabView
navigationState={{ index, routes }}
renderScene={renderScene}
onIndexChange={setIndex}
labeled
minimizeBehavior='never'
/>
);
}
What is it, and how can I turn it off?
Library version
1.0.3
Environment info
info Fetching system and libraries information...
System:
OS: macOS 26.1
CPU: (10) arm64 Apple M4
Memory: 170.41 MB / 24.00 GB
Shell:
version: "5.9"
path: /bin/zsh
Binaries:
Node:
version: 24.9.0
path: /opt/homebrew/bin/node
Yarn:
version: 1.22.22
path: /Users/yunyu/.yarn/bin/yarn
npm:
version: 11.6.0
path: /opt/homebrew/bin/npm
Watchman:
version: 2025.11.10.00
path: /opt/homebrew/bin/watchman
Managers:
CocoaPods:
version: 1.16.2
path: /opt/homebrew/bin/pod
SDKs:
iOS SDK:
Platforms:
- DriverKit 25.1
- iOS 26.1
- macOS 26.1
- tvOS 26.1
- visionOS 26.1
- watchOS 26.1
Android SDK:
API Levels:
- "35"
- "36"
Build Tools:
- 35.0.0
- 36.0.0
Android NDK: Not Found
IDEs:
Android Studio: Not Found
Xcode:
version: 26.1.1/17B100
path: /usr/bin/xcodebuild
Languages:
Java:
version: 17.0.17
path: /opt/homebrew/opt/openjdk@17/bin/javac
Ruby:
version: 2.6.10
path: /usr/bin/ruby
npmPackages:
"@react-native-community/cli":
installed: 20.0.2
wanted: ^20.0.2
react:
installed: 19.1.0
wanted: 19.1.0
react-native:
installed: 0.81.5
wanted: 0.81.5
react-native-macos: Not Found
npmGlobalPackages:
"*react-native*": Not Found
Android:
hermesEnabled: true
newArchEnabled: true
iOS:
hermesEnabled: true
newArchEnabled: trueSteps to reproduce
- Follow the basic standalone usage instructions: https://incubator.callstack.com/react-native-bottom-tabs/docs/guides/standalone-usage
- Observe the rendered tab bar
Reproducible sample code
IndexRouteIOS() {
const [index, setIndex] = useState(0);
const [routes] = useState<TabViewRoute[]>([
{
key: 'home',
title: 'Home',
focusedIcon: { sfSymbol: 'house' },
},
{
key: 'settings',
title: 'Settings',
focusedIcon: { sfSymbol: 'gear' },
},
]);
const renderScene = useCallback<TabViewProps['renderScene']>(({ route, jumpTo }) => {
return <IndexSceneIOS />;
}, []);
return (
<TabView
navigationState={{ index, routes }}
renderScene={renderScene}
onIndexChange={setIndex}
labeled
minimizeBehavior='never'
/>
);
}Metadata
Metadata
Assignees
Labels
bugSomething isn't workingSomething isn't working