I am trying to give borderRadius to FlatList's contentContainerStyle but after the items are rendered (images), the backgroundColor of contentContainerStyle become transparent. Without borderRadius everything works fine, backgroundColor stays the same (black). I can't explain to myself this behavior. This is happening only on ANDROID, iOS works fine.
This is my FlatList code:
<Animated.FlatList contentInsetAdjustmentBehavior={'never'} overScrollMode="never" scrollEventThrottle={16} onScroll={Animated.event([ { nativeEvent: { contentOffset: {y: this.scrollYAnimatedValue}, }, }, ])} style={[style.verticalList, {flex: 1}]} data={this.state.list} contentContainerStyle={{ paddingBottom: this.props.insets.bottom +125, marginTop: this.props.insets.top + 30, backgroundColor: 'black', flexGrow: 1, borderTopLeftRadius: 15, borderTopRightRadius: 15, overflow: 'hidden', }} ListHeaderComponent={() => this.renderHeader()} renderItem={({item, index, separators}) => this.renderEarlierElement(item, index, separators) } ListEmptyComponent={() => this.listEmptyEarlier()} keyExtractor={(item, index) => item.sender} showsVerticalScrollIndicator={false} />