grouped_list icon indicating copy to clipboard operation
grouped_list copied to clipboard

GroupedListView not working with getX

Open anasfarooqi opened this issue 3 years ago • 3 comments

Hi, i am trying to use GroupedListView inside Obx, but always gives me an error, "improper use of Getx has been detected".

My Code is GroupedListView<dynamic, String>( elements: menuOptionsController.menuOptions, groupBy: (element) => element['group'], groupSeparatorBuilder: (String groupByValue) => Text(groupByValue), itemBuilder: (context, dynamic element) => ListView.builder( itemCount: element['data'].length, shrinkWrap: true, itemBuilder: (context, index) { print(element); return Text("element['name'][index]"); }, ),

         menuOptionsController is my controller. 
         Anyone has experience this ?     

anasfarooqi avatar Jun 24 '22 07:06 anasfarooqi

Hello @anasfarooqi, can you please provide more information, especially about the menuOptionsController.menuOptions and how you use the Widget. With the current information, I cannot really help.

Dimibe avatar Jun 24 '22 13:06 Dimibe

@anasfarooqi When listening to an observable list from your controller. You don't have to wrap the widget with Obx. Getx automatically listens to changes for list.

SteveOye avatar Jul 22 '22 20:07 SteveOye

Hello, if it's helpful, I have it working as follows. Note: elements: _controller.changeDetails.filteredProducts.toList() .toList() is important to force a rebuild in case there is a change in filteredProducts of type RxList

return Expanded(
      child: Obx(
        () {
          if (_controller.isLoading.value) {
            return const Center(child: CircularProgressIndicator());
          }
          return GroupedListView<RxProduct, String?>(
            keyboardDismissBehavior: ScrollViewKeyboardDismissBehavior.onDrag,
            padding: const EdgeInsets.symmetric(vertical: 0, horizontal: 0),
            elements: _controller.changeDetails.filteredProducts.toList(),
            useStickyGroupSeparators: true,
            groupBy: (rxProduct) => rxProduct.categoryChangeDescription,
            groupSeparatorBuilder: (groupValue) {
              ...
            },
            separator: const Divider(),
            indexedItemBuilder: (context, product, index) {
              ...
            },
          );
        },
      ),
    );

JuanCordovaLazo avatar Jan 17 '24 16:01 JuanCordovaLazo