Test case using react-native-navbar
render() {
return (
<View style={{ flex: 1, backgroundColor: '#DDDDDD' }}>
<NavigationBar
style={{ backgroundColor: '#ABC' }}
title={{ title: 'Home' }}
rightButton={{ title: 'Choose', handler: () => this.actionSheet.show() }}
/>
<ActionSheet
ref={(actionSheet) => { this.actionSheet = actionSheet }}
position="bottom"
onChange={this.onChange}
>
<ActionSheetItem
text="Github"
value="item1"
selectedIcon={checkedIcon}
onPress={this.onItemPress}
/>
<ActionSheetItem
text="Facebook"
value="item2"
selectedIcon={checkedIcon}
onPress={this.onItemPress}
/>
</ActionSheet>
</View>
)
}When selecting an item the first time, there is still some white overlap from the action sheet at the bottom of the view. But subsequent item selections clear it up.
Test case using
react-native-navbarWhen selecting an item the first time, there is still some white overlap from the action sheet at the bottom of the view. But subsequent item selections clear it up.