borderStyle has no effect on Android, border is always solid #18285
Description
Setting borderStyle has no effect on Android. Regardless of the setting, the border will always be solid.
Environment
Environment:
OS: macOS Sierra 10.12.6
Node: 7.10.1
Yarn: 1.2.1
npm: 4.2.0
Watchman: 4.5.0
Xcode: Xcode 9.2 Build version 9C40b
Android Studio: 3.0 AI-171.4443003
Packages: (wanted => installed)
react: 16.2.0 => 16.2.0
react-native: 0.54.0 => 0.54.0
Expected Behavior
When setting the borderStyle to "dashed" or "dotted", I expect the view to have a dashed or dotted border. This works correctly on iOS:
Actual Behavior
Regardless of setting, the border is solid on Android:
Steps to Reproduce
Create a View with styles specifying a borderWidth, borderColor, and borderStyle (borderRadius was also set, since there seem to be existing issues with the border when borderRadius is not specified).
This component will reproduce the issue:
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
export default class App extends React.Component {
render() {
return (
<View style={styles.container}>
<Text>Open up App.js to start working on your app!</Text>
<Text>Changes you make will automatically reload.</Text>
<Text>Shake your phone to open the developer menu.</Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
marginVertical: 200,
marginHorizontal: 20,
borderColor: '#000',
borderRadius: 5,
borderWidth: 5,
borderStyle: 'dashed'
},
});
An Expo Snack is also available that reproduces the issue: https://snack.expo.io/r1NCAukKf