React Native:带有滚动视图的聊天应用程序的基本功能

问题描述

如果滚动条可用,如何获取scrollView OffsetY。就像在开始时一样,如果渲染了视图并且键盘处于打开或关闭状态。在这种情况下,我需要ScrollView中的Offset值。

我想要一个baisc聊天应用程序,如果我输入聊天内容,则应该在底部显示最新消息。 如果出现键盘,则我应该有相同的视图。

解决方法

profileHeader = () => {
    // you can render your profile view here
    return <View/>;
}

<FlatList
   ref={(c) => { this.flatList = c }}
   data = {this.props.messages}
   keyExtractor={item => item.id}
   inverted={true}
   renderItem = {({item}) => 
    <MessageRow img={item.img}  
    msg = {item.attributes} 
    my_user_id={this.props.my_user_id}/>
   }
   ListHeaderComponent={this.profileHeader} <-- New added -->>
   inverted
/>

参考:https://facebook.github.io/react-native/docs/flatlist#inverted