react-native-gifted-chat 实践指南

• messages(Array) - 消息数组，用于展示消息 有特定的格式

{
  _id: 1, //消息的ID，用于标示，必须唯一
  text: 'My message', //发送的消息
  createdAt: new Date(), //发送的时间
  user: {
    _id: 2, //发送方的ID 如果是自己的ID 则在右边，否则在左边
    name: 'React Native', //发送方的昵称
    avatar: 'https://facebook.github.io/react/img/logo_og.png', //发送方的头像
  },
  image: 'https://facebook.github.io/react/img/logo_og.png',
  //添加你所需要扩展的键值对
}
{
   _id: 1,
   text: 'This is a system message',
   createdAt: new Date(Date.UTC(2016, 5, 11, 17, 20, 0)),
   system: true,
  //添加你所需要扩展的键值对
}

• text(String) - 输入框的默认值；默认是undefined

• placeholder(String) - 输入框的占位字符

• messageIdGenerator(Function) - 为你的新消息自动生成一个id. 默认是用 UUID v4, 由uuid库实现 点击传送门去查看这个库 - uuid

• user(Object) - 配置用户信息

{
   _id: 1, //发送消息需要和配置的id一致
   avatar, //头像 若不设置则不显示
   name, //昵称
}

• onSend(Function) - 点击send时的回调

• locale(String) -本地化日期

• timeFormat(String) - 格式化时间，默认是本地时间，即当前时区的时间

• dateFormat(String) - 日期格式化

• isAnimated(Bool) - 键盘出现时，是否有动画

• loadEarlier(Bool) - 是否显示加载更早的消息按钮 "Load earlier messages"

• onLoadEarlier(Function) - 加载更多消息时的回调

• isLoadingEarlier(Bool) - 点击加载更早的消息时是否出现转菊花的图标

• renderLoading(Function) - 加载页面未加载出来时的页面

• renderLoadEarlier(Function) - 配置 "Load earlier messages" 加载更早消息的按钮

• renderAvatar(Function) - 配置头像，如果设置'null'则头像都不显示

• showUserAvatar(Bool) - 是否展示自己的头像，默认时false 只展示别人的头像

• onPressAvatar(Function(user)) - 点击头像时的回调

• renderAvatarOnTop(Bool) 头像显示在顶部还是底部，默认是底部
  

  这是在底部

这是在顶部

• renderBubble(Function) - 自定义气泡

_renderBubble(props) {
        return (
          
        );
      }

• renderSystemMessage(Function) - 自定义系统消息

• onLongPress(Function(context,message)) - 长按消息气泡时的回调，详细可以看github的演示 showActionSheetWithOptions()

• inverted(Bool) - 反转消息的显示顺序，默认是true 即消息显示的顺序是否和你message数组的顺序相同

• renderMessage(Function) - 自定义消息的内容View

• renderMessageText(Function) - 自定义消息的文本

• renderMessageImage(Function) - 自定义图片消息

• imageProps(Object) - 额外的属性要传递给默认创建的组件rendermessageimage 点去去查看文档

• lightboxProps(Object) - 额外的属性传递给Modal框(体现在点击图片的Modal)
  点击查看第三方 - Lightbox

• renderCustomView(Function) - 在气泡内创建一个自己自定义的视图，即创建自定义的消息

• renderDay(Function) - 自定义消息上方的日期

• renderTime(Function) - 自定义消息中的时间

• renderFooter(Function) - 自定义listView的底部, 例如.'User is typing...'; 点击查看示例 example/App.js

  for an example

• renderChatFooter(Function) - 自定义组件的渲染下messagecontainer（从ListView分开）

• renderInputToolbar(Function) - 自定义你的底部工具栏

• renderComposer(Function) - 自定义textInput输入框

• renderActions(Function) - 自定义输入框左边的按钮

• renderSend(Function) -自定义发送按钮；您可以很容易地将子组件传递给原始组件，例如使用自定义图标。

• renderAccessory(Function) - 在消息编辑器下面的自定义第二行操作

• onPressActionButton\(Function) - 当点击输入框左边的按钮时的回调 (如果设置了 actionSheet将不会执行)

• bottomOffset(Integer) - 从屏幕底部的聊天距离（如显示选项卡栏，则非常有用）

• minInputToolbarHeight(Integer) - 工具栏的最小高度，默认是44

• listViewProps(Object) - 列表的属性，用于扩展你的列表

• textInputProps(Object) - 输入框的属性，用于扩展你的输入框

• keyboardShouldPersistTaps(Enum) - 确定键盘在敲击后是否应该保持可见。一个枚举; 详情见

• onInputTextChanged(Function) - 输入框编辑时的回调

• maxInputLength(Integer) - 输入框输入的最多字符数

以上，会继续修改添加中 欢迎指证。