[Question] How to change selected color of a SegmentedButton?

[Corneille-B]

Question

Hi,
I started a Flet project to discover it and perhaps migrate an existing app from Customtkinter to Flet.
I've created a theme that works, but it doesn't apply to SegmentedButton.
SegmentedButton keep the blue color for selected item, how to modify it?

Code sample

myTheme.py
from ressources import colors
[...]
def createTheme():
        return ft.Theme(
            color_scheme=ft.ColorScheme(
                primary=colors.ORANGE,
                secondary=colors.BLUE,
                background="#2F20AF",
                surface=colors.BLACK5,
                error=colors.RED,
            ),
[...]
example.py
[...]
ft.SegmentedButton(
           width=250,
           selected={"Opt1"},
           segments=[
                ft.Segment(
                   value="Opt1",
                   label=ft.Text("Opt1"),
                                        
                ),
                ft.Segment(
                   value="Opt2",
                   label=ft.Text("Opt2"),
                ),
                      ]
           )
[...]

Error message

No response

------------------------------------------------------

• I have searched for answers to my question both in the issues and in previous discussions.

[ndonkoHenri]

You can set it through the SegmentedButton.style or the Theme.segmented_button_theme props:

import flet as ft


def main(page: ft.Page):
    page.theme_mode = ft.ThemeMode.LIGHT
    # page.theme = page.dark_theme = ft.Theme(
    #     segmented_button_theme=ft.SegmentedButtonTheme(
    #         style=ft.ButtonStyle(...),
    #     )
    # )

    page.add(
        ft.SegmentedButton(
            selected_icon=ft.Icon(ft.Icons.CHECK_SHARP),
            selected=["2"],
            allow_multiple_selection=False,
            segments=[
                ft.Segment(
                    value="1",
                    label=ft.Text("Item One"),
                    icon=ft.Icon(ft.Icons.LOOKS_ONE),
                ),
                ft.Segment(
                    value="2",
                    label=ft.Text("Item Two"),
                    icon=ft.Icon(ft.Icons.LOOKS_TWO),
                ),
            ],
            style=ft.ButtonStyle(
                color={
                    ft.ControlState.DEFAULT: ft.Colors.ERROR,
                    ft.ControlState.HOVERED: ft.Colors.BLUE,
                    ft.ControlState.SELECTED: ft.Colors.GREEN,
                },
            ),
        )
    )


ft.run(main)

I am running this example with the latest pre-release.