Closed
Description
Description
I need a couple of Views with border radius only on the top or bottom corners, to use as container for TextInputs (its a email/password form).
Reproduction
Using this code:
// style
inputExample: {
borderColor: '#9b9b9b',
backgroundColor: 'white',
borderWidth: 1,
borderStyle: 'solid',
height: 50,
},
inputTop: {
borderTopLeftRadius: 6,
borderTopRightRadius: 6,
borderBottomLeftRadius: 0,
borderBottomRightRadius: 0,
},
inputBottom: {
borderTopLeftRadius: 0,
borderTopRightRadius: 0,
borderBottomLeftRadius: 6,
borderBottomRightRadius: 6,
marginBottom: 60
},
// render
<View style={[style.inputExample, style.inputTop]}>
</View>
<View style={[style.inputExample, style.inputBottom]}>
</View>
The result is as expected, but with artifacts on the corners with radius:0
Solution
Don't know yet
Additional Information
- React Native version: 0.36.1
- Platform: iOS
- Operating System: MacOS