Question

当设备方向更改为横向或纵向时，这是处理布局的好方法吗？

const common = {
  container: {
    flex: 1
  }
}

// styles for portait orientation
const portrait = StyleSheets.create({
   container: {
     ...common.container,
     marginBotton: 10
   }
})

// styles for landscape
const landscape = StyleSheets.create({
   container: {
     ...common.container,
     flex: 0.5
   }
})

Answer 1

对于方向问题，您可以使用尺寸，它根据您的屏幕更改样式获取尺寸。

import {  Dimensions } from 'react-native';
const { width, height } = Dimensions.get('window')

class SearchBox extends Component {
 render() {
        return (
            <View style={styles.container}>
              //yous codes here
            </View>
        );
    }
}

const styles = StyleSheet.create({
  container: {
            width: width,
        }
});

对景观进行本地扩展样式的反应

1 个答案: