Issue
After you switch tabs in the BottomTabNavigator, the statusBar cannot be updated
https://snack.expo.dev/@bbbtt04/my-use-of-statusbar-in-bottomtabnavigator-did-not-work
This is an example of running at expo, asking the big guy to help ,I'm really upset
After you switch tabs in the BottomTabNavigator, the statusBar needs to be updated
Solution
StatusBar
updates only at the time of rendering.
So, whenever you switch between tabs you need to re-render your StatusBar
for the backgroundColor
to get updated.
You can do this by using the useIsFocused
hook.
import { useIsFocused } from '@react-navigation/native';
function HomeScreen() {
const isFocused = useIsFocused();
return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
{isFocused ? <StatusBar backgroundColor={'white'} /> : null}
<Text>Home!</Text>
</View>
);
}
Same handling will be done in SettingsScreen()
.
Basically, this will re-render your StatusBar
whenever your selected Tab is in focus. You can read more about useIsFocused()
from here.
Answered By - Vibhor
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.