Как сделать так, чтобы все компоненты были отзывчивыми

Question

import {Dimensions} from 'react-native'

var {height, width} = Dimensions.get('window');

const styles = StyleSheet.create({
  HeddingStyle:{
    fontSize: (width*0.02)
  }
})

Но это не работает должным образом при использовании измерений

Answer 1

Используйте их отдельно, как это:

const SCREEN_WIDTH = Dimensions.get('window').width;
const SCREEN_HEIGHT = Dimensions.get('window').height;

Тогда в ваших стилях вы можете делать такие вещи:

inputContainer: {
  width: SCREEN_WIDTH - 50,
}

Или в вашем случае:

HeddingStyle:{
  fontSize: SCREEN_WIDTH * 0.02,
}