react-native-parallax-scroll-view icon indicating copy to clipboard operation
react-native-parallax-scroll-view copied to clipboard

Background does not resize when width change (e.g rotate phone)

Open sadika9 opened this issue 8 years ago • 1 comments

How to auto resize background view/image on width change (when changing between landscape/portrait mode)?

Steps to reproduce (tested only on android):

  • Run listview example on protrait mode.
  • Then rotate phone

sadika9 avatar Jul 14 '16 05:07 sadika9

This cause by the fix width, from Dimension and does not update on orientation change... I did a couple of inheritance class from component that listen to orientation change. I use : var Orientation = require('react-native-orientation-listener');

` constructor(props) { Orientation.getOrientation(function(orientation) { MainOrientation=orientation.orientation; }); console.log("init Height" + height) super(props); this.state = { screenWidth: width, screenHeight: height, orientation: MainOrientation }; }

_setOrientation(data, _this) {
    if(data.orientation == _this.state.orientation) return;
    console.log(data.orientation);
    console.log("Current " + _this.state.screenHeight);

    switch(data.orientation) {
        case "PORTRAIT":
            if(MainOrientation == "PORTRAIT") {
                width = Dimensions.get('window').width
                height = Dimensions.get('window').height
            } else {
                height = Dimensions.get('window').width
                width = Dimensions.get('window').height
            }

            break;
        case "LANDSCAPE":
            if(MainOrientation == "LANDSCAPE") {
                width = Dimensions.get('window').width
                height = Dimensions.get('window').height
            } else {
                height = Dimensions.get('window').width
                width = Dimensions.get('window').height
            }
            break;

    }

    _this.setState({
        screenWidth:width,
        screenHeight:height,
        orientation: data.orientation
    });
    console.log("Updated? " + _this.state.screenHeight);


}
_superComponentDidMount() {
    console.log('Component did mount.')
    var _this = this;
    Orientation.addListener(function(data) {
        _this._setOrientation(data, _this);
    });
}
componentDidMount() {
    this._superComponentDidMount();
}

}`

jatazoulja avatar Sep 09 '16 01:09 jatazoulja