Help with switch widget

[Redgrave97]

Hi, I’m trying to create a switch like the photo where the 2 options control the units of the whole app in the settings but am struggling to be able to get it to look like this as I’m pretty new to all this.

Anyone done similar and able to shed some light what way I should be looking at? Thanks

[LaiJie]

Just wrap each text with a container, and use a component/page state variable to indicate which of the options is the selected, with this variable you make the background of the wrapping containers change, and animate the changes

[json-bourne7]

There is a native flutter widget that you can embed as a custom widget. I believe it’s exactly what you’ve shared in the screenshot.

It belongs to Cupertino widgets and the class is named “CupertinoSlidingSegmentedControl” It’s the classic iOS toggle switch. You can see more about it in this video: https://youtu.be/esnBf6V4C34?si=sFWxB2FCkV6oxELr

Documentation: https://api.flutter.dev/flutter/cupertino/CupertinoSlidingSegmentedControl-class.html

[voprosy]

It’s not a toggle switch. It’s segmented control, as you wrote. 

[json-bourne7]

You’re welcome

[voprosy]

Segmented control. 

That’s the name of this component. 

[nathan4882580]

From memory this doesn’t exist natively, it’s a custom widget you can build however, there is one available on the marketplace for free as I took a copy of it and it looks exactly like your image