Question: Horizontal scrolling GroupButton (e.g. for creating "quick search buttons")

[asmith26]

I'm trying to add "quick search buttons" to my flutter app like (in red):

This packages looks great for the button part of this, but I'm struggling to make the GroupButton horizontal scrollable. I can achieve this using a ListView.separated, e.g. (from https://stackoverflow.com/a/71386591/5179470)

ListView.separated(
                itemCount: fruits.length,
                scrollDirection: Axis.horizontal,
                itemBuilder: (context, index) => FilterChip(
                  label: Text(fruits[index]),
                  selected: index == selectedIndex,
                  onSelected: (value) {
                    setState(() {
                      selectedIndex = index;
                    });
                  },
                ),

but I can't seem to get a GroupButton to work with this. This issue looks related: #21 (mentioning @YouSour in case they have got it to work).

Many thanks for any help, and for this amazing lib!! :)

[Frezyx]

Hello @asmith26 !
At this moment, you can't do US using ListView.builder() and the Group Button package.
The only solution I can offer for you - use ListView on top of GroupButton.

Simple example:

ListView(
          scrollDirection: Axis.horizontal,
          children: [
            GroupButton(
              controller: controller,
              options: GroupButtonOptions(
                groupingType: GroupingType.row,
              ),
              isRadio: false,
              buttons: List.generate(25, (i) => '${i + 1}'),
              onSelected: (i, selected) => debugPrint('Button #$i $selected'),
            ),
          ],
        ),

[Frezyx]

2022-03-12.18.33.55.mp4

[asmith26]

Thanks soooooooo much for your help @Frezyx, this works beautifully!!