键盘感知滚动视图占用屏幕空间

Question

我正在实现React Native Scroll View来处理应用程序布局中的键盘，它效果很好，但它在我的组件下方添加了额外的“填充”或空白。

它已经被设计成flex: 1占据所有屏幕空间。这是jsx代码App.js

    <PaperProvider>
      <StatusBar
        barStyle="dark-content"
        hidden={false}
        backgroundColor="#00BCD4"
        translucent={true}
      />
      <KeyboardAwareScrollView
        style={{ flex: 1 }}
      >
        <View style={styles.container}>
          <UnitCard />
          <UnitCard />
          <Converter />
        </View>
      </KeyboardAwareScrollView>
    </PaperProvider>
  );
};

const styles = StyleSheet.create({
  container: {
    display: "flex",
    flexDirection: "column",
    justifyContent: "center",
    flex: 1,
    backgroundColor: "#eee",
  },
  cards: {
    flex: 1,
    display: "flex",
    flexDirection: "row",
    alignItems: "center",
    justifyContent: "center",
  },
});

Answer 1

对于后来的人来说，contentContainerStyle（而不是样式本身）应该具有 flex: 1 然后它应该可以工作。

  <KeyboardAwareScrollView
    contentContainerStyle={{flex: 1}}
  >