Sometimes, we want to set the minimum width or height in React Native.
In this article, we’ll look at how to set the minimum width or height in React Native.
How to set the minimum width or height in React Native
To set the minimum width or height in React Native, we can set the minWidth
and minHeight
properties.
For instance, we write:
import * as React from 'react';
import { View, Text } from 'react-native';
import Constants from 'expo-constants';
import AssetExample from './components/AssetExample';
import { Card } from 'react-native-paper';
import dismissKeyboard from 'react-native-dismiss-keyboard';
export default function App() {
return (
<View
style={{
minWidth: '20%',
maxWidth: 500,
minHeight: '10%',
maxHeight: 150,
}}>
<Text>hello world</Text>
</View>
);
}
to set the min width with minWidth
and min height with minHeight
.
We can also set the max width with maxWidth
and max height with maxHeight
.
Conclusion
To set the minimum width or height in React Native, we can set the minWidth
and minHeight
properties.