From 4d84f46edbb1cd8575c4e13d688eac47ea98b8fc Mon Sep 17 00:00:00 2001 From: Elias Naur Date: Tue, 24 Sep 2019 21:47:58 +0200 Subject: [PATCH] apps: replace separate layout state with layout.Context fields Signed-off-by: Elias Naur --- apps/go.mod | 2 +- apps/go.sum | 4 +- apps/gophers/main.go | 14 ++- apps/gophers/main_test.go | 16 ++-- apps/gophers/ui.go | 185 +++++++++++++++++++------------------- apps/hello/hello.go | 20 ++--- 6 files changed, 117 insertions(+), 124 deletions(-) diff --git a/apps/go.mod b/apps/go.mod index dc3194e6..11251297 100644 --- a/apps/go.mod +++ b/apps/go.mod @@ -3,7 +3,7 @@ module gioui.org/apps go 1.13 require ( - gioui.org/ui v0.0.0-20190924183214-2f878fe154d1 + gioui.org/ui v0.0.0-20190924202410-3944ef4b2e46 github.com/google/go-github/v24 v24.0.1 golang.org/x/exp v0.0.0-20190627132806-fd42eb6b336f golang.org/x/image v0.0.0-20190703141733-d6a02ce849c9 diff --git a/apps/go.sum b/apps/go.sum index 8f11573d..a51a4140 100644 --- a/apps/go.sum +++ b/apps/go.sum @@ -1,6 +1,6 @@ cloud.google.com/go v0.34.0/go.mod h1:aQUYkXzVsufM+DwF1aE+0xfcU+56JwCaLick0ClmMTw= -gioui.org/ui v0.0.0-20190924183214-2f878fe154d1 h1:9R7EDPuwyF9dFfGLC6vZ9mL86eYIGlEBwzkHHo0/Ze0= -gioui.org/ui v0.0.0-20190924183214-2f878fe154d1/go.mod h1:PssKPKlqVIeyaed+0w492Xc2NgX5M3n6oZKOAj5rxoE= +gioui.org/ui v0.0.0-20190924202410-3944ef4b2e46 h1:aNmeeRhiuvnWyM3YafyZ3XIHwl3qThBWJP0O2Nj2uCo= +gioui.org/ui v0.0.0-20190924202410-3944ef4b2e46/go.mod h1:PssKPKlqVIeyaed+0w492Xc2NgX5M3n6oZKOAj5rxoE= 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/go.mod h1:6lQm79b+lXiMfvg/cZm0SGofjICqVBUtrP5yJMmIC1U= diff --git a/apps/gophers/main.go b/apps/gophers/main.go index 5d18c7b7..4a8b7095 100644 --- a/apps/gophers/main.go +++ b/apps/gophers/main.go @@ -77,9 +77,9 @@ func initProfiling() { func (a *App) run() error { a.ui.profiling = *stats - ops := new(ui.Ops) - var cfg app.Config - ctx := new(layout.Context) + c := &layout.Context{ + Queue: a.w.Queue(), + } for { select { case users := <-a.updateUsers: @@ -127,11 +127,9 @@ func (a *App) run() error { } } case app.UpdateEvent: - ops.Reset() - cfg = e.Config - ctx.Constraints = layout.RigidConstraints(e.Size) - a.ui.Layout(&cfg, a.w.Queue(), ops, ctx) - a.w.Update(ops) + c.Reset(&e.Config, layout.RigidConstraints(e.Size)) + a.ui.Layout(c) + a.w.Update(c.Ops) } } } diff --git a/apps/gophers/main_test.go b/apps/gophers/main_test.go index 08f7a3ab..a8e55ec1 100644 --- a/apps/gophers/main_test.go +++ b/apps/gophers/main_test.go @@ -8,7 +8,6 @@ import ( "time" "gioui.org/ui" - "gioui.org/ui/input" "gioui.org/ui/layout" ) @@ -19,18 +18,17 @@ type config struct{} func BenchmarkUI(b *testing.B) { fetch := func(_ string) {} u := newUI(fetch) - ops := new(ui.Ops) - q := new(queue) - c := new(config) - ctx := new(layout.Context) - ctx.Constraints = layout.RigidConstraints(image.Point{800, 600}) + cfg := new(config) + c := &layout.Context{ + Queue: new(queue), + } for i := 0; i < b.N; i++ { - ops.Reset() - u.Layout(c, q, ops, ctx) + c.Reset(cfg, layout.RigidConstraints(image.Point{800, 600})) + u.Layout(c) } } -func (queue) Next(k input.Key) (input.Event, bool) { +func (queue) Next(k ui.Key) (ui.Event, bool) { return nil, false } diff --git a/apps/gophers/ui.go b/apps/gophers/ui.go index 8bb77a2f..1211afb3 100644 --- a/apps/gophers/ui.go +++ b/apps/gophers/ui.go @@ -20,7 +20,6 @@ import ( "gioui.org/ui" "gioui.org/ui/f32" "gioui.org/ui/gesture" - "gioui.org/ui/input" "gioui.org/ui/key" "gioui.org/ui/layout" "gioui.org/ui/measure" @@ -172,44 +171,44 @@ func (u *UI) face(f *sfnt.Font, size float32) text.Face { return u.faces.For(f, ui.Sp(size)) } -func (u *UI) layoutTimings(c ui.Config, q input.Queue, ops *ui.Ops, ctx *layout.Context) { +func (u *UI) layoutTimings(c *layout.Context) { if !u.profiling { return } - for e, ok := q.Next(u); ok; e, ok = q.Next(u) { + for e, ok := c.Next(u); ok; e, ok = c.Next(u) { if e, ok := e.(system.ProfileEvent); ok { u.profile = e } } - system.ProfileOp{Key: u}.Add(ops) + system.ProfileOp{Key: u}.Add(c.Ops) var mstats runtime.MemStats runtime.ReadMemStats(&mstats) mallocs := mstats.Mallocs - u.lastMallocs u.lastMallocs = mstats.Mallocs - layout.Align(layout.NE).Layout(ops, ctx, func() { - layout.Inset{Top: ui.Dp(16)}.Layout(c, ops, ctx, func() { + layout.Align(layout.NE).Layout(c, func() { + layout.Inset{Top: ui.Dp(16)}.Layout(c, func() { txt := fmt.Sprintf("m: %d %s", mallocs, u.profile.Timings) - text.Label{Material: theme.text, Face: u.face(fonts.mono, 10), Text: txt}.Layout(ops, ctx) + text.Label{Material: theme.text, Face: u.face(fonts.mono, 10), Text: txt}.Layout(c) }) }) } -func (u *UI) Layout(c ui.Config, q input.Queue, ops *ui.Ops, ctx *layout.Context) { +func (u *UI) Layout(c *layout.Context) { u.faces.Reset(c) for i := range u.userClicks { click := &u.userClicks[i] - for e, ok := click.Next(q); ok; e, ok = click.Next(q) { + for e, ok := click.Next(c); ok; e, ok = click.Next(c) { if e.Type == gesture.TypeClick { u.selectedUser = u.newUserPage(u.users[i]) } } } if u.selectedUser == nil { - u.layoutUsers(c, q, ops, ctx) + u.layoutUsers(c) } else { - u.selectedUser.Layout(c, q, ops, ctx) + u.selectedUser.Layout(c) } - u.layoutTimings(c, q, ops, ctx) + u.layoutTimings(c) } func (u *UI) newUserPage(user *user) *userPage { @@ -222,156 +221,156 @@ func (u *UI) newUserPage(user *user) *userPage { return up } -func (up *userPage) Layout(c ui.Config, q input.Queue, ops *ui.Ops, ctx *layout.Context) { +func (up *userPage) Layout(c *layout.Context) { l := up.commitsList if l.Dragging() { - key.HideInputOp{}.Add(ops) + key.HideInputOp{}.Add(c.Ops) } - l.Layout(c, q, ops, ctx, len(up.commits), func(i int) { - up.commit(c, ops, ctx, i) + l.Layout(c, len(up.commits), func(i int) { + up.commit(c, i) }) } -func (up *userPage) commit(c ui.Config, ops *ui.Ops, ctx *layout.Context, index int) { +func (up *userPage) commit(c *layout.Context, index int) { u := up.user msg := up.commits[index].GetMessage() 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(c, ops, ctx, func() { - f := (&layout.Flex{Axis: layout.Horizontal}).Init(ops, ctx) + in.Layout(c, func() { + f := (&layout.Flex{Axis: layout.Horizontal}).Init(c) c1 := f.Rigid(func() { sz := c.Px(ui.Dp(48)) cc := clipCircle{} - cc.Layout(ops, ctx, func() { - ctx.Constraints = layout.RigidConstraints(ctx.Constraints.Constrain(image.Point{X: sz, Y: sz})) - widget.Image{Src: u.avatar, Rect: u.avatar.Bounds()}.Layout(c, ops, ctx) + cc.Layout(c, func() { + c.Constraints = layout.RigidConstraints(c.Constraints.Constrain(image.Point{X: sz, Y: sz})) + widget.Image{Src: u.avatar, Rect: u.avatar.Bounds()}.Layout(c) }) }) c2 := f.Flexible(1, func() { - ctx.Constraints.Width.Min = ctx.Constraints.Width.Max - layout.Inset{Left: ui.Dp(8)}.Layout(c, ops, ctx, func() { - label.Layout(ops, ctx) + c.Constraints.Width.Min = c.Constraints.Width.Max + layout.Inset{Left: ui.Dp(8)}.Layout(c, func() { + label.Layout(c) }) }) f.Layout(c1, c2) }) } -func (u *UI) layoutUsers(c ui.Config, q input.Queue, ops *ui.Ops, ctx *layout.Context) { - st := (&layout.Stack{}).Init(ops, ctx) +func (u *UI) layoutUsers(c *layout.Context) { + st := (&layout.Stack{}).Init(c) c2 := st.Rigid(func() { - layout.Align(layout.SE).Layout(ops, ctx, func() { + layout.Align(layout.SE).Layout(c, func() { in := layout.UniformInset(ui.Dp(16)) - in.Layout(c, ops, ctx, func() { - u.fab.Layout(c, q, ops, ctx) + in.Layout(c, func() { + u.fab.Layout(c) }) }) }) c1 := st.Expand(func() { - f := (&layout.Flex{Axis: layout.Vertical}).Init(ops, ctx) + f := (&layout.Flex{Axis: layout.Vertical}).Init(c) c1 := f.Rigid(func() { - ctx.Constraints.Width.Min = ctx.Constraints.Width.Max - layout.UniformInset(ui.Dp(16)).Layout(c, ops, ctx, func() { + c.Constraints.Width.Min = c.Constraints.Width.Max + layout.UniformInset(ui.Dp(16)).Layout(c, func() { sz := c.Px(ui.Dp(200)) - cs := ctx.Constraints - ctx.Constraints = layout.RigidConstraints(cs.Constrain(image.Point{X: sz, Y: sz})) - u.edit.Layout(c, q, ops, ctx) + cs := c.Constraints + c.Constraints = layout.RigidConstraints(cs.Constrain(image.Point{X: sz, Y: sz})) + u.edit.Layout(c) }) }) c2 := f.Rigid(func() { - ctx.Constraints.Width.Min = ctx.Constraints.Width.Max + c.Constraints.Width.Min = c.Constraints.Width.Max in := layout.Inset{Bottom: ui.Dp(16), Left: ui.Dp(16), Right: ui.Dp(16)} - in.Layout(c, ops, ctx, func() { - u.edit2.Layout(c, q, ops, ctx) + in.Layout(c, func() { + u.edit2.Layout(c) }) }) c3 := f.Rigid(func() { - ctx.Constraints.Width.Min = ctx.Constraints.Width.Max + c.Constraints.Width.Min = c.Constraints.Width.Max s := layout.Stack{Alignment: layout.Center} - s.Init(ops, ctx) + s.Init(c) c2 := s.Rigid(func() { - grey := colorMaterial(ops, rgb(0x888888)) + grey := colorMaterial(c.Ops, rgb(0x888888)) in := layout.Inset{Top: ui.Dp(16), Right: ui.Dp(8), Bottom: ui.Dp(8), Left: ui.Dp(8)} - in.Layout(c, ops, ctx, func() { + in.Layout(c, func() { lbl := text.Label{Material: grey, Face: u.face(fonts.regular, 11), Text: "GOPHERS"} - lbl.Layout(ops, ctx) + lbl.Layout(c) }) }) c1 := s.Expand(func() { - fill{colorMaterial(ops, rgb(0xf2f2f2))}.Layout(ops, ctx) + fill{colorMaterial(c.Ops, rgb(0xf2f2f2))}.Layout(c) }) s.Layout(c1, c2) }) c4 := f.Flexible(1, func() { - ctx.Constraints.Width.Min = ctx.Constraints.Width.Max - u.layoutContributors(c, q, ops, ctx) + c.Constraints.Width.Min = c.Constraints.Width.Max + u.layoutContributors(c) }) f.Layout(c1, c2, c3, c4) }) st.Layout(c1, c2) } -func (a *ActionButton) Layout(c ui.Config, q input.Queue, ops *ui.Ops, ctx *layout.Context) { +func (a *ActionButton) Layout(c *layout.Context) { f := layout.Flex{Axis: layout.Vertical, Alignment: layout.End} - f.Init(ops, ctx) + f.Init(c) f.Layout(f.Rigid(func() { - layout.Inset{Top: ui.Dp(4)}.Layout(c, ops, ctx, func() { - fab(ops, ctx, a.sendIco.image(c), theme.brand, c.Px(ui.Dp(56))) - pointer.EllipseAreaOp{Rect: image.Rectangle{Max: ctx.Dimensions.Size}}.Add(ops) + layout.Inset{Top: ui.Dp(4)}.Layout(c, func() { + fab(c, a.sendIco.image(c), theme.brand, c.Px(ui.Dp(56))) + pointer.EllipseAreaOp{Rect: image.Rectangle{Max: c.Dimensions.Size}}.Add(c.Ops) }) })) } -func (u *UI) layoutContributors(c ui.Config, q input.Queue, ops *ui.Ops, ctx *layout.Context) { +func (u *UI) layoutContributors(c *layout.Context) { l := u.usersList if l.Dragging() { - key.HideInputOp{}.Add(ops) + key.HideInputOp{}.Add(c.Ops) } - l.Layout(c, q, ops, ctx, len(u.users), func(i int) { - u.user(c, ops, ctx, i) + l.Layout(c, len(u.users), func(i int) { + u.user(c, i) }) } -func (u *UI) user(c ui.Config, ops *ui.Ops, ctx *layout.Context, index int) { +func (u *UI) user(c *layout.Context, index int) { user := u.users[index] elem := layout.Flex{Axis: layout.Vertical} - elem.Init(ops, ctx) + elem.Init(c) c1 := elem.Rigid(func() { in := layout.UniformInset(ui.Dp(8)) - in.Layout(c, ops, ctx, func() { + in.Layout(c, func() { f := centerRowOpts() - f.Init(ops, ctx) + f.Init(c) c1 := f.Rigid(func() { in := layout.Inset{Right: ui.Dp(8)} cc := clipCircle{} - in.Layout(c, ops, ctx, func() { - cc.Layout(ops, ctx, func() { + in.Layout(c, func() { + cc.Layout(c, func() { sz := image.Point{X: c.Px(ui.Dp(48)), Y: c.Px(ui.Dp(48))} - ctx.Constraints = layout.RigidConstraints(ctx.Constraints.Constrain(sz)) - widget.Image{Src: user.avatar, Rect: user.avatar.Bounds()}.Layout(c, ops, ctx) + c.Constraints = layout.RigidConstraints(c.Constraints.Constrain(sz)) + widget.Image{Src: user.avatar, Rect: user.avatar.Bounds()}.Layout(c) }) }) }) c2 := f.Rigid(func() { f := column() - f.Init(ops, ctx) + f.Init(c) c1 := f.Rigid(func() { f := baseline() - f.Init(ops, ctx) + f.Init(c) c1 := f.Rigid(func() { - text.Label{Material: theme.text, Face: u.face(fonts.regular, 13), Text: user.name}.Layout(ops, ctx) + text.Label{Material: theme.text, Face: u.face(fonts.regular, 13), Text: user.name}.Layout(c) }) c2 := f.Flexible(1, func() { - ctx.Constraints.Width.Min = ctx.Constraints.Width.Max - layout.Align(layout.E).Layout(ops, ctx, func() { - layout.Inset{Left: ui.Dp(2)}.Layout(c, ops, ctx, func() { + c.Constraints.Width.Min = c.Constraints.Width.Max + layout.Align(layout.E).Layout(c, func() { + layout.Inset{Left: ui.Dp(2)}.Layout(c, func() { lbl := text.Label{Material: theme.text, Face: u.face(fonts.regular, 10), Text: "3 hours ago"} - lbl.Layout(ops, ctx) + lbl.Layout(c) }) }) }) @@ -379,17 +378,17 @@ func (u *UI) user(c ui.Config, ops *ui.Ops, ctx *layout.Context, index int) { }) c2 := f.Rigid(func() { in := layout.Inset{Top: ui.Dp(4)} - in.Layout(c, ops, ctx, func() { - text.Label{Material: theme.tertText, Face: u.face(fonts.regular, 12), Text: user.company}.Layout(ops, ctx) + in.Layout(c, func() { + text.Label{Material: theme.tertText, Face: u.face(fonts.regular, 12), Text: user.company}.Layout(c) }) }) f.Layout(c1, c2) }) f.Layout(c1, c2) }) - pointer.RectAreaOp{Rect: image.Rectangle{Max: ctx.Dimensions.Size}}.Add(ops) + pointer.RectAreaOp{Rect: image.Rectangle{Max: c.Dimensions.Size}}.Add(c.Ops) click := &u.userClicks[index] - click.Add(ops) + click.Add(c.Ops) }) elem.Layout(c1) } @@ -398,15 +397,15 @@ type fill struct { material ui.MacroOp } -func (f fill) Layout(ops *ui.Ops, ctx *layout.Context) { - cs := ctx.Constraints +func (f fill) Layout(c *layout.Context) { + cs := c.Constraints d := image.Point{X: cs.Width.Max, Y: cs.Height.Max} dr := f32.Rectangle{ Max: f32.Point{X: float32(d.X), Y: float32(d.Y)}, } - f.material.Add(ops) - paint.PaintOp{Rect: dr}.Add(ops) - ctx.Dimensions = layout.Dimensions{Size: d, Baseline: d.Y} + f.material.Add(c.Ops) + paint.PaintOp{Rect: dr}.Add(c.Ops) + c.Dimensions = layout.Dimensions{Size: d, Baseline: d.Y} } func column() layout.Flex { @@ -424,12 +423,12 @@ func baseline() layout.Flex { type clipCircle struct { } -func (c *clipCircle) Layout(ops *ui.Ops, ctx *layout.Context, w layout.Widget) { +func (cc *clipCircle) Layout(c *layout.Context, w layout.Widget) { var m ui.MacroOp - m.Record(ops) + m.Record(c.Ops) w() m.Stop() - dims := ctx.Dimensions + dims := c.Dimensions max := dims.Size.X if dy := dims.Size.Y; dy > max { max = dy @@ -437,24 +436,24 @@ func (c *clipCircle) Layout(ops *ui.Ops, ctx *layout.Context, w layout.Widget) { szf := float32(max) rr := szf * .5 var stack ui.StackOp - stack.Push(ops) - rrect(ops, szf, szf, rr, rr, rr, rr) - m.Add(ops) + stack.Push(c.Ops) + rrect(c.Ops, szf, szf, rr, rr, rr, rr) + m.Add(c.Ops) stack.Pop() } -func fab(ops *ui.Ops, ctx *layout.Context, ico image.Image, mat ui.MacroOp, size int) { +func fab(c *layout.Context, ico image.Image, mat ui.MacroOp, size int) { dp := image.Point{X: (size - ico.Bounds().Dx()) / 2, Y: (size - ico.Bounds().Dy()) / 2} dims := image.Point{X: size, Y: size} rr := float32(size) * .5 - rrect(ops, float32(size), float32(size), rr, rr, rr, rr) - mat.Add(ops) - paint.PaintOp{Rect: f32.Rectangle{Max: f32.Point{X: float32(size), Y: float32(size)}}}.Add(ops) - paint.ImageOp{Src: ico, Rect: ico.Bounds()}.Add(ops) + rrect(c.Ops, float32(size), float32(size), rr, rr, rr, rr) + mat.Add(c.Ops) + paint.PaintOp{Rect: f32.Rectangle{Max: f32.Point{X: float32(size), Y: float32(size)}}}.Add(c.Ops) + paint.ImageOp{Src: ico, Rect: ico.Bounds()}.Add(c.Ops) paint.PaintOp{ Rect: toRectF(ico.Bounds().Add(dp)), - }.Add(ops) - ctx.Dimensions = layout.Dimensions{Size: dims} + }.Add(c.Ops) + c.Dimensions = layout.Dimensions{Size: dims} } func toRectF(r image.Rectangle) f32.Rectangle { diff --git a/apps/hello/hello.go b/apps/hello/hello.go index 944c33f4..6f000fe9 100644 --- a/apps/hello/hello.go +++ b/apps/hello/hello.go @@ -34,29 +34,27 @@ func loop(w *app.Window) error { if err != nil { panic("failed to load font") } - var cfg app.Config var faces measure.Faces maroon := color.RGBA{127, 0, 0, 255} face := faces.For(regular, ui.Sp(72)) message := "Hello, Gio" - ops := new(ui.Ops) - ctx := new(layout.Context) + c := &layout.Context{ + Queue: w.Queue(), + } for { e := <-w.Events() switch e := e.(type) { case app.DestroyEvent: return e.Err case app.UpdateEvent: - cfg = e.Config - faces.Reset(&cfg) - ctx.Constraints = layout.RigidConstraints(e.Size) - ops.Reset() + c.Reset(&e.Config, layout.RigidConstraints(e.Size)) + faces.Reset(c.Config) var material ui.MacroOp - material.Record(ops) - paint.ColorOp{Color: maroon}.Add(ops) + material.Record(c.Ops) + paint.ColorOp{Color: maroon}.Add(c.Ops) material.Stop() - text.Label{Material: material, Face: face, Alignment: text.Middle, Text: message}.Layout(ops, ctx) - w.Update(ops) + text.Label{Material: material, Face: face, Alignment: text.Middle, Text: message}.Layout(c) + w.Update(c.Ops) } } }