Color Pickers extension

Provide color, hue-ring, slide, material, block, and multiple-choice color pickers.

Enable the extension

Add the extension key to ruflet.yaml:

extensions:
  - color_pickers

Run ruflet run during development or ruflet build <target> for a release. Extension packages are compiled into the Ruflet client, so rebuild the client after changing this list.

Ruby DSL example

selected = text(value: "#2563eb")
picker = control(
  "ColorPicker",
  color: "#2563eb",
  enable_alpha: true,
  on_color_change: ->(event) { page.update(selected, value: event.value.to_s) }
)
page.add(column(children: [picker, selected]))

API provided

• Extension key: color_pickers
• Flet package: flet_color_pickers
• Kind: Control family
• Wire controls: ColorPicker, HueRingPicker, SlidePicker, MaterialPicker, BlockPicker, MultipleChoiceBlockPicker

Properties

• available_colors — Sets the available colors property.
• color — Foreground color.
• color_history — Sets the color history property.
• color_model — Sets the color model property.
• color_picker_height — Color picker height.
• color_picker_width — Color picker width.
• colors — Sets the colors property.
• display_thumb_color — Display thumb color.
• enable_alpha — Sets the enable alpha property.
• enable_label — Sets the enable label property.
• hex_input_bar — Sets the hex input bar property.
• hsv_color — Hsv color.
• hue_ring_stroke_width — Hue ring stroke width.
• indicator_alignment_begin — Sets the indicator alignment begin property.
• indicator_border_radius — Indicator border radius.
• indicator_size — Sets the indicator size property.
• label_text_style — Label text style.
• label_types — Sets the label types property.
• palette_type — Sets the palette type property.
• picker_area_border_radius — Picker area border radius.
• picker_area_height_percent — Sets the picker area height percent property.
• portrait_only — Sets the portrait only property.
• show_indicator — Sets the show indicator property.
• show_label — Sets the show label property.
• show_params — Sets the show params property.
• show_slider_text — Show slider text.
• slider_size — Sets the slider size property.
• slider_text_style — Slider text style.

Events

• on_color_change — Fired on color change.
• on_colors_change — Fired on colors change.
• on_history_change — Fired on history change.
• on_hsv_color_change — Fired on hsv color change.
• on_primary_change — Fired on primary change.

Permissions and platforms

No protected service declaration is added automatically. Platform support still follows the underlying Flet extension, so test every target you ship.

Build behavior

Ruflet resolves the extension key to flet_color_pickers and includes that Flet package through the client extension pipeline. Application code uses the Ruby DSL shown above; do not add the package directly to your app's Flutter dependencies.