Sometimes, we want to change the width of the View by text inside with React Native.
In this article, we’ll look at how to change the width of the View by text inside with React Native.
How to change the width of the View by text inside with React Native?
To change the width of the View by text inside with React Native, we can set the alignSelf
property.
For instance, we write:
import * as React from 'react';
import { View, Text, ScrollView, Button } from 'react-native';
import { Card } from 'react-native-paper';
const App = () => {
return (
<View style={{ backgroundColor: 'orange', alignSelf: 'flex-start' }}>
<Text style={{ color: 'blue' }}>hello world</Text>
</View>
);
};
export default App;
to set alignSelf
to 'flex-start'
to make the View
display like a block element in HTML.
Conclusion
To change the width of the View by text inside with React Native, we can set the alignSelf
property.