使用layoutanimation为新消息动画的天赋
我一直在尝试实施一些动画,以通过GiftedChat发送消息,但这给了我很大的问题。
除了此线程外,似乎无法在此上找到任何资源: https://github.com/github.com/faridsafi/faridsafi/faridsafi/reaect-native-native-native-gift--native-gith--gift--native-gifted-gifted--gifted--gifted--gin-聊天/问题/592
目标是让许多其他聊天应用程序(例如Facebook Messenger和WhatsApp)所展示的新消息滑入聊天中。
我当前的实现使用了LayoutAnimation,但我不确定将其放在哪里以确保它没有错误。
当我将“ layoutanimation.configurenext(config)”放在我的使用效果下以何时更新时,它似乎可以在iOS上使用,但是在Android上,它在聊天中留下了空白,并弄乱了布局。 android上的空白,
所以我的解决方案是将其放在onsend下,以便动画只能在时才播放。发送一条消息,但这也会在我的代码中被错误,因为我在键入消息时隐藏了“ ininputtextchanged”设置,以隐藏左动作,并且动画播放用于隐藏左动作而不是新消息。
这是我的代码:
<GiftedChat
...
onInputTextChanged={text => {text != ‘’ ? this.setState({hideActionButtons: true}) :
this.setState({hideActionButtons: false})}}
onSend={messages => {
this._onSend({ type: MESSAGES, messages })
LayoutAnimation.configureNext(config)
}}
...
/>
感谢任何建议,谢谢。
I've been trying to implement some animation for sending messages through GiftedChat but it's giving me quite abit of issues.
Can't seem to find any resources on this except for this thread:
https://github.com/FaridSafi/react-native-gifted-chat/issues/592
The goal is to have the new messages slide into the chat demonstrated by a lot of other chat apps such as facebook messenger and whatsapp.
My current implementation uses layoutAnimation but I'm not sure where to put it to ensure that it's bug free.
When I put "LayoutAnimation.configureNext(config)" under my useEffect for when the messages update, it seems to work on on ios but on android, it leaves a blank space in the chat and messes up the layout.
blank space on android
So my solution was to put it under onSend so that the animation only plays when sending a message, but this is also bugged in my code because I have "onInputTextChanged" setup under GiftedChat to hide the left actions when typing a message and the animation plays for hiding the left actions instead of new messages.
Here's my code:
<GiftedChat
...
onInputTextChanged={text => {text != ‘’ ? this.setState({hideActionButtons: true}) :
this.setState({hideActionButtons: false})}}
onSend={messages => {
this._onSend({ type: MESSAGES, messages })
LayoutAnimation.configureNext(config)
}}
...
/>
Any suggestion is appreciated, thanks.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论