20 May 2018 in react-native
Font Shadows in React-Native
A nice effect you can you in react native is text shadows. This works exactly as it does in HTML CSS but the setting names are just a little different.
const styles = StyleSheet.create({
body: {
flex: 1,
backgroundColor: '#555',
},
shadow: {
color: '#fff',
textShadowOffset: { width: 2, height: 2 },
textShadowRadius: 1,
textShadowColor: '#000',
},
});
const Example = ({ children }) => (
<SafeAreaView style={styles.body}>
<Text styles={styles.shadow}>Shadow Text</Text
</SafeAreaView>
);