旋转屏幕后，宽度和高度不会改变本机

我正在研究一个RN应用程序，我有一个关于屏幕旋转和尺寸的问题。我有一个画廊应用程序，如果屏幕是垂直的，我会连续显示三个图像。我通过将宽度除以图像的大小来调整它，我认为这种指定连续图像数量的方式使得它对于不同的设备来说是一致的和可变的。但是，旋转屏幕后，我期待能够看到更多的图像，但我没有。我意识到宽度没有改变，所以我再次看到三个图像，而不是5或6.我不知道我是这样做的方式是对还是错。任何建议关于这？另外，我如何改变宽度和高度dinamically，以便我可以改变我的画廊对齐后旋转？这里是我的代码的一部分旋转屏幕后，宽度和高度不会改变本机

...var {height, width} = Dimensions.get('window'); 
var imageSize = 120; 
// number : number of images in a row 
var number = Math.round(width/imageSize); 
console.log(number); 
var CameraRollView = React.createClass({ 

propTypes: propTypes, 

getDefaultProps: function(): Object { 
    return { 
     groupTypes: 'SavedPhotos', 
     batchSize: 5, 
     imagesPerRow: number, 
     assetType: 'Photos', 
     renderImage: function(asset) { 
      //var imageSize = 120; 
      var imageStyle = [styles.image, {width: imageSize, height: imageSize}]; 
      return (
       <TouchableHighlight onPress={ 
        ()=>{ 
         /**fire gallery action selectImage*/ 
         this.selectImage(asset.node.image.uri, this.images); 
        } 
       } key={asset.node.image.uri}> 
        <Image 
         source={asset.node.image} 
         style={imageStyle} 
        /> 
       </TouchableHighlight> 
      ); 
     }, 
    }; 
}, 
...

这里有什么重要的是-imagesPerRow-我希望它是动态的，因为我旋转设备。

来源

2017-04-19 cancan

如果您需要响应屏幕尺寸更改，我建议不要使用Dimensions模块。

View组件提供了一个onLayout属性，每次必须重新计算视图的布局（例如，在设备旋转时）时调用该属性。我对你的应用程序的体系结构一无所知，所以我只是说在我看来，最简单的方式就是将它设置为应用程序根View上的一个函数，它将新参数写入状态（或到你的flux/redux商店，如果你使用的话）。

然后，您可以通过您的应用程序传递该信息，并在您认为合适的情况下使用它。

来源

2017-04-20 15:23:56 SoZettaSho

感谢您分享您的意见，生病尝试它希望它有效 – cancan

旋转屏幕后，宽度和高度不会改变本机

回答

相关问题