Merge pull request #5201 from andydotxyz/feature/partialcheck

Add `Partial` mode to `Check` so we can indicate the indeterminate state

Author: andydotxyz

cmd/fyne_demo/tutorials/widget.go

@@ -378,6 +378,8 @@ func makeInputTab(_ fyne.Window) fyne.CanvasObject {
 	dateEntry.PlaceHolder = "Choose a date"
 	disabledCheck := widget.NewCheck("Disabled check", func(bool) {})
 	disabledCheck.Disable()
+	partialCheck := widget.NewCheck("Partial check", func(bool) {})
+	partialCheck.Partial = true
 	checkGroup := widget.NewCheckGroup([]string{"CheckGroup Item 1", "CheckGroup Item 2"}, func(s []string) { fmt.Println("selected", s) })
 	checkGroup.Horizontal = true
 	radio := widget.NewRadioGroup([]string{"Radio Item 1", "Radio Item 2"}, func(s string) { fmt.Println("selected", s) })
@@ -392,10 +394,10 @@ func makeInputTab(_ fyne.Window) fyne.CanvasObject {
 		selectEntry,
 		dateEntry,
 		widget.NewCheck("Check", func(on bool) { fmt.Println("checked", on) }),
-		disabledCheck,
+		partialCheck,
 		checkGroup,
 		radio,
-		disabledRadio,
+		container.NewGridWithColumns(2, disabledCheck, disabledRadio),
 		container.NewBorder(nil, nil, widget.NewLabel("Slider"), nil, widget.NewSlider(0, 1000)),
 		container.NewBorder(nil, nil, widget.NewLabel("Disabled slider"), nil, disabledSlider),
 	)

theme/bundled-icons.go

@@ -99,6 +99,7 @@ func main() {
 	bundleIcon("check-box", f)
 	bundleIcon("check-box-checked", f)
 	bundleIcon("check-box-fill", f)
+	bundleIcon("check-box-partial", f)
 	bundleIcon("radio-button", f)
 	bundleIcon("radio-button-checked", f)
 	bundleIcon("radio-button-fill", f)

theme/gen.go

@@ -56,6 +56,11 @@ const (
 	// Since: 2.5
 	IconNameCheckButtonFill fyne.ThemeIconName = "iconNameCheckButtonFill"
 
+	// IconNameCheckButtonPartial is the name of theme lookup for "partially" checked check button icon.
+	//
+	// Since: 2.6
+	IconNameCheckButtonPartial fyne.ThemeIconName = "partial"
+
 	// IconNameRadioButton is the name of theme lookup for radio button unchecked icon.
 	//
 	// Since: 2.0
@@ -510,6 +515,7 @@ var (
 		IconNameCheckButton:        NewThemedResource(checkboxIconRes),
 		IconNameCheckButtonChecked: NewThemedResource(checkboxcheckedIconRes),
 		IconNameCheckButtonFill:    NewThemedResource(checkboxfillIconRes),
+		IconNameCheckButtonPartial: NewThemedResource(checkboxpartialIconRes),
 		IconNameRadioButton:        NewThemedResource(radiobuttonIconRes),
 		IconNameRadioButtonChecked: NewThemedResource(radiobuttoncheckedIconRes),
 		IconNameRadioButtonFill:    NewThemedResource(radiobuttonfillIconRes),

theme/icons.go

@@ -18,6 +18,13 @@ type Check struct {
 	Text    string
 	Checked bool
 
+	// Partial check is when there is an indeterminate state (usually meaning that child items are some-what checked).
+	// Turning this on will override the checked state and show a dash icon (neither checked nor unchecked).
+	// The user interaction cannot turn this on, tapping a partial check state will set `Checked` to true.
+	//
+	// Since: 2.6
+	Partial bool
+
 	OnChanged func(bool) `json:"-"`
 
 	focused bool
@@ -64,13 +71,15 @@ func (c *Check) Bind(data binding.Bool) {
 }
 
 // SetChecked sets the checked state and refreshes widget
+// If the `Partial` state is set this will be turned off to respect the `checked` bool passed in here.
 func (c *Check) SetChecked(checked bool) {
 	c.propertyLock.Lock()
-	if checked == c.Checked {
+	if checked == c.Checked && !c.Partial {
 		c.propertyLock.Unlock()
 		return
 	}
 
+	c.Partial = false
 	c.Checked = checked
 	onChanged := c.OnChanged
 	c.propertyLock.Unlock()
@@ -350,7 +359,11 @@ func (c *checkRenderer) updateResource(th fyne.Theme) {
 	bgRes := theme.NewThemedResource(th.Icon(theme.IconNameCheckButtonFill))
 	bgRes.ColorName = theme.ColorNameInputBackground
 
-	if c.check.Checked {
+	if c.check.Partial {
+		res = theme.NewThemedResource(th.Icon(theme.IconNameCheckButtonPartial))
+		res.ColorName = theme.ColorNamePrimary
+		bgRes.ColorName = theme.ColorNameBackground
+	} else if c.check.Checked {
 		res = theme.NewThemedResource(th.Icon(theme.IconNameCheckButtonChecked))
 		res.ColorName = theme.ColorNamePrimary
 		bgRes.ColorName = theme.ColorNameBackground
@@ -380,6 +393,10 @@ func (c *checkRenderer) updateFocusIndicator(th fyne.Theme, v fyne.ThemeVariant)
 }
 
 func focusIfNotMobile(w fyne.Widget) {
+	if w == nil {
+		return
+	}
+
 	if !fyne.CurrentDevice().IsMobile() {
 		if c := fyne.CurrentApp().Driver().CanvasForObject(w); c != nil {
 			c.Focus(w.(fyne.Focusable))

theme/icons/check-box-partial.svg

@@ -100,3 +100,23 @@ func TestCheck_SetText(t *testing.T) {
 
 	assert.Equal(t, "New", check.Text)
 }
+
+func TestCheck_Tapped(t *testing.T) {
+	check := &widget.Check{Text: "test"}
+	assert.False(t, check.Checked)
+
+	test.Tap(check)
+	assert.True(t, check.Checked)
+	test.Tap(check)
+	assert.False(t, check.Checked)
+
+	// and test the resetting from partial as well
+	check.Partial = true
+	test.Tap(check)
+	assert.True(t, check.Checked)
+	assert.False(t, check.Partial)
+	test.Tap(check)
+	assert.False(t, check.Checked)
+	assert.False(t, check.Partial)
+
+}