react native text wrap
<View
style={{ flexDirection: 'row' }}
>
<Text style={{ flexShrink: 1 }}>
Really really long text...
</Text>
</View>
react native text wrap
<View
style={{ flexDirection: 'row' }}
>
<Text style={{ flexShrink: 1 }}>
Really really long text...
</Text>
</View>
color text react native
// Some code....
<Text
// Topic 2: Text Style
style={styles.headline}>Hi, Lunox!
</Text>
// Some code....
headline: {
color: 'white', // <-- The magic
textAlign: 'center', // <-- The magic
fontWeight: 'bold',
fontSize: 50,
backgroundColor: 'purple',
}
// Some code....
Look how I use it here:
https://github.com/Lunox-code/100dayscode-react.native/blob/master/App.js
custom font in react native
create folder in your root directory assets/Fonts and add your custom fonts
you want.
create a file in root folder and called react-native.config.js
Add the following code to the file =>
module.exports = {
project: {
ios: {},
android: {},
},
assets: ['./assets/Fonts']
};
or
module.exports = {
assets: ['./assets/Fonts'],
};
Then, run the following command in your terminal:
react-native link
to use it declare this way in your styles:
fontFamily: 'your-font-name without extension'
If your font is Raleway-Bold.ttf then,
fontFamily: 'Raleway-Bold'
how to link custom fonts in react native
$ react-native link
added font to react native
$ npx react-native link
Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us