Skip to main content

HueRingPicker

A hue ring color picker that lets users select a hue on a circular ring, with an optional alpha slider.

HueRingPicker
Basic HueRingPicker

Inherits: LayoutControl

Properties

Events

Example​

import flet as ft
from flet_color_pickers import HueRingPicker


def main(page: ft.Page):
    page.title = "HueRingPicker"
    page.padding = 20

    def on_color_change(e: ft.ControlEvent):
        print(f"color: {e.data}")

    picker = HueRingPicker(
        color="#00ff00",
        hue_ring_stroke_width=20,
        picker_area_border_radius=ft.BorderRadius.all(5),
        on_color_change=on_color_change,
    )

    page.add(ft.SafeArea(content=picker))


if __name__ == "__main__":
    ft.run(main)

Properties​

colorclass-attributeinstance-attribute​

color: Optional[ColorValue] = None

The currently selected color.

color_picker_heightclass-attributeinstance-attribute​

color_picker_height: Optional[Number] = None

Height of the color picker in virtual pixels.

enable_alphaclass-attributeinstance-attribute​

enable_alpha: bool = False

Whether to enable alpha (opacity) slider.

hue_ring_stroke_widthclass-attributeinstance-attribute​

hue_ring_stroke_width: Optional[Number] = None

Stroke width for the hue ring.

picker_area_border_radiusclass-attributeinstance-attribute​

picker_area_border_radius: Optional[BorderRadiusValue] = None

Border radius for the picker area.

portrait_onlyclass-attributeinstance-attribute​

portrait_only: bool = False

Whether to force portrait layout.

Events​

on_color_changeclass-attributeinstance-attribute​

on_color_change: Optional[ControlEventHandler[HueRingPicker]] = None

Called when the picker color is changed.

The data property of the event handler argument contains the color value as a hex string.