Реагирует на встроенную «интерактивную» клавиатуруDismissMode выдает ошибку при перетаскивании - PullRequest
0 голосов
/ 08 октября 2018

Ошибка: RCTLayoutAnimationGroup expects timings to be in ms, not seconds

Это происходит при быстром перетаскивании клавиатуры вниз.Иногда это случается;иногда это не так.

Я использую простой компонент TextInput в KeyboardAvoidingView

1 Ответ

0 голосов
/ 17 октября 2018

Добавление отказов = {false} в ScrollView, похоже, решает проблему.

<ScrollView keyboardDismissMode="interactive" bounces={false}>

Это также немного меняет поведение, но, похоже, ошибка больше не появляется.

Я думаю, если вы хотите сохранить «оживленное» поведение ScrollViewЛучшим способом было бы сделать «отскоки» зависимыми от клавишного шоу.Когда клавиатура отображается, отскоки устанавливаются в ложь.Посмотрите на мой пример компонента:

export default class App extends Component<Props> {

constructor(){
  super();
  this.state = {
    bounces: true
  }
  this.keyboardDidHideListener = Keyboard.addListener('keyboardDidHide', this._keyboardDidHide.bind(this));
  this.keyboardDidShowListener = Keyboard.addListener('keyboardDidShow', this._keyboardDidShow.bind(this));
}

_keyboardDidShow(){
  this.setState({bounces: false});
}

_keyboardDidHide(){
  this.setState({bounces: true});
}

  render() {
    return (
      <KeyboardAvoidingView style={styles.container}  behavior="padding" enabled>
      <ScrollView keyboardDismissMode="interactive" bounces={this.state.bounces}>
      <TextInput
        style={{height: 40, width: 150, borderColor: 'gray', borderWidth: 1}}
      />
      </ScrollView>

      </KeyboardAvoidingView>
    );
  }
}

РЕДАКТИРОВАТЬ:

Хак RNT будет переопределить продолжительность, когда она меньше, чем 10 (мс).Для вас это должно быть изменено: node_modules / реакции-native / Библиотеки / Компоненты / Клавиатура / KeyboardAvoidingView.js метод: scheduleLayoutAnimation изменить:

const {duration, easing, endCoordinates} = event;

на:

let {duration, easing, endCoordinates} = event;

и добавьте:

if(duration < 10){
    duration = 10;
}

внутри условия if (продолжительность и ускорение) .

Это обеспечит самое короткое времядлительность равна 1 мс и никогда меньше, поэтому длительность больше не будет выбрасываться.

My KeyboardAvoidingView.js , _onKeyboardChange метод выглядит примерно так:

_onKeyboardChange = (event: ?KeyboardEvent) => {
    if (event == null) {
      this.setState({bottom: 0});
      return;
    }

    let {duration, easing, endCoordinates} = event;
    const height = this._relativeKeyboardHeight(endCoordinates);

    if (this.state.bottom === height) {
      return;
    }

    if (duration && easing) {
      if(duration < 10){
        duration = 10;
    }
      LayoutAnimation.configureNext({
        duration: duration,
        update: {
          duration: duration,
          type: LayoutAnimation.Types[easing] || 'keyboard',
        },
      });
    }
    this.setState({bottom: height});
  };

РЕДАКТИРОВАТЬ 2:

Я отправил вопрос в команду RNT и открыл для них PR: https://github.com/facebook/react-native/pull/21858

РЕДАКТИРОВАТЬ3: Исправление было объединено, чтобы отреагировать на родного мастера: https://github.com/facebook/react-native/commit/87b65339379362f9db77ae3f5c9fa8934da34b25

...