Skip to content

🐛 The ToggleButton changes size when toggled #610

@robkri

Description

@robkri

Describe the bug
The ToggleButton apparently is larger when checked than when unchecked, thus making the whole layout "wobble":

Fluent_UI_ToogleButton_changes_size_Border_one
Although it's not visible in this screen capture, it also enlargens sideways, making other widgets "wobble" left and right, too.

To Reproduce
View the ToggleButton example in the fluent_ui showcase.

Expected behavior
The ToggleButton doesn't change size regardless of its state.

Additional context
I tried to fix this issue, but I couldn't find the relevant code. I tried fiddeling with the width property of BorderSide in ToggleButtonThemeData in toggle_button.dart and it seems to have something to do with it. But when changing it to zero, the checked button gets smaller than the unchecked button (which kind of makes sense, as the unchecked button has a thin border):

Fluent_UI_ToogleButton_changes_size_Border_zero

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions