react-native-directed-scrollview icon indicating copy to clipboard operation
react-native-directed-scrollview copied to clipboard

Differing view sizes on orientation change

Open dpyeates opened this issue 6 years ago • 0 comments

I'm using your directed scroll view in my app and I have a different layout on portrait than I have on landscape.

Portrait is a 2x3 grid of views (1024x1536px) and landscape is a 3x2 grid of views (1536x1024px)

I am configuring the directed scrollview like this:

<ScrollView
  bounces={true}
  bouncesZoom={true}
  maximumZoomScale={2.0}
  minimumZoomScale={this.state.fitScale}
   showsHorizontalScrollIndicator={true}
   showsVerticalScrollIndicator={true}
   style={styles.container}
   contentContainerStyle={[{
     width: this.state.containerWidth,
     height: this.state.containerHeight,
   }]}>
     <ScrollViewChild scrollDirection={'both'}>
       {this.state.isPortrait ? this._renderPortrait() : this._renderLandscape()}
     </ScrollViewChild>
</ScrollView>

Where this.state.containerWidth and ...Height are dynamically changed depending on orientation.

I am finding that the transition doesn't seem to work very well - the scrollview gets offset and its not possible to pan or zoom to get it back into view.

dpyeates avatar Jul 23 '17 15:07 dpyeates