flexbox - 将 View 约束为正方形纵横比

Question

我正在使用react-native 玩iPhone 应用程序，我想要一个 View 来填充屏幕宽度并保持方形纵横比。所以高度应该等于宽度。我似乎无法找到实现这一目标的方法。另一个选项是指定特定的宽度和高度，但我没有看到一种方法可以从 react native 中查询设备宽度以允许我执行此操作。有什么指点吗？

Answer 1

我希望您正在寻找这个...

var Dimensions = require('Dimensions');
var device = Dimensions.get('window');


var styles = StyleSheet.create({
  squareBox: {
    width: device.width,
    height: device.width,
  }
);