Scroll to last index about dash_chat

[Dreamersoul]

you can fix it using the following:
add this in the build method

    WidgetsBinding.instance.addPostFrameCallback(afterBuild);

and use a scrollcontroller like the following:

  void afterBuild(Duration duration) {
    _scrollController.jumpTo(_scrollController.position.maxScrollExtent);
  }

[fayeed]

@Marcosmaliki This is fixed in 1.0.17.

[Marcosmaliki]

I have updated but I can't see any difference. All I want is to display the latest messages first. The current implementation displays old messages then scrolls/jumps to the latest. Reproduce this with a thousand messages to see how ugly it looks.

[Marcosmaliki]

[Dreamersoul]

Hello can you provide an example project? And I'll take a look at it

[Marcosmaliki]

Hello @Dreamersoul thanks!
Reversing the list then reversing the message works alright but the list scrolls to the top when sending a message😆. Ps. I'm not using Firebase

return Scaffold(
      appBar: AppBar(
        title: Text('Messages'),
      ),
      body: FutureBuilder<ApiRes<MessagesRes>>(
        future: NetworkCalls().getMessages(id),
        builder: (context, snapshot) {
          if (snapshot.hasData) {
            if (snapshot.data.error) {
              return Center(child: Text(snapshot.data.errorMsg.toString()));
            } else {
              List<Messages> msgs =
                  List.from(snapshot.data.data.messages);
//                  List.from(snapshot.data.data.messages.reversed);
              var mess;
              messages.clear();
              msgs.forEach((f) {
                user = ChatUser(
                  name: f.name,
                  uid: f.from,
                  avatar: "f.avatar",
                );
                mess = ChatMessage(
                    text: f.message,
                    user: user,
                    createdAt: DateTime.parse(f.createdat)
                        .add(new Duration(hours: 3)));
                messages.add(mess);
              });
              return DashChat(
                messages: messages,
                showUserAvatar: false,
                showAvatarForEveryMessage: false,
                scrollToBottom: false,
                inverted: false,//true
                user: user,
                shouldShowLoadEarlier: false,
                key: _chatViewKey,
                onSend: onSend,
                leading: <Widget>[
                  IconButton(
                    icon: Icon(Icons.attach_file),
                    onPressed: () {
                      print("object");
                    },
                  )
                ],
//                scrollController: _scrollController,
                onLoadEarlier: () {
                  print('loading . . . ');
                },
                onLongPressMessage: (val) {
                  _modalBottomSheet(context);
                },
                inputDecoration:
                    InputDecoration.collapsed(hintText: "Add message here..."),
                dateFormat: DateFormat('dd MMM yyyy'),
                timeFormat: DateFormat.jm(),
                inputMaxLines: 5,
                messageContainerPadding:
                    EdgeInsets.only(left: 5.0, right: 5.0, top: 5),
                alwaysShowSend: false,
                inputTextStyle: TextStyle(fontSize: 16.0),
                inputContainerStyle: BoxDecoration(
                  border: Border.all(width: 0.0, color: Colors.grey),
                  color: Colors.white,
                ),
              );
            }
          } else if (snapshot.hasError) {
            return Center(child: Text(snapshot.error.toString()));
          }
          return Center(child: spinkitSquareCircle);
        },
      ),
    );

[Dreamersoul]

Can I see the onSend method?

[Marcosmaliki]

  void onSend(ChatMessage message) {
    //send to API and MQTT
    print(message.text + 'ID of sending user: $id');
    Map<String, dynamic> data = {'message': message.text, 'to': id};
    sendMessage(data);
    messages.insert(0,
        ChatMessage(text: message.text, createdAt: DateTime.now(), user: user));

    messages = [...messages];
  }

the insert method is a fix to add the message as the start of the array when reversed. My major issue is the scrolling. Check the gif above. The list stutters when scrolling

[Dreamersoul]

i dont seem to know how to fix this, maybe @fayeed can help out!

[lehno]

Same problem here =/

[hangaoke1]

mark, same problem