apps/gophers: update to function scoped layouts

Signed-off-by: Elias Naur <mail@eliasnaur.com>
This commit is contained in:
Elias Naur
2019-09-18 12:22:02 +02:00
parent 29639565cd
commit 1767588028
3 changed files with 138 additions and 148 deletions
+1 -1
View File
@@ -3,7 +3,7 @@ module gioui.org/apps
go 1.13 go 1.13
require ( require (
gioui.org/ui v0.0.0-20190902131729-7ad60e08787b gioui.org/ui v0.0.0-20190918173136-29639565cd34
github.com/google/go-github/v24 v24.0.1 github.com/google/go-github/v24 v24.0.1
golang.org/x/exp v0.0.0-20190627132806-fd42eb6b336f golang.org/x/exp v0.0.0-20190627132806-fd42eb6b336f
golang.org/x/image v0.0.0-20190703141733-d6a02ce849c9 golang.org/x/image v0.0.0-20190703141733-d6a02ce849c9
+2 -2
View File
@@ -1,6 +1,6 @@
cloud.google.com/go v0.34.0/go.mod h1:aQUYkXzVsufM+DwF1aE+0xfcU+56JwCaLick0ClmMTw= cloud.google.com/go v0.34.0/go.mod h1:aQUYkXzVsufM+DwF1aE+0xfcU+56JwCaLick0ClmMTw=
gioui.org/ui v0.0.0-20190902131729-7ad60e08787b h1:Dkmjdmimk3Mtci/vDJNWGAxbD5kyiJyBllWl9DvhEk0= gioui.org/ui v0.0.0-20190918173136-29639565cd34 h1:9JpKtYXvKI4ex6A1b/bsFc5WrOtTybuLZhn0o2Xucis=
gioui.org/ui v0.0.0-20190902131729-7ad60e08787b/go.mod h1:dmqi7kyK1sZ03VAkEqzKKpKWfRPCuqrd1eDtSqyhjzY= gioui.org/ui v0.0.0-20190918173136-29639565cd34/go.mod h1:PssKPKlqVIeyaed+0w492Xc2NgX5M3n6oZKOAj5rxoE=
github.com/BurntSushi/xgb v0.0.0-20160522181843-27f122750802/go.mod h1:IVnqGOEym/WlBOVXweHU+Q+/VP0lqqI8lqeDx9IjBqo= github.com/BurntSushi/xgb v0.0.0-20160522181843-27f122750802/go.mod h1:IVnqGOEym/WlBOVXweHU+Q+/VP0lqqI8lqeDx9IjBqo=
github.com/golang/protobuf v1.2.0 h1:P3YflyNX/ehuJFLhxviNdFxQPkGK5cDcApsge1SqnvM= github.com/golang/protobuf v1.2.0 h1:P3YflyNX/ehuJFLhxviNdFxQPkGK5cDcApsge1SqnvM=
github.com/golang/protobuf v1.2.0/go.mod h1:6lQm79b+lXiMfvg/cZm0SGofjICqVBUtrP5yJMmIC1U= github.com/golang/protobuf v1.2.0/go.mod h1:6lQm79b+lXiMfvg/cZm0SGofjICqVBUtrP5yJMmIC1U=
+135 -145
View File
@@ -187,13 +187,13 @@ func (u *UI) layoutTimings(c ui.Config, q input.Queue, ops *ui.Ops, cs layout.Co
mallocs := mstats.Mallocs - u.lastMallocs mallocs := mstats.Mallocs - u.lastMallocs
u.lastMallocs = mstats.Mallocs u.lastMallocs = mstats.Mallocs
al := layout.Align{Alignment: layout.NE} al := layout.Align{Alignment: layout.NE}
cs = al.Begin(ops, cs) return al.Layout(ops, cs, func(cs layout.Constraints) layout.Dimensions {
in := layout.Inset{Top: ui.Dp(16)} in := layout.Inset{Top: ui.Dp(16)}
cs = in.Begin(c, ops, cs) return in.Layout(c, ops, cs, func(cs layout.Constraints) layout.Dimensions {
txt := fmt.Sprintf("m: %d %s", mallocs, u.profile.Timings) txt := fmt.Sprintf("m: %d %s", mallocs, u.profile.Timings)
dims := text.Label{Material: theme.text, Face: u.face(fonts.mono, 10), Text: txt}.Layout(ops, cs) return text.Label{Material: theme.text, Face: u.face(fonts.mono, 10), Text: txt}.Layout(ops, cs)
dims = in.End(dims) })
return al.End(dims) })
} }
func (u *UI) Layout(c ui.Config, q input.Queue, ops *ui.Ops, cs layout.Constraints) layout.Dimensions { func (u *UI) Layout(c ui.Config, q input.Queue, ops *ui.Ops, cs layout.Constraints) layout.Dimensions {
@@ -231,10 +231,9 @@ func (up *userPage) Layout(c ui.Config, q input.Queue, ops *ui.Ops, cs layout.Co
if l.Dragging() { if l.Dragging() {
key.HideInputOp{}.Add(ops) key.HideInputOp{}.Add(ops)
} }
for l.Init(c, q, ops, cs, len(up.commits)); l.More(); l.Next() { return l.Layout(c, q, ops, cs, len(up.commits), func(cs layout.Constraints, i int) layout.Dimensions {
l.End(up.commit(c, ops, l.Constraints(), l.Index())) return up.commit(c, ops, cs, i)
} })
return l.Layout()
} }
func (up *userPage) commit(c ui.Config, ops *ui.Ops, cs layout.Constraints, index int) layout.Dimensions { func (up *userPage) commit(c ui.Config, ops *ui.Ops, cs layout.Constraints, index int) layout.Dimensions {
@@ -242,97 +241,98 @@ func (up *userPage) commit(c ui.Config, ops *ui.Ops, cs layout.Constraints, inde
msg := up.commits[index].GetMessage() msg := up.commits[index].GetMessage()
label := text.Label{Material: theme.text, Face: up.faces.For(fonts.regular, ui.Sp(12)), Text: msg} label := text.Label{Material: theme.text, Face: up.faces.For(fonts.regular, ui.Sp(12)), Text: msg}
in := layout.Inset{Top: ui.Dp(16), Right: ui.Dp(8), Left: ui.Dp(8)} in := layout.Inset{Top: ui.Dp(16), Right: ui.Dp(8), Left: ui.Dp(8)}
cs = in.Begin(c, ops, cs) return in.Layout(c, ops, cs, func(cs layout.Constraints) layout.Dimensions {
f := (&layout.Flex{Axis: layout.Horizontal}).Init(ops, cs) f := (&layout.Flex{Axis: layout.Horizontal}).Init(ops, cs)
cs = f.Rigid() c1 := f.Rigid(func(cs layout.Constraints) layout.Dimensions {
sz := c.Px(ui.Dp(48)) sz := c.Px(ui.Dp(48))
cc := clipCircle{} cc := clipCircle{}
cs = cc.Begin(ops, cs) return cc.Layout(ops, cs, func(cs layout.Constraints) layout.Dimensions {
cs = layout.RigidConstraints(cs.Constrain(image.Point{X: sz, Y: sz})) cs = layout.RigidConstraints(cs.Constrain(image.Point{X: sz, Y: sz}))
dims := widget.Image{Src: u.avatar, Rect: u.avatar.Bounds()}.Layout(c, ops, cs) return widget.Image{Src: u.avatar, Rect: u.avatar.Bounds()}.Layout(c, ops, cs)
dims = cc.End(dims) })
c1 := f.End(dims) })
cs = f.Flexible(1) c2 := f.Flexible(1, func(cs layout.Constraints) layout.Dimensions {
cs.Width.Min = cs.Width.Max cs.Width.Min = cs.Width.Max
in2 := layout.Inset{Left: ui.Dp(8)} in := layout.Inset{Left: ui.Dp(8)}
cs = in2.Begin(c, ops, cs) return in.Layout(c, ops, cs, func(cs layout.Constraints) layout.Dimensions {
dims = label.Layout(ops, cs) return label.Layout(ops, cs)
dims = in2.End(dims) })
c2 := f.End(dims) })
dims = f.Layout(c1, c2) return f.Layout(c1, c2)
return in.End(dims) })
} }
func (u *UI) layoutUsers(c ui.Config, q input.Queue, ops *ui.Ops, cs layout.Constraints) layout.Dimensions { func (u *UI) layoutUsers(c ui.Config, q input.Queue, ops *ui.Ops, cs layout.Constraints) layout.Dimensions {
st := (&layout.Stack{}).Init(ops, cs) st := (&layout.Stack{}).Init(ops, cs)
cs = st.Rigid() c2 := st.Rigid(func(cs layout.Constraints) layout.Dimensions {
al := layout.Align{Alignment: layout.SE} al := layout.Align{Alignment: layout.SE}
in := layout.UniformInset(ui.Dp(16)) return al.Layout(ops, cs, func(cs layout.Constraints) layout.Dimensions {
cs = in.Begin(c, ops, al.Begin(ops, cs)) in := layout.UniformInset(ui.Dp(16))
dims := u.fab.Layout(c, q, ops, cs) return in.Layout(c, ops, cs, func(cs layout.Constraints) layout.Dimensions {
dims = al.End(in.End(dims)) return u.fab.Layout(c, q, ops, cs)
c2 := st.End(dims) })
})
})
cs = st.Expand() c1 := st.Expand(func(cs layout.Constraints) layout.Dimensions {
{
f := (&layout.Flex{Axis: layout.Vertical}).Init(ops, cs) f := (&layout.Flex{Axis: layout.Vertical}).Init(ops, cs)
cs = f.Rigid() c1 := f.Rigid(func(cs layout.Constraints) layout.Dimensions {
{
cs.Width.Min = cs.Width.Max cs.Width.Min = cs.Width.Max
in := layout.UniformInset(ui.Dp(16)) in := layout.UniformInset(ui.Dp(16))
sz := c.Px(ui.Dp(200)) return in.Layout(c, ops, cs, func(cs layout.Constraints) layout.Dimensions {
cs = layout.RigidConstraints(cs.Constrain(image.Point{X: sz, Y: sz})) sz := c.Px(ui.Dp(200))
dims = u.edit.Layout(c, q, ops, in.Begin(c, ops, cs)) cs = layout.RigidConstraints(cs.Constrain(image.Point{X: sz, Y: sz}))
dims = in.End(dims) return u.edit.Layout(c, q, ops, cs)
} })
c1 := f.End(dims) })
cs = f.Rigid() c2 := f.Rigid(func(cs layout.Constraints) layout.Dimensions {
{
cs.Width.Min = cs.Width.Max cs.Width.Min = cs.Width.Max
in := layout.Inset{Bottom: ui.Dp(16), Left: ui.Dp(16), Right: ui.Dp(16)} in := layout.Inset{Bottom: ui.Dp(16), Left: ui.Dp(16), Right: ui.Dp(16)}
dims = u.edit2.Layout(c, q, ops, in.Begin(c, ops, cs)) return in.Layout(c, ops, cs, func(cs layout.Constraints) layout.Dimensions {
dims = in.End(dims) return u.edit2.Layout(c, q, ops, cs)
} })
c2 := f.End(dims) })
cs = f.Rigid() c3 := f.Rigid(func(cs layout.Constraints) layout.Dimensions {
{
cs.Width.Min = cs.Width.Max cs.Width.Min = cs.Width.Max
s := layout.Stack{Alignment: layout.Center} s := layout.Stack{Alignment: layout.Center}
s.Init(ops, cs) s.Init(ops, cs)
cs = s.Rigid() c2 := s.Rigid(func(cs layout.Constraints) layout.Dimensions {
in := layout.Inset{Top: ui.Dp(16), Right: ui.Dp(8), Bottom: ui.Dp(8), Left: ui.Dp(8)} grey := colorMaterial(ops, rgb(0x888888))
grey := colorMaterial(ops, rgb(0x888888)) in := layout.Inset{Top: ui.Dp(16), Right: ui.Dp(8), Bottom: ui.Dp(8), Left: ui.Dp(8)}
lbl := text.Label{Material: grey, Face: u.face(fonts.regular, 11), Text: "GOPHERS"} return in.Layout(c, ops, cs, func(cs layout.Constraints) layout.Dimensions {
dims = in.End(lbl.Layout(ops, in.Begin(c, ops, cs))) lbl := text.Label{Material: grey, Face: u.face(fonts.regular, 11), Text: "GOPHERS"}
c2 := s.End(dims) return lbl.Layout(ops, cs)
c1 := s.End(fill{colorMaterial(ops, rgb(0xf2f2f2))}.Layout(ops, s.Expand())) })
dims = s.Layout(c1, c2) })
} c1 := s.Expand(func(cs layout.Constraints) layout.Dimensions {
c3 := f.End(dims) return fill{colorMaterial(ops, rgb(0xf2f2f2))}.Layout(ops, cs)
})
return s.Layout(c1, c2)
})
cs = f.Flexible(1) c4 := f.Flexible(1, func(cs layout.Constraints) layout.Dimensions {
cs.Width.Min = cs.Width.Max cs.Width.Min = cs.Width.Max
dims = u.layoutContributors(c, q, ops, cs) return u.layoutContributors(c, q, ops, cs)
c4 := f.End(dims) })
dims = f.Layout(c1, c2, c3, c4) return f.Layout(c1, c2, c3, c4)
} })
c1 := st.End(dims)
return st.Layout(c1, c2) return st.Layout(c1, c2)
} }
func (a *ActionButton) Layout(c ui.Config, q input.Queue, ops *ui.Ops, cs layout.Constraints) layout.Dimensions { func (a *ActionButton) Layout(c ui.Config, q input.Queue, ops *ui.Ops, cs layout.Constraints) layout.Dimensions {
f := layout.Flex{Axis: layout.Vertical, Alignment: layout.End} f := layout.Flex{Axis: layout.Vertical, Alignment: layout.End}
f.Init(ops, cs) f.Init(ops, cs)
cs = f.Rigid() return f.Layout(f.Rigid(func(cs layout.Constraints) layout.Dimensions {
in := layout.Inset{Top: ui.Dp(4)} in := layout.Inset{Top: ui.Dp(4)}
cs = in.Begin(c, ops, cs) return in.Layout(c, ops, cs, func(cs layout.Constraints) layout.Dimensions {
dims := fab(ops, a.sendIco.image(c), theme.brand, c.Px(ui.Dp(56))) dims := fab(ops, a.sendIco.image(c), theme.brand, c.Px(ui.Dp(56)))
pointer.EllipseAreaOp{Rect: image.Rectangle{Max: dims.Size}}.Add(ops) pointer.EllipseAreaOp{Rect: image.Rectangle{Max: dims.Size}}.Add(ops)
dims = in.End(dims) return dims
return f.Layout(f.End(dims)) })
}))
} }
func (u *UI) layoutContributors(c ui.Config, q input.Queue, ops *ui.Ops, cs layout.Constraints) layout.Dimensions { func (u *UI) layoutContributors(c ui.Config, q input.Queue, ops *ui.Ops, cs layout.Constraints) layout.Dimensions {
@@ -340,72 +340,68 @@ func (u *UI) layoutContributors(c ui.Config, q input.Queue, ops *ui.Ops, cs layo
if l.Dragging() { if l.Dragging() {
key.HideInputOp{}.Add(ops) key.HideInputOp{}.Add(ops)
} }
for l.Init(c, q, ops, cs, len(u.users)); l.More(); l.Next() { return l.Layout(c, q, ops, cs, len(u.users), func(cs layout.Constraints, i int) layout.Dimensions {
l.End(u.user(c, ops, l.Constraints(), l.Index())) return u.user(c, ops, cs, i)
} })
return l.Layout()
} }
func (u *UI) user(c ui.Config, ops *ui.Ops, cs layout.Constraints, index int) layout.Dimensions { func (u *UI) user(c ui.Config, ops *ui.Ops, cs layout.Constraints, index int) layout.Dimensions {
user := u.users[index] user := u.users[index]
elem := layout.Flex{Axis: layout.Vertical} elem := layout.Flex{Axis: layout.Vertical}
elem.Init(ops, cs) elem.Init(ops, cs)
cs = elem.Rigid() c1 := elem.Rigid(func(cs layout.Constraints) layout.Dimensions {
var dims layout.Dimensions
{
in := layout.UniformInset(ui.Dp(8)) in := layout.UniformInset(ui.Dp(8))
cs = in.Begin(c, ops, cs) dims := in.Layout(c, ops, cs, func(cs layout.Constraints) layout.Dimensions {
f := centerRowOpts() f := centerRowOpts()
f.Init(ops, cs)
cs = f.Rigid()
{
in := layout.Inset{Right: ui.Dp(8)}
cc := clipCircle{}
cs = cc.Begin(ops, in.Begin(c, ops, cs))
sz := image.Point{X: c.Px(ui.Dp(48)), Y: c.Px(ui.Dp(48))}
cs = layout.RigidConstraints(cs.Constrain(sz))
dims = widget.Image{Src: user.avatar, Rect: user.avatar.Bounds()}.Layout(c, ops, cs)
dims = in.End(cc.End(dims))
}
c1 := f.End(dims)
cs = f.Rigid()
{
f := column()
f.Init(ops, cs) f.Init(ops, cs)
cs = f.Rigid() c1 := f.Rigid(func(cs layout.Constraints) layout.Dimensions {
{ in := layout.Inset{Right: ui.Dp(8)}
f := baseline() cc := clipCircle{}
return in.Layout(c, ops, cs, func(cs layout.Constraints) layout.Dimensions {
return cc.Layout(ops, cs, func(cs layout.Constraints) layout.Dimensions {
sz := image.Point{X: c.Px(ui.Dp(48)), Y: c.Px(ui.Dp(48))}
cs = layout.RigidConstraints(cs.Constrain(sz))
return widget.Image{Src: user.avatar, Rect: user.avatar.Bounds()}.Layout(c, ops, cs)
})
})
})
c2 := f.Rigid(func(cs layout.Constraints) layout.Dimensions {
f := column()
f.Init(ops, cs) f.Init(ops, cs)
cs = f.Rigid() c1 := f.Rigid(func(cs layout.Constraints) layout.Dimensions {
dims = text.Label{Material: theme.text, Face: u.face(fonts.regular, 13), Text: user.name}.Layout(ops, cs) f := baseline()
c1 := f.End(dims) f.Init(ops, cs)
cs = f.Flexible(1) c1 := f.Rigid(func(cs layout.Constraints) layout.Dimensions {
cs.Width.Min = cs.Width.Max return text.Label{Material: theme.text, Face: u.face(fonts.regular, 13), Text: user.name}.Layout(ops, cs)
al := layout.Align{Alignment: layout.E} })
in := layout.Inset{Left: ui.Dp(2)} c2 := f.Flexible(1, func(cs layout.Constraints) layout.Dimensions {
cs = in.Begin(c, ops, al.Begin(ops, cs)) cs.Width.Min = cs.Width.Max
dims = text.Label{Material: theme.text, Face: u.face(fonts.regular, 10), Text: "3 hours ago"}.Layout(ops, cs) al := layout.Align{Alignment: layout.E}
dims = al.End(in.End(dims)) return al.Layout(ops, cs, func(cs layout.Constraints) layout.Dimensions {
c2 := f.End(dims) in := layout.Inset{Left: ui.Dp(2)}
dims = f.Layout(c1, c2) return in.Layout(c, ops, cs, func(cs layout.Constraints) layout.Dimensions {
} lbl := text.Label{Material: theme.text, Face: u.face(fonts.regular, 10), Text: "3 hours ago"}
c1 := f.End(dims) return lbl.Layout(ops, cs)
cs = f.Rigid() })
in := layout.Inset{Top: ui.Dp(4)} })
cs = in.Begin(c, ops, cs) })
dims = text.Label{Material: theme.tertText, Face: u.face(fonts.regular, 12), Text: user.company}.Layout(ops, cs) return f.Layout(c1, c2)
dims = in.End(dims) })
c2 := f.End(dims) c2 := f.Rigid(func(cs layout.Constraints) layout.Dimensions {
dims = f.Layout(c1, c2) in := layout.Inset{Top: ui.Dp(4)}
} return in.Layout(c, ops, cs, func(cs layout.Constraints) layout.Dimensions {
c2 := f.End(dims) return text.Label{Material: theme.tertText, Face: u.face(fonts.regular, 12), Text: user.company}.Layout(ops, cs)
dims = f.Layout(c1, c2) })
dims = in.End(dims) })
return f.Layout(c1, c2)
})
return f.Layout(c1, c2)
})
pointer.RectAreaOp{Rect: image.Rectangle{Max: dims.Size}}.Add(ops) pointer.RectAreaOp{Rect: image.Rectangle{Max: dims.Size}}.Add(ops)
click := &u.userClicks[index] click := &u.userClicks[index]
click.Add(ops) click.Add(ops)
} return dims
c1 := elem.End(dims) })
return elem.Layout(c1) return elem.Layout(c1)
} }
@@ -436,19 +432,13 @@ func baseline() layout.Flex {
} }
type clipCircle struct { type clipCircle struct {
m ui.MacroOp
ops *ui.Ops
} }
func (c *clipCircle) Begin(ops *ui.Ops, cs layout.Constraints) layout.Constraints { func (c *clipCircle) Layout(ops *ui.Ops, cs layout.Constraints, w layout.Widget) layout.Dimensions {
c.ops = ops var m ui.MacroOp
c.m.Record(ops) m.Record(ops)
return cs dims := w(cs)
} m.Stop()
func (c *clipCircle) End(dims layout.Dimensions) layout.Dimensions {
c.m.Stop()
ops := c.ops
max := dims.Size.X max := dims.Size.X
if dy := dims.Size.Y; dy > max { if dy := dims.Size.Y; dy > max {
max = dy max = dy
@@ -458,7 +448,7 @@ func (c *clipCircle) End(dims layout.Dimensions) layout.Dimensions {
var stack ui.StackOp var stack ui.StackOp
stack.Push(ops) stack.Push(ops)
rrect(ops, szf, szf, rr, rr, rr, rr) rrect(ops, szf, szf, rr, rr, rr, rr)
c.m.Add(ops) m.Add(ops)
stack.Pop() stack.Pop()
return dims return dims
} }