diff --git a/cmd/go.mod b/cmd/go.mod index c89490ac..2863a3f5 100644 --- a/cmd/go.mod +++ b/cmd/go.mod @@ -3,7 +3,7 @@ module gioui.org/cmd go 1.13 require ( - gioui.org v0.0.0-20191203232943-86d69859b93a + gioui.org v0.0.0-20191211234536-7814da47a0ff github.com/chromedp/cdproto v0.0.0-20191114225735-6626966fbae4 github.com/chromedp/chromedp v0.5.2 golang.org/x/image v0.0.0-20190802002840-cff245a6509b diff --git a/cmd/go.sum b/cmd/go.sum index ff6e198b..7e214239 100644 --- a/cmd/go.sum +++ b/cmd/go.sum @@ -1,6 +1,6 @@ dmitri.shuralyov.com/gpu/mtl v0.0.0-20190408044501-666a987793e9/go.mod h1:H6x//7gZCb22OMCxBHrMx7a5I7Hp++hsVxbQ4BYO7hU= -gioui.org v0.0.0-20191203232943-86d69859b93a h1:bF+1UDLyzDS3uePt+vWdPres0WauMc6cjvTOAYuPRU8= -gioui.org v0.0.0-20191203232943-86d69859b93a/go.mod h1:KqFFi2Dq5gYA3FJ0sDOt8OBXoMsuxMtE8v2f0JExXAY= +gioui.org v0.0.0-20191211234536-7814da47a0ff h1:XaABsWEirzZKjqiWVD5eck5Ge/FpYEP9/eZHV1jpj50= +gioui.org v0.0.0-20191211234536-7814da47a0ff/go.mod h1:KqFFi2Dq5gYA3FJ0sDOt8OBXoMsuxMtE8v2f0JExXAY= github.com/BurntSushi/xgb v0.0.0-20160522181843-27f122750802 h1:1BDTz0u9nC3//pOCMdNH+CiXJVYJh5UQNCOBG7jbELc= github.com/BurntSushi/xgb v0.0.0-20160522181843-27f122750802/go.mod h1:IVnqGOEym/WlBOVXweHU+Q+/VP0lqqI8lqeDx9IjBqo= github.com/chromedp/cdproto v0.0.0-20191114225735-6626966fbae4 h1:QD3KxSJ59L2lxG6MXBjNHxiQO2RmxTQ3XcK+wO44WOg= diff --git a/cmd/gogio/testdata/red.go b/cmd/gogio/testdata/red.go index e3df965c..dad808bf 100644 --- a/cmd/gogio/testdata/red.go +++ b/cmd/gogio/testdata/red.go @@ -62,20 +62,24 @@ func loop(w *app.Window) error { case system.FrameEvent: gtx.Reset(e.Config, e.Size) - rows := layout.Flex{Axis: layout.Vertical} - r1 := rows.Flex(gtx, 0.5, func() { - columns := layout.Flex{Axis: layout.Horizontal} - r1c1 := columns.Flex(gtx, 0.5, func() { topLeft.Layout(gtx) }) - r1c2 := columns.Flex(gtx, 0.5, func() { topRight.Layout(gtx) }) - columns.Layout(gtx, r1c1, r1c2) - }) - r2 := rows.Flex(gtx, 0.5, func() { - columns := layout.Flex{Axis: layout.Horizontal} - r2c1 := columns.Flex(gtx, 0.5, func() { botLeft.Layout(gtx) }) - r2c2 := columns.Flex(gtx, 0.5, func() { botRight.Layout(gtx) }) - columns.Layout(gtx, r2c1, r2c2) - }) - rows.Layout(gtx, r1, r2) + layout.Flex{Axis: layout.Vertical}.Layout(gtx, + layout.Flexed(0.5, func() { + layout.Flex{Axis: layout.Horizontal}.Layout(gtx, + // r1c1 + layout.Flexed(0.5, func() { topLeft.Layout(gtx) }), + // r1c2 + layout.Flexed(0.5, func() { topRight.Layout(gtx) }), + ) + }), + layout.Flexed(0.5, func() { + layout.Flex{Axis: layout.Horizontal}.Layout(gtx, + // r2c1 + layout.Flexed(0.5, func() { botLeft.Layout(gtx) }), + // r2c2 + layout.Flexed(0.5, func() { botRight.Layout(gtx) }), + ) + }), + ) e.Frame(gtx.Ops) diff --git a/example/go.mod b/example/go.mod index 28a22b54..3756e0df 100644 --- a/example/go.mod +++ b/example/go.mod @@ -3,7 +3,7 @@ module gioui.org/example go 1.13 require ( - gioui.org v0.0.0-20191203232943-86d69859b93a + gioui.org v0.0.0-20191211234536-7814da47a0ff github.com/google/go-github/v24 v24.0.1 golang.org/x/exp v0.0.0-20191002040644-a1355ae1e2c3 golang.org/x/image v0.0.0-20190802002840-cff245a6509b diff --git a/example/go.sum b/example/go.sum index bb894901..1340b2d7 100644 --- a/example/go.sum +++ b/example/go.sum @@ -1,7 +1,7 @@ cloud.google.com/go v0.34.0/go.mod h1:aQUYkXzVsufM+DwF1aE+0xfcU+56JwCaLick0ClmMTw= dmitri.shuralyov.com/gpu/mtl v0.0.0-20190408044501-666a987793e9/go.mod h1:H6x//7gZCb22OMCxBHrMx7a5I7Hp++hsVxbQ4BYO7hU= -gioui.org v0.0.0-20191203232943-86d69859b93a h1:bF+1UDLyzDS3uePt+vWdPres0WauMc6cjvTOAYuPRU8= -gioui.org v0.0.0-20191203232943-86d69859b93a/go.mod h1:KqFFi2Dq5gYA3FJ0sDOt8OBXoMsuxMtE8v2f0JExXAY= +gioui.org v0.0.0-20191211234536-7814da47a0ff h1:XaABsWEirzZKjqiWVD5eck5Ge/FpYEP9/eZHV1jpj50= +gioui.org v0.0.0-20191211234536-7814da47a0ff/go.mod h1:KqFFi2Dq5gYA3FJ0sDOt8OBXoMsuxMtE8v2f0JExXAY= github.com/BurntSushi/xgb v0.0.0-20160522181843-27f122750802/go.mod h1:IVnqGOEym/WlBOVXweHU+Q+/VP0lqqI8lqeDx9IjBqo= github.com/go-gl/glfw v0.0.0-20190409004039-e6da0acd62b1/go.mod h1:vR7hzQXu2zJy9AVAgeJqvqgH9Q5CA+iKCZ2gyEVpxRU= github.com/golang/protobuf v1.2.0 h1:P3YflyNX/ehuJFLhxviNdFxQPkGK5cDcApsge1SqnvM= diff --git a/example/gophers/ui.go b/example/gophers/ui.go index a54dceb5..d1eeb1ff 100644 --- a/example/gophers/ui.go +++ b/example/gophers/ui.go @@ -172,84 +172,79 @@ func (up *userPage) commit(gtx *layout.Context, index int) { label := theme.Caption(msg) in := layout.Inset{Top: unit.Dp(16), Right: unit.Dp(8), Left: unit.Dp(8)} in.Layout(gtx, func() { - f := layout.Flex{Axis: layout.Horizontal} - c1 := f.Rigid(gtx, func() { - sz := gtx.Px(unit.Dp(48)) - cc := clipCircle{} - cc.Layout(gtx, func() { - gtx.Constraints = layout.RigidConstraints(gtx.Constraints.Constrain(image.Point{X: sz, Y: sz})) - u.layoutAvatar(gtx) - }) - }) - c2 := f.Flex(gtx, 1, func() { - gtx.Constraints.Width.Min = gtx.Constraints.Width.Max - layout.Inset{Left: unit.Dp(8)}.Layout(gtx, func() { - label.Layout(gtx) - }) - }) - f.Layout(gtx, c1, c2) + layout.Flex{Axis: layout.Horizontal}.Layout(gtx, + layout.Rigid(func() { + sz := gtx.Px(unit.Dp(48)) + cc := clipCircle{} + cc.Layout(gtx, func() { + gtx.Constraints = layout.RigidConstraints(gtx.Constraints.Constrain(image.Point{X: sz, Y: sz})) + u.layoutAvatar(gtx) + }) + }), + layout.Flexed(1, func() { + gtx.Constraints.Width.Min = gtx.Constraints.Width.Max + layout.Inset{Left: unit.Dp(8)}.Layout(gtx, func() { + label.Layout(gtx) + }) + }), + ) }) } func (u *UI) layoutUsers(gtx *layout.Context) { - st := layout.Stack{Alignment: layout.SE} - c1 := st.Rigid(gtx, func() { - f := layout.Flex{Axis: layout.Vertical} - - c1 := f.Rigid(gtx, func() { - gtx.Constraints.Width.Min = gtx.Constraints.Width.Max - layout.UniformInset(unit.Dp(16)).Layout(gtx, func() { - sz := gtx.Px(unit.Dp(200)) - cs := gtx.Constraints - gtx.Constraints = layout.RigidConstraints(cs.Constrain(image.Point{X: sz, Y: sz})) - theme.Editor("Hint").Layout(gtx, u.edit) - }) - }) - - c2 := f.Rigid(gtx, func() { - gtx.Constraints.Width.Min = gtx.Constraints.Width.Max - in := layout.Inset{Bottom: unit.Dp(16), Left: unit.Dp(16), Right: unit.Dp(16)} + layout.Stack{Alignment: layout.SE}.Layout(gtx, + layout.Expanded(func() { + layout.Flex{Axis: layout.Vertical}.Layout(gtx, + layout.Rigid(func() { + gtx.Constraints.Width.Min = gtx.Constraints.Width.Max + layout.UniformInset(unit.Dp(16)).Layout(gtx, func() { + sz := gtx.Px(unit.Dp(200)) + cs := gtx.Constraints + gtx.Constraints = layout.RigidConstraints(cs.Constrain(image.Point{X: sz, Y: sz})) + theme.Editor("Hint").Layout(gtx, u.edit) + }) + }), + layout.Rigid(func() { + gtx.Constraints.Width.Min = gtx.Constraints.Width.Max + in := layout.Inset{Bottom: unit.Dp(16), Left: unit.Dp(16), Right: unit.Dp(16)} + in.Layout(gtx, func() { + e := theme.Editor("Hint") + e.Font.Size = unit.Sp(14) + e.Font.Style = text.Italic + e.Layout(gtx, u.edit2) + }) + }), + layout.Rigid(func() { + layout.Stack{}.Layout(gtx, + layout.Expanded(func() { + gtx.Constraints.Width.Min = gtx.Constraints.Width.Max + fill{rgb(0xf2f2f2)}.Layout(gtx) + }), + layout.Stacked(func() { + in := layout.Inset{Top: unit.Dp(16), Right: unit.Dp(8), Bottom: unit.Dp(8), Left: unit.Dp(8)} + in.Layout(gtx, func() { + lbl := theme.Caption("GOPHERS") + lbl.Color = rgb(0x888888) + lbl.Layout(gtx) + }) + }), + ) + }), + layout.Flexed(1, func() { + gtx.Constraints.Width.Min = gtx.Constraints.Width.Max + u.layoutContributors(gtx) + }), + ) + }), + layout.Stacked(func() { + in := layout.UniformInset(unit.Dp(16)) in.Layout(gtx, func() { - e := theme.Editor("Hint") - e.Font.Size = unit.Sp(14) - e.Font.Style = text.Italic - e.Layout(gtx, u.edit2) + for u.fab.Clicked(gtx) { + } + theme.IconButton(u.fabIcon).Layout(gtx, u.fab) }) - }) - - c3 := f.Rigid(gtx, func() { - s := layout.Stack{} - c2 := s.Rigid(gtx, func() { - in := layout.Inset{Top: unit.Dp(16), Right: unit.Dp(8), Bottom: unit.Dp(8), Left: unit.Dp(8)} - in.Layout(gtx, func() { - lbl := theme.Caption("GOPHERS") - lbl.Color = rgb(0x888888) - lbl.Layout(gtx) - }) - }) - c1 := s.Expand(gtx, func() { - gtx.Constraints.Width.Min = gtx.Constraints.Width.Max - fill{rgb(0xf2f2f2)}.Layout(gtx) - }) - s.Layout(gtx, c1, c2) - }) - - c4 := f.Flex(gtx, 1, func() { - gtx.Constraints.Width.Min = gtx.Constraints.Width.Max - u.layoutContributors(gtx) - }) - f.Layout(gtx, c1, c2, c3, c4) - }) - c2 := st.Rigid(gtx, func() { - in := layout.UniformInset(unit.Dp(16)) - in.Layout(gtx, func() { - for u.fab.Clicked(gtx) { - } - theme.IconButton(u.fabIcon).Layout(gtx, u.fab) - }) - }) - - st.Layout(gtx, c1, c2) + }), + ) } func (u *UI) layoutContributors(gtx *layout.Context) { @@ -264,12 +259,10 @@ func (u *UI) layoutContributors(gtx *layout.Context) { func (u *UI) user(gtx *layout.Context, index int) { user := u.users[index] - elem := layout.Flex{Axis: layout.Vertical} - c1 := elem.Rigid(gtx, func() { - in := layout.UniformInset(unit.Dp(8)) - in.Layout(gtx, func() { - f := centerRowOpts() - c1 := f.Rigid(gtx, func() { + in := layout.UniformInset(unit.Dp(8)) + in.Layout(gtx, func() { + centerRowOpts().Layout(gtx, + layout.Rigid(func() { in := layout.Inset{Right: unit.Dp(8)} cc := clipCircle{} in.Layout(gtx, func() { @@ -280,41 +273,39 @@ func (u *UI) user(gtx *layout.Context, index int) { user.layoutAvatar(gtx) }) }) - }) - c2 := f.Rigid(gtx, func() { - f := column() - c1 := f.Rigid(gtx, func() { - f := baseline() - c1 := f.Rigid(gtx, func() { - theme.Body1(user.name).Layout(gtx) - }) - c2 := f.Flex(gtx, 1, func() { - gtx.Constraints.Width.Min = gtx.Constraints.Width.Max - layout.Align(layout.E).Layout(gtx, func() { - layout.Inset{Left: unit.Dp(2)}.Layout(gtx, func() { - theme.Caption("3 hours ago").Layout(gtx) - }) + }), + layout.Rigid(func() { + column().Layout(gtx, + layout.Rigid(func() { + baseline().Layout(gtx, + layout.Rigid(func() { + theme.Body1(user.name).Layout(gtx) + }), + layout.Flexed(1, func() { + gtx.Constraints.Width.Min = gtx.Constraints.Width.Max + layout.Align(layout.E).Layout(gtx, func() { + layout.Inset{Left: unit.Dp(2)}.Layout(gtx, func() { + theme.Caption("3 hours ago").Layout(gtx) + }) + }) + }), + ) + }), + layout.Rigid(func() { + in := layout.Inset{Top: unit.Dp(4)} + in.Layout(gtx, func() { + lbl := theme.Caption(user.company) + lbl.Color = rgb(0xbbbbbb) + lbl.Layout(gtx) }) - }) - f.Layout(gtx, c1, c2) - }) - c2 := f.Rigid(gtx, func() { - in := layout.Inset{Top: unit.Dp(4)} - in.Layout(gtx, func() { - lbl := theme.Caption(user.company) - lbl.Color = rgb(0xbbbbbb) - lbl.Layout(gtx) - }) - }) - f.Layout(gtx, c1, c2) - }) - f.Layout(gtx, c1, c2) - }) - pointer.Rect(image.Rectangle{Max: gtx.Dimensions.Size}).Add(gtx.Ops) - click := &u.userClicks[index] - click.Add(gtx.Ops) + }), + ) + }), + ) }) - elem.Layout(gtx, c1) + pointer.Rect(image.Rectangle{Max: gtx.Dimensions.Size}).Add(gtx.Ops) + click := &u.userClicks[index] + click.Add(gtx.Ops) } func (u *user) layoutAvatar(gtx *layout.Context) { @@ -377,7 +368,7 @@ func (c *clipCircle) Layout(gtx *layout.Context, w layout.Widget) { Rect: f32.Rectangle{Max: f32.Point{X: szf, Y: szf}}, NE: rr, NW: rr, SE: rr, SW: rr, }.Op(gtx.Ops).Add(gtx.Ops) - m.Add(gtx.Ops) + m.Add() stack.Pop() } diff --git a/example/kitchen/kitchen.go b/example/kitchen/kitchen.go index 3eaa54bc..7755c625 100644 --- a/example/kitchen/kitchen.go +++ b/example/kitchen/kitchen.go @@ -141,48 +141,48 @@ func kitchen(gtx *layout.Context, th *material.Theme) { } }, func() { - buttons := layout.Flex{Alignment: layout.Middle} in := layout.UniformInset(unit.Dp(8)) - b1 := buttons.Rigid(gtx, func() { - in.Layout(gtx, func() { - th.IconButton(icon).Layout(gtx, iconButton) - }) - }) - b2 := buttons.Rigid(gtx, func() { - in.Layout(gtx, func() { - for button.Clicked(gtx) { - green = !green - } - th.Button("Click me!").Layout(gtx, button) - }) - }) - b3 := buttons.Rigid(gtx, func() { - in.Layout(gtx, func() { - var btn material.Button - btn = th.Button("Green button") - if green { - btn.Background = color.RGBA{A: 0xff, R: 0x9e, G: 0x9d, B: 0x24} - } - btn.Layout(gtx, greenButton) - }) - }) - buttons.Layout(gtx, b1, b2, b3) + layout.Flex{Alignment: layout.Middle}.Layout(gtx, + layout.Rigid(func() { + in.Layout(gtx, func() { + th.IconButton(icon).Layout(gtx, iconButton) + }) + }), + layout.Rigid(func() { + in.Layout(gtx, func() { + for button.Clicked(gtx) { + green = !green + } + th.Button("Click me!").Layout(gtx, button) + }) + }), + layout.Rigid(func() { + in.Layout(gtx, func() { + var btn material.Button + btn = th.Button("Green button") + if green { + btn.Background = color.RGBA{A: 0xff, R: 0x9e, G: 0x9d, B: 0x24} + } + btn.Layout(gtx, greenButton) + }) + }), + ) }, func() { th.CheckBox("Checkbox").Layout(gtx, checkbox) }, func() { - group := layout.Flex{} - r1 := group.Rigid(gtx, func() { - th.RadioButton("r1", "RadioButton1").Layout(gtx, radioButtonsGroup) - }) - r2 := group.Rigid(gtx, func() { - th.RadioButton("r2", "RadioButton2").Layout(gtx, radioButtonsGroup) - }) - r3 := group.Rigid(gtx, func() { - th.RadioButton("r3", "RadioButton3").Layout(gtx, radioButtonsGroup) - }) - group.Layout(gtx, r1, r2, r3) + layout.Flex{}.Layout(gtx, + layout.Rigid(func() { + th.RadioButton("r1", "RadioButton1").Layout(gtx, radioButtonsGroup) + }), + layout.Rigid(func() { + th.RadioButton("r2", "RadioButton2").Layout(gtx, radioButtonsGroup) + }), + layout.Rigid(func() { + th.RadioButton("r3", "RadioButton3").Layout(gtx, radioButtonsGroup) + }), + ) }, } list.Layout(gtx, len(widgets), func(i int) {