I use the input component from native-base (v2). When a user focuses the input, the value scrolls away. The text cursor also disappears.

InputField.js

const InputField = ({
  style,
  iconStyle,
  labelStyle,
  type,
  value,
  disabled,
  label,
  placeholder,
  onChangeText,
}) => {
  return (
    <Item style={[style]}>
      <Icon style={[iconStyle]} active name={type.icon} type={type.iconType} />
      <Label style={[labelStyle]}>{label}</Label>
      <Content
        contentContainerStyle={{
          flexDirection: "row",
          alignItems: "center",
        }}
      >
        <Input
          value={value}
          disabled={disabled}
          autoCompleteType={type.autoCompleteType}
          autoCorrect={type.autoCorrect}
          autoCapitalize={type.autoCapitalize}
          keyboardType={type.keyboardType}
          onChangeText={onChangeText}
          secureTextEntry={type.secureTextEntry}
          maxLength={type.maxLength}
          placeholder={placeholder}
        />
      </Content>
    </Item>
  );
};

Profile.jsx

<InputField
                style={{ flex: 1, flexDirection: "row" }}
                labelStyle={{ flex: 1 }}
                type={InputFieldTypes.City}
                value={city}
                label={I18n.t("profile.city") + ":"}
                onChangeText={(text) => {
                  setCity(text);
                  setEdit(true);
                }}
              />

The behaviour I'm experiencing. iOs

I have tried giving it more space to see what is going on, but it still scrolls out of view. Android seems fine. Remove padding and margin from input had no effect. Neither did forcing it to only have one line.