joejulian/gio
1
0
Fork 1
mirror of https://git.sr.ht/~eliasnaur/gio synced 2026-07-01 07:35:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

op/clip: add RoundRect

Browse Source 
Signed-off-by: Elias Naur <mail@eliasnaur.com>
This commit is contained in:
Elias Naur
2019-11-09 19:20:47 +01:00
parent e864ac3fc3
commit 4f30b985eb
3 changed files with 38 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files
op/clip/clip.go
+24
View File
@@ -289,6 +289,30 @@ func Rect(r image.Rectangle) Op {
return Op{bounds: toRectF(r)}
}
// RoundRect returns the clip area of a rectangle with rounded
// corners defined by their radii. The origin is in the upper left
// corner.
// Specify a square with corner radii equal to half the square size to
// construct a circular clip area.
func RoundRect(ops *op.Ops, r f32.Rectangle, se, sw, nw, ne float32) Op {
size := r.Size()
// https://pomax.github.io/bezierinfo/#circles_cubic.
w, h := float32(size.X), float32(size.Y)
const c = 0.55228475 // 4*(sqrt(2)-1)/3
var p Path
p.Begin(ops)
p.Move(r.Min)
p.Move(f32.Point{X: w, Y: h - se})
p.Cube(f32.Point{X: 0, Y: se * c}, f32.Point{X: -se + se*c, Y: se}, f32.Point{X: -se, Y: se}) // SE
p.Line(f32.Point{X: sw - w + se, Y: 0})
p.Cube(f32.Point{X: -sw * c, Y: 0}, f32.Point{X: -sw, Y: -sw + sw*c}, f32.Point{X: -sw, Y: -sw}) // SW
p.Line(f32.Point{X: 0, Y: nw - h + sw})
p.Cube(f32.Point{X: 0, Y: -nw * c}, f32.Point{X: nw - nw*c, Y: -nw}, f32.Point{X: nw, Y: -nw}) // NW
p.Line(f32.Point{X: w - ne - nw, Y: 0})
p.Cube(f32.Point{X: ne * c, Y: 0}, f32.Point{X: ne, Y: ne - ne*c}, f32.Point{X: ne, Y: ne}) // NE
return p.End()
}
func toRectF(r image.Rectangle) f32.Rectangle {
return f32.Rectangle{
Min: f32.Point{X: float32(r.Min.X), Y: float32(r.Min.Y)},
widget/material/button.go
+14 -9
View File
@@ -10,6 +10,7 @@ import (
"gioui.org/io/pointer"
"gioui.org/layout"
"gioui.org/op"
"gioui.org/op/clip"
"gioui.org/op/paint"
"gioui.org/text"
"gioui.org/unit"
@@ -76,11 +77,13 @@ func (b Button) Layout(gtx *layout.Context, button *widget.Button) {
})
bg := st.Expand(gtx, func() {
rr := float32(gtx.Px(unit.Dp(4)))
rrect(gtx.Ops,
float32(gtx.Constraints.Width.Min),
float32(gtx.Constraints.Height.Min),
clip.RoundRect(gtx.Ops,
f32.Rectangle{Max: f32.Point{
X: float32(gtx.Constraints.Width.Min),
Y: float32(gtx.Constraints.Height.Min),
}},
rr, rr, rr, rr,
)
).Add(gtx.Ops)
fill(gtx, bgcol)
for _, c := range button.History() {
drawInk(gtx, c)
@@ -109,11 +112,10 @@ func (b IconButton) Layout(gtx *layout.Context, button *widget.Button) {
bg := st.Expand(gtx, func() {
size := float32(gtx.Constraints.Width.Min)
rr := float32(size) * .5
rrect(gtx.Ops,
size,
size,
clip.RoundRect(gtx.Ops,
f32.Rectangle{Max: f32.Point{X: size, Y: size}},
rr, rr, rr, rr,
)
).Add(gtx.Ops)
fill(gtx, bgcol)
for _, c := range button.History() {
drawInk(gtx, c)
@@ -152,7 +154,10 @@ func drawInk(gtx *layout.Context, c widget.Click) {
X: -rr,
Y: -rr,
}).Add(gtx.Ops)
rrect(gtx.Ops, float32(size), float32(size), rr, rr, rr, rr)
clip.RoundRect(gtx.Ops, f32.Rectangle{Max: f32.Point{
X: float32(size),
Y: float32(size),
}}, rr, rr, rr, rr).Add(gtx.Ops)
paint.PaintOp{Rect: f32.Rectangle{Max: f32.Point{X: float32(size), Y: float32(size)}}}.Add(gtx.Ops)
stack.Pop()
op.InvalidateOp{}.Add(gtx.Ops)
widget/material/material.go
-19
View File
@@ -9,8 +9,6 @@ import (
"gioui.org/f32"
"gioui.org/font"
"gioui.org/layout"
"gioui.org/op"
"gioui.org/op/clip"
"gioui.org/op/paint"
"gioui.org/text"
"gioui.org/unit"
@@ -75,20 +73,3 @@ func fill(gtx *layout.Context, col color.RGBA) {
paint.PaintOp{Rect: dr}.Add(gtx.Ops)
gtx.Dimensions = layout.Dimensions{Size: d}
}
// https://pomax.github.io/bezierinfo/#circles_cubic.
func rrect(ops *op.Ops, width, height, se, sw, nw, ne float32) {
w, h := float32(width), float32(height)
const c = 0.55228475 // 4*(sqrt(2)-1)/3
var b clip.Path
b.Begin(ops)
b.Move(f32.Point{X: w, Y: h - se})
b.Cube(f32.Point{X: 0, Y: se * c}, f32.Point{X: -se + se*c, Y: se}, f32.Point{X: -se, Y: se}) // SE
b.Line(f32.Point{X: sw - w + se, Y: 0})
b.Cube(f32.Point{X: -sw * c, Y: 0}, f32.Point{X: -sw, Y: -sw + sw*c}, f32.Point{X: -sw, Y: -sw}) // SW
b.Line(f32.Point{X: 0, Y: nw - h + sw})
b.Cube(f32.Point{X: 0, Y: -nw * c}, f32.Point{X: nw - nw*c, Y: -nw}, f32.Point{X: nw, Y: -nw}) // NW
b.Line(f32.Point{X: w - ne - nw, Y: 0})
b.Cube(f32.Point{X: ne * c, Y: 0}, f32.Point{X: ne, Y: ne - ne*c}, f32.Point{X: ne, Y: ne}) // NE
b.End().Add(ops)
}