frezyx / group_button Goto Github PK

hi
can you add tooltip option for each button?

@Frezyx

Adding an object like:
GroupButtonOptions(TextAlign, Padding, etc...)

This will make easier to add option(s) in the future and make the source code more readable.
So we pass one object throw the classes hierarchy instead of duplicating variable across classes, this will make the maintenance of the library more easy.

Hello,

Finally, I got the solution for. this bug, but trying to make the text fit to my button i got this problem: It is a gap on the top padding, if we put a simetrical padding for vertical, the text will be more to bottom than top.

To fix this i hade to user a custom padding:

As you can see in the picture, I had to put less padding for top.

I'm having problems with the padding now:

You can see here how with short text we have problems on top, leading us to understand, the padding is wrong only on long texts.

Now, when we remove the padding or we make padding same for every, we will get the next problems.

Why does this happen?

Thanks

Please add a read-only properties~~~

When I user isRadio=true I expect the options to be rendered with all button unselected. That would match how radio buttons work in HTML for example.

Right now, the first option is selected. In the example below, button A is selected automatically.

GroupButton(
            isRadio: true,
            spacing: 10,
            onSelected: (index, isSelected) => setState(
                () => choiceSelectionOutput = widget.optionsOutputText[index]),
            buttons: ["A","B", "C"]
        )

Would be great to have an option where the button splash affect can be disabled. Another good feature would be to control the duration of the select animation on the button. Is there a workaround?

Hiya,

Fantastic package, thank you!
One thing it's missing for me is the ability to specify the width of the button border. I've had to use a buttonBuilder to recreate all the other properties of a default GroupButton, but add the border width. Because of this, I lose the InkWell type splash effect.

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

class _GroupButtonBodyState extends State<GroupButtonBody> {
  @override
  void initState() {
    super.initState();

    if (!widget.isRadio) {
      widget.controller.toggleIndexes(widget.selectedButtons ?? []); // <<< has to be selectIndexes
    }

Because the following code is not working properly:

GroupButton(
  selectedButtons: selected,
  controller: GroupButtonController()..selectIndexes(selected),

It's oversimplified example, the point is that you cannot set properly synchronized selectedButtons and controller.

Hi, this is more an enhancement thought than an Issue.
I am using this package in an app that is using Bloc.. Specifically as a piece of a form using flutter_form_bloc.
I ran into an issue where if the state of the selection is changed by bloc, then the widget doesn't update.. In my use case, the form can be loaded from a web query, so the initial sate of the form might be updated externally by bloc.

To solve this for me I added the following to the _GroupButtonBodyState to allow for the widget to update..

  @override
  void didUpdateWidget(Widget OldWidget) {
    for (var i = 0; i < widget.buttons.length; i++) {
      if (widget.selectedButtons!.contains(i)) {
        _selectedIndexes[i] = true;
      } else {
        _selectedIndexes[i] = false;
      }
    }
    setState(() {});
  }

I realize this doesn't cover the radio Button case, but I wasn't using that format for my use case.
I'm still learning Flutter so this may not be the best way to do this.
I'm not sure if this is an enhancement you may want to include in some form, I just thought I'd pass on my use case.
Thanks for the great package.

It would be great to have the api that allows setting selected buttons not by index but with actual buttons values.
For example while using in forms

Also it would be great to have onChange method with selected button values

is there any screen shot?

This is more of a question - but I am placing a GroupButton with two buttons in an Expanded inside of a row, and I expected them to automatically fill out the available width of the Expanded widget but they don't.

How can I do this? I don't want to have to explicitly set the button widths.

for example
wait 5 seconds before the buttons are able to be clicked ( to be clickable ) .

Hello again,

This package is so good, we got used to it and we like to work with it.

We just have a single suggestion for styling:

As you can see, in vertical direction not all buttons are properly centered, it would be great to have them centered by default, or optionally centered.

What do you think?

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!! :)

GroupButton(
spacing: 10.w,
isRadio: true,
buttons: _tabValues,
onSelected: _onTabbarTap,
### selectedButton: _tabbarIndex,
)

setState(() {
_tabbarIndex = index;
});

It's doesn't work!, How can I do?

Add Button background Color on different index

assume if i have 3 button
but i want if index 0 selected
background color green
and index 1 then green

The following code is wrong, because it leads to default GroupButtonController rebuild on every GroupButton.build(), so I have to always pass external GroupButtonController to GroupButton constructor.

return GroupButtonBody(
  ...
  controller: controller ?? GroupButtonController(),
);

The right code should be like this:

class _GroupButtonBodyState extends State<GroupButtonBody> {
  GroupButtonController _controller = widget.controller ?? GroupButtonController();

  @override
  void didUpdateWidget(covariant GroupButtonBody oldWidget) {
    super.didUpdateWidget(oldWidget);
    if (oldWidget.controller != widget.controller) _controller = widget.controller ?? GroupButtonController();  
  }

It would be nice to add disabled buttons functionality similar to existing selectedButtons, like:
disabledButtons: const [2, 3],

Describe the bug
--- xcodebuild: WARNING: Using the first of multiple matching destinations:
{ platform:macOS, arch:arm64, id:00006000-000210183AFA401E }
{ platform:macOS, arch:x86_64, id:00006000-000210183AFA401E }
../../.pub-cache/hosted/pub.flutter-io.cn/group_button-5.3.3/lib/src/group_button_item.dart:92:9: Error: No named parameter with the name 'primary'.
primary: _getBackgroundColor(theme),
^^^^^^^
../../flutter/packages/flutter/lib/src/material/elevated_button.dart:151:22: Context: Found this candidate, but the arguments don't match.
static ButtonStyle styleFrom({
^^^^^^^^^
Target kernel_snapshot failed: Exception

Command PhaseScriptExecution failed with a nonzero exit code
warning: Run script build phase 'Run Script' will be run during every build because it does not specify any outputs. To address this warning, either add output dependencies to the script phase, or configure it to run in every build by unchecking "Based on dependency analysis" in the script phase. (in target 'Flutter Assemble' from project 'Runner')
** BUILD FAILED **

To Reproduce
Steps to reproduce the behavior:
flutter build macos

Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

• OS: macos
• Browser [e.g. chrome, safari]
• Version [e.g. 22]
• flutter doctor
  Doctor summary (to see all details, run flutter doctor -v):
  [✓] Flutter (Channel master, 3.18.0-11.0.pre.74, on macOS 14.2 23C64 darwin-arm64, locale zh-Hans-CN)
  [✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
  [✓] Xcode - develop for iOS and macOS (Xcode 15.0.1)
  [✓] Chrome - develop for the web
  [✓] Android Studio (version 2022.3)
  [✓] VS Code (version 1.82.2)
  [✓] VS Code (version 1.85.0)
  [✓] Connected device (2 available)
  [✓] Network resources

• No issues found!

Smartphone (please complete the following information):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

Additional context
Add any other context about the problem here.

Is there any way to disable elevated effect when long press button

Describe the bug
A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error

Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

• OS: [e.g. iOS]
• Browser [e.g. chrome, safari]
• Version [e.g. 22]

Smartphone (please complete the following information):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

Additional context
Add any other context about the problem here.

i think adding event on disabled items developers may need it (i need it 😸), for exemple if item is disable and user click on it may i need to show a toast message like "This feature is coming soon" or "This feature are availble only for 18+ age"... what do you think ?

So my proposal is, if we can add an boolean option named like 'isRadioCanBeUnselected':

• if it true

the selected radio button can be unselected if it tapped again, so the event onSelected: (index, isSelected) will return isSelected = false if the radio button unselected.
What do you think ?

Flutter Radio Buttons have a Toggleable property, allowing a user to unselect it as required.

I would love it this fantastic lib could support this. Many thanks for any help! :)

selectedBorderColor, unselectedBorderColor are not working. would you check it?

Hi there,

I'm hoping to color code my buttons based on their value, e.g.

Is this possible/is there any example code you can point me to?

Thanks for any help, and for this amazing lib! :)

Após eu ter selecionada uma das opções possíveis, não consegui descobrir como saber QUAL foi o botão selecionado, pois no código exemplo que vc mencionou faltou constar COMO identificar qual opção foi selecionada.

Segue abaixo meu código simples (a pessoa deve informar seu SEXO).

GroupButton(
isRadio: true,
onSelected: (index, isSelected) => print('$index button is selected'),
buttons: ["Sou HOMEM", "Sou MULHER"],
),
),

Após a pessoa ter feita sua escolha, como eu consigo saber em meu aplicativo qual botão foi selecionado? Podes dar-me um exemplo de como seria o código para mostrar qual foi o botão selecionado?

Agradecido... :-D

why remove GroupButton.checkbox

Using this package to build our questionary app we got the next bug:

======== Exception caught by widgets library =======================================================
The following _CastError was thrown building GroupButtonBody(dirty, dependencies: [_InheritedProviderScope<GroupButtonBloc>]):
Null check operator used on a null value

The relevant error-causing widget was: 
  GroupButton file:///home/luisalaguna/Projects/thesis_cancer/lib/features/survey/presentation/widgets/question_widget.dart:67:24
When the exception was thrown, this was the stack: 
#0      GroupButtonBody.build (package:group_button/src/group_button_body.dart:55:23)
#1      StatelessElement.build (package:flutter/src/widgets/framework.dart:4569:28)
#2      ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:4495:15)
#3      Element.rebuild (package:flutter/src/widgets/framework.dart:4189:5)
#4      ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:4474:5)
...

My code is this one:

case QuestionType.BOOL:
        answerWidget = GroupButton(
          buttons: ['Yanlış', 'Doğru'],
          onSelected: (index, isSelected) => print('$index button is selected'),
          direction: Axis.vertical,
        );
        break;

Debugging superficially over this bug we found the next:

It seems in some cases the spacing parameter is required, but it is that in all, to build the widget correctly; adding it to my code make it works correctly.

Hence, We think this parameter would be required or would have a default value.

Thanks.

See the image above. There's a strange barely visible fuzzy border around each button but if I use the widget inspector, that isn't part of the group button.

Currently package has
selectedButton
selectedButtons

also has
_selectedIndexes
_selectedIndex

Consider simplifying the api to be more generic.
In case of isRadio the _selectedIndexes could be limited to only one item - this will simplifies the api and internal logic

Hi ,we cant run without any button selected ?
i need when page load after no selection any buttons

Will be nice to have options with count mentioned per row. Something like this:
options: GroupButtonOptions( groupingType: GroupingType.row, count: 10, ),

Currently we are getting RenderFlex overflowed by pixels on the right error. Would be nice if this lib has this feature.

Thank you for your package, it is amazing, but we got this issue:

Text are so long it is not rendered properly, do you have any idea about to solve it?

Thank you

Hi, thanks for this good alternative that can fulfill our needs.

I'm working on reproduce this questionary application, and I'm using this package as an alternative to grouped_buttons.

I would like to know if it is possible to get the oldschool style for checkbox(box) and radio buttons whit this package.

is there any way to do it with the current state of the package? Does it require a new feature?

Thank you very much.

hi, do you have any plan update this package that allow user can scroll button group list ?

Is there a way to unselect the buttons inside the group button?

I have tried to set the selectedButton to null but it's not working,

Hi, thanks for a great plugin.

I use it in a custom FormBuilderField, and needed a way to initialize selected buttons. It wasn't obvious how to set init values, but eventually I made it by adding GroupButtonController. All worked well until I discovered that deselecting buttons stopped working.

If I remove controller, deselecting works again (but no way to set init values).

Any hints on what can be wrong? Is it a bug or I'm doing something wrong? (maybe there is a way to preselect buttons without controller?)

I'm trying to make a form using this package and Riverpod.

Right now i'm trying to keep the button selected between different groups, but it does not:

As you can see, both different questions can have different values, and they are saved, but when i try to keep each one for each question, both widgets keeps the same selected value:

It seems to keep the same index ever, as if always it would be the same widget, what is we don't want.