Элемент не должен выходить за пределы экрана в React Native - PullRequest
Новая
       16

Элемент не должен выходить за пределы экрана в React Native

0 голосов
/ 11 сентября 2018

Привет! Я создаю компонент с плавающей кнопкой действия.Я хочу ограничить движение элемента, чтобы всегда оставаться внутри экрана.Если мы переместим кнопку горизонтально или вертикально, она в какой-то момент выйдет за пределы экрана.Не уверен, как справиться с этим.Пожалуйста, помогите исправить это.Здесь я приложил фрагмент: 

export class ActionComponent extends Component {
    constructor(props) {
      super(props);

      this.state = {
        pan: new Animated.ValueXY(),
       }


      this.panResponder = PanResponder.create({
        onStartShouldSetPanResponder: (evt, gestureState) => true,
        onPanResponderMove           : Animated.event([null,{ 
            dx : this.state.pan.x,
            dy : this.state.pan.y
        }]),
        onPanResponderRelease : (evt, gestureState) => {},
        onMoveShouldSetPanResponder: (e, gestureState) => {
          if (
            Platform.OS == 'android'
            && (gestureState.dx < 2 && gestureState.dx > -2)
            && (gestureState.dy < 2 && gestureState.dy > -2)
          ) {
            return false;
          }
          return true;
        }
      });
    }
   render() {
        return (
          <Animated.View
            {...this.panResponder.panHandlers}
           style={[this.state.pan.getLayout()]}>
              <TouchableHighlight underlayColor='transparent' onPress={()=>this.props.testFunct()}>
                <Image style={{width:60,height:60}}
                  source={require('../images/newImage.png')}
                />
              </TouchableHighlight>
          </Animated.View>
        );
    }
  }
...