Skip to content
Documentation
Dialogs
Colour picker

Colour picker

dialog.ShowColorPicker shows rows of preset colours and greys. Tapping a swatch calls your callback with that colour and closes the dialog. The picker remembers the colours chosen recently and shows them in an extra row the next time.

simple := widget.NewButton("Pick a colour", func() {
	dialog.ShowColorPicker("Colour", "Choose a fill colour", setColour, w)
})

The callback receives a color.Color from the standard image/color package. Cancelling closes the dialog without calling it.

Advanced mode

Set the Advanced field of a ColorPickerDialog to true before you show it. The dialog then adds an expandable Advanced section with a colour wheel, red, green, blue, hue, saturation, lightness and alpha channels, a preview, and a hex entry. A Confirm button delivers the colour you have built.

advanced := widget.NewButton("Pick any colour", func() {
	d := dialog.NewColorPicker("Colour", "Choose a fill colour", setColour, w)
	d.Advanced = true
	d.SetColor(swatch.FillColor) // start from the current colour
	d.Show()
})

SetColor sets the starting colour. It works only in advanced mode; in simple mode it logs an error and does nothing, so set Advanced first.

The complete example 

// The colour picker dialog, in its simple and advanced forms.
package main

import (
	"image/color"

	"github.com/belluikit/bellui"
	"github.com/belluikit/bellui/app"
	"github.com/belluikit/bellui/canvas"
	"github.com/belluikit/bellui/container"
	"github.com/belluikit/bellui/dialog"
	"github.com/belluikit/bellui/geo"
	"github.com/belluikit/bellui/widget"
)

func main() {
	a := app.New()
	w := a.NewWindow("Colour picker")

	swatch := canvas.NewRectangle(color.NRGBA{R: 0x33, G: 0x66, B: 0xcc, A: 0xff})
	swatch.SetMinSize(geo.NewSize(120, 60))
	setColour := func(c color.Color) {
		swatch.FillColor = c
		swatch.Refresh()
	}

	simple := widget.NewButton("Pick a colour", func() {
		dialog.ShowColorPicker("Colour", "Choose a fill colour", setColour, w)
	})

	advanced := widget.NewButton("Pick any colour", func() {
		d := dialog.NewColorPicker("Colour", "Choose a fill colour", setColour, w)
		d.Advanced = true
		d.SetColor(swatch.FillColor) // start from the current colour
		d.Show()
	})

	w.SetContent(container.NewVBox(simple, advanced, swatch))
	bellui.ShowAndRun(w)
}
File and folder dialogsAbout dialog