KeyboardAvoidingView AdjustResize не работает в Android

Question

Я хочу, чтобы кнопка «Далее» не закрывала клавиатуру, когда я ее вижу. Когда я использовал KeyboardAvoidingView, IOS работал нормально. Но это работает как AdjustPan на Android. manifest установлен на AdjustResize.

Как мне заставить его работать на Android?

import React, { Component } from 'react';
import {
  Button, Text, Container, Content, Header, Left, Body, Right, Icon, Input, Form,
} from 'native-base';
import {
  StyleSheet, Dimensions, KeyboardAvoidingView, Platform,
} from 'react-native';


const { height } = Dimensions.get('window');
const titleTopMargin = height / 7.38;
const inputTopMargin = height / 12.3;
const nextButtonTopMargin = height / 6.246;

const styles = StyleSheet.create({
  headerStyle: {
    borderBottomWidth: 0,

  },
  headerViewsLeft: {
    flex: 1,
    justifyContent: 'flex-start',
    alignItems: 'flex-start',
    marginLeft: 23,
  },
  backButtonText: {

    fontSize: 16,
    color: '#666666',
  },
  titleText: {
    marginLeft: 60,

    fontSize: 18,
    color: '#333333',
    marginTop: titleTopMargin,
  },
  inputStyle: {
    marginTop: inputTopMargin,
    marginLeft: 59,
    marginRight: 59,

    color: '#333333',
    fontSize: 16,
    borderBottomWidth: 1,
    borderBottomColor: '#666666',
  },
  nextButton: {
    marginTop: nextButtonTopMargin,
  },
});

class LoginEmailContainer extends Component {
  back = () => {
    const { navigation } = this.props;
    navigation.goBack();
  }


  render() {
    const { back } = this;
    return (
      <Container>
        <Header style={styles.headerStyle}>
          <Left style={styles.headerViewsLeft}>
            <Button iconLeft onPress={() => back()} transparent>
              <Text style={styles.backButtonText}>back</Text>
            </Button>
          </Left>
        </Header>
        <KeyboardAvoidingView
          behavior="padding"
          style={{ flex: 1 }}
        >
          <Content scrollEnabled bounces={false} style={{flex:1}}>

            <Text style={styles.titleText}>email</Text>
            <Form>
              <Input
                placeholder="example@gmail.com"
                placeholderColor="rgba(153, 153, 153, 0.55)"
                style={styles.inputStyle}
              />
            </Form>

            <Button style={styles.nextButton}>
              <Text>Next</Text>
            </Button>

          </Content>
        </KeyboardAvoidingView>
      </Container>
    );
  }
}

export default LoginEmailContainer;

Я пытался null behavior из KeyboardAvoidingView, но это не сработало. Я также пробовал keyboardVerticalOffset до -500, но это тоже не сработало.

https://snack.expo.io/rkXnqiXaV

Закуска моего кода. Это не совсем как мое приложение. Это работает примерно так.

Answer 1

" adjustResize "

Главное окно действия всегда изменяется, чтобы освободить место для мягкого клавиатура на экране.

" adjustPan "

Главное окно действия не изменено, чтобы освободить место для мягкого клавиатура. Скорее, содержимое окна автоматически панорамируется так что текущий фокус никогда не скрывается клавиатурой и пользователями всегда можно увидеть, что они печатают. Это обычно менее желательно чем изменение размера, потому что пользователю может потребоваться закрыть программную клавиатуру, чтобы добраться до невидимых частей окна и взаимодействовать с ними.

Ваше требование будет работать так:

<activity android:windowSoftInputMode="adjustResize"> </activity>

вам нужно добавить это в тег активности и с android:name=".MainActivity"

Answer 2

Документация React Native гласит:

Android может вести себя лучше, когда вообще не работает, а iOS - наоборот.

Я считаю, что для навигации вы используете библиотеку реагирования-навигации.Keyboardavoidingview не учитывает высоту заголовка.Поэтому вам нужно указать высоту заголовка в значении смещения.

keyboardVerticalOffset = {Header.HEIGHT + 20}