React Native 优聊中，工具栏添加图片、相机等额外功能的道具有哪些？我如何实现它？

Question

我是react原生聊天新手。我尝试在聊天工具栏中添加相机、图库等功能。我通读了道具。我认为它是 renderInputToolbar 或 renderComposer。但是该网站没有任何关于如何使用其道具的说明。它只是说明什么是 for 以及您可以传递什么类型。

有人可以解释一下如何使用这些道具吗？非常感谢！

Answer 1

我添加了带有发送按钮的相机按钮，如下所示：

<GiftedChat
  ...
  textInputStyle={styles.composer}
  minComposerHeight={40}
  minInputToolbarHeight={60}
  renderSend={(props) => (
    <View style={{ flexDirection: 'row', alignItems: 'center', height: 60 }}>
      <BtnRound icon="camera" iconColor={Colors.primaryBlue} size={40} style={{ marginHorizontal: 5 }} onPress={() => this.choosePicture()} />
      <Send {...props}>
        <View style={styles.btnSend}>
          <Icon name="ios-send" size={24} color="#ffffff" />
        </View>
      </Send>
    </View>
  )}
  ...
/>

风格

composer:{
  borderRadius: 25, 
  borderWidth: 0.5,
  borderColor: '#dddddd',
  marginTop: 10,
  marginBottom: 10,
  paddingLeft: 10,
  paddingTop: 5,
  paddingBottom: 5,
  paddingRight: 10,
  fontSize: 16
},
btnSend: {
  height: 40,
  width: 40,
  alignItems: 'center',
  justifyContent: 'center',
  marginRight: 10,
  backgroundColor: Colors.primary,
  ...getShadow(),
  borderRadius: 50
}

BtnRound 是简单的自定义 TouchableOpacity 按钮，它使用提供的图标呈现圆形按钮。 BtnRound 代码 here.

React Native 优聊中，工具栏添加图片、相机等额外功能的道具有哪些？我如何实现它？

In react native gifted chat, which props is used for adding extra function like image and camera etc to the tool bar? And how do I achieve it?

react-native

react-native-gifted-chat