mirror of
https://git.sr.ht/~eliasnaur/gio
synced 2026-07-01 07:35:40 +00:00
widget/material: add hover to CheckBox
Signed-off-by: Egon Elbre <egonelbre@gmail.com>
This commit is contained in:
@@ -5,10 +5,13 @@ package material
|
||||
import (
|
||||
"image"
|
||||
"image/color"
|
||||
"math"
|
||||
|
||||
"gioui.org/f32"
|
||||
"gioui.org/internal/f32color"
|
||||
"gioui.org/io/pointer"
|
||||
"gioui.org/layout"
|
||||
"gioui.org/op/clip"
|
||||
"gioui.org/op/paint"
|
||||
"gioui.org/text"
|
||||
"gioui.org/unit"
|
||||
@@ -27,7 +30,7 @@ type checkable struct {
|
||||
uncheckedStateIcon *widget.Icon
|
||||
}
|
||||
|
||||
func (c *checkable) layout(gtx layout.Context, checked bool) layout.Dimensions {
|
||||
func (c *checkable) layout(gtx layout.Context, checked, hovered bool) layout.Dimensions {
|
||||
var icon *widget.Icon
|
||||
if checked {
|
||||
icon = c.checkedStateIcon
|
||||
@@ -38,19 +41,39 @@ func (c *checkable) layout(gtx layout.Context, checked bool) layout.Dimensions {
|
||||
min := gtx.Constraints.Min
|
||||
dims := layout.Flex{Alignment: layout.Middle}.Layout(gtx,
|
||||
layout.Rigid(func(gtx layout.Context) layout.Dimensions {
|
||||
return layout.Center.Layout(gtx, func(gtx layout.Context) layout.Dimensions {
|
||||
return layout.UniformInset(unit.Dp(2)).Layout(gtx, func(gtx layout.Context) layout.Dimensions {
|
||||
size := gtx.Px(c.Size)
|
||||
icon.Color = c.IconColor
|
||||
if gtx.Queue == nil {
|
||||
icon.Color = f32color.Disabled(icon.Color)
|
||||
}
|
||||
icon.Layout(gtx, unit.Px(float32(size)))
|
||||
return layout.Dimensions{
|
||||
return layout.Stack{Alignment: layout.Center}.Layout(gtx,
|
||||
layout.Stacked(func(gtx layout.Context) layout.Dimensions {
|
||||
size := gtx.Px(c.Size) * 4 / 3
|
||||
dims := layout.Dimensions{
|
||||
Size: image.Point{X: size, Y: size},
|
||||
}
|
||||
})
|
||||
})
|
||||
if !hovered {
|
||||
return dims
|
||||
}
|
||||
|
||||
background := f32color.MulAlpha(c.IconColor, 70)
|
||||
|
||||
var p clip.Path
|
||||
p.Begin(gtx.Ops)
|
||||
addCircle(&p, float32(size)/2)
|
||||
paint.FillShape(gtx.Ops, background, clip.Outline{Path: p.End()}.Op())
|
||||
|
||||
return dims
|
||||
}),
|
||||
layout.Stacked(func(gtx layout.Context) layout.Dimensions {
|
||||
return layout.UniformInset(unit.Dp(2)).Layout(gtx, func(gtx layout.Context) layout.Dimensions {
|
||||
size := gtx.Px(c.Size)
|
||||
icon.Color = c.IconColor
|
||||
if gtx.Queue == nil {
|
||||
icon.Color = f32color.Disabled(icon.Color)
|
||||
}
|
||||
icon.Layout(gtx, unit.Px(float32(size)))
|
||||
return layout.Dimensions{
|
||||
Size: image.Point{X: size, Y: size},
|
||||
}
|
||||
})
|
||||
}),
|
||||
)
|
||||
}),
|
||||
|
||||
layout.Rigid(func(gtx layout.Context) layout.Dimensions {
|
||||
@@ -66,3 +89,14 @@ func (c *checkable) layout(gtx layout.Context, checked bool) layout.Dimensions {
|
||||
pointer.Rect(image.Rectangle{Max: dims.Size}).Add(gtx.Ops)
|
||||
return dims
|
||||
}
|
||||
|
||||
// addCircle adds the outline of a circle to a path.
|
||||
func addCircle(p *clip.Path, r float32) {
|
||||
// https://pomax.github.io/bezierinfo/#circles_cubic.
|
||||
const c = 4 * (math.Sqrt2 - 1) / 3 // 4*(sqrt(2)-1)/3
|
||||
p.Move(f32.Point{X: 2 * r, Y: 2*r - r})
|
||||
p.Cube(f32.Point{X: 0, Y: r * c}, f32.Point{X: -r + r*c, Y: r}, f32.Point{X: -r, Y: r})
|
||||
p.Cube(f32.Point{X: -r * c, Y: 0}, f32.Point{X: -r, Y: -r + r*c}, f32.Point{X: -r, Y: -r})
|
||||
p.Cube(f32.Point{X: 0, Y: -r * c}, f32.Point{X: r - r*c, Y: -r}, f32.Point{X: r, Y: -r})
|
||||
p.Cube(f32.Point{X: r * c, Y: 0}, f32.Point{X: r, Y: r - r*c}, f32.Point{X: r, Y: r})
|
||||
}
|
||||
|
||||
@@ -31,7 +31,7 @@ func CheckBox(th *Theme, checkBox *widget.Bool, label string) CheckBoxStyle {
|
||||
|
||||
// Layout updates the checkBox and displays it.
|
||||
func (c CheckBoxStyle) Layout(gtx layout.Context) layout.Dimensions {
|
||||
dims := c.layout(gtx, c.CheckBox.Value)
|
||||
dims := c.layout(gtx, c.CheckBox.Value, c.CheckBox.Hovered())
|
||||
gtx.Constraints.Min = dims.Size
|
||||
c.CheckBox.Layout(gtx)
|
||||
return dims
|
||||
|
||||
@@ -36,7 +36,7 @@ func RadioButton(th *Theme, group *widget.Enum, key, label string) RadioButtonSt
|
||||
|
||||
// Layout updates enum and displays the radio button.
|
||||
func (r RadioButtonStyle) Layout(gtx layout.Context) layout.Dimensions {
|
||||
dims := r.layout(gtx, r.Group.Value == r.Key)
|
||||
dims := r.layout(gtx, r.Group.Value == r.Key, false)
|
||||
gtx.Constraints.Min = dims.Size
|
||||
r.Group.Layout(gtx, r.Key)
|
||||
return dims
|
||||
|
||||
Reference in New Issue
Block a user