[How to use] 我使用getx库尝试编写会话列表，保持不动，但是没有成功

[seapeak233]

Platforms

dart, Android

Description

设置了 fixedPositionOffset = 2
用getx库来管理状态 final messages = [].obs;
滚动到列表中间，远超过2条，在message insert之前调用 chatObserver.standby(); 没有保持成功
试了一下午了，很没有头绪

My code

// 列表视图渲染

@override
  Widget build(BuildContext context) {
    return Obx(() => ListView.builder(
      physics: ChatObserverClampingScrollPhysics(
        observer: controller.chatObserver,
      ),
      padding: EdgeInsets.only(
          bottom: Get.find<ToolbarController>().robotsBarExpanded.value
              ? 40
              : 0),
      shrinkWrap: true,
      reverse: true,
      controller: controller.scrollController,
      itemBuilder: ((context, index) {
        if (index == controller.messages.length) {
          return MessageLoadMoreWidget(
            hasMore: controller.hasMore.value, // 是否还有更多消息
          );
        } else {
          var message = controller.messages[index];
          var previousTimestamp = index == controller.messages.length - 1
              ? null
              : controller.messages[index + 1].sendTime;
          bool showTime =
          shouldShowTime(message.sendTime, previousTimestamp);
          return Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              if (showTime)
                Center(
                  child: Text(
                    IMUtils.formatTimestamp(message.sendTime!),
                    style: const TextStyle(
                        fontWeight: FontWeight.bold,
                        color: ColorPanel.textSecondaryColor,
                        fontSize: 11),
                  ),
                ),
              buildMessageWidget(controller.messages[index]),
            ],
          );
        }
      }),
      itemCount: controller.messages.length + 1,
    ));
  }

// controller

final messages = <Message>[].obs;
  final hasMore = true.obs;
  final isLoadingMore = false.obs;
  // 是否需要增加未读消息数
  final needIncrementUnreadMsgCount = false.obs;
  // 未读消息数
  final unreadMsgCount = 0.obs;

  final scrollController = ScrollController();
  late ListObserverController observerController;
  late ChatScrollObserver chatObserver;

@override
  void onInit() {
    super.onInit();
    scrollController.addListener(_onScroll);
    observerController = ListObserverController(controller: scrollController)
      ..cacheJumpIndexOffset = false;

    chatObserver = ChatScrollObserver(observerController)
      ..fixedPositionOffset = 2
      ..toRebuildScrollViewCallback = () {
        messages.refresh();
      }
      ..onHandlePositionResultCallback = (result) {
        if (!needIncrementUnreadMsgCount.value) return;
        switch (result.type) {
          case ChatScrollObserverHandlePositionType.keepPosition:
            updateUnreadMsgCount(changeCount: result.changeCount);
            break;
          case ChatScrollObserverHandlePositionType.none:
            updateUnreadMsgCount(isReset: true);
            break;
        }
      };

    ever(Get.find<IMService>().newMessage, onRecvNewMessage);
  }

onRecvNewMessage(Message? message) {
    if (message != null) {
      //过滤掉不是当前群的消息
      if (message.groupID == Get.find<IMService>().groupInfo.value?.groupID) {
        chatObserver.standby();
        messages.insert(0, message);
      }
    }
  }

Try do it

No response

[LinXunFeng]

代码中并没有看到有使用 ListViewObserver 对 listView 进行观察，这个是必要的。

ListViewObserver(
  controller: observerController,
  child: listView,
);

建议跟着 《Flutter - 快速实现聊天会话列表的效果，完美💯》 中的 【三、使用】部分去集成使用

[seapeak233]

感谢