cmd/gogio: start using layout.Flex in the e2e app

This vastly simplifies our code, and saves us the ugly math.

While at it, establish that a TestDriver must have a white background,
which is already satisfied by both existing implementations.

Signed-off-by: Daniel Martí <mvdan@mvdan.cc>

cmd/gogio/e2e_test.go

@@ -16,8 +16,11 @@ var headless = flag.Bool("headless", true, "run end-to-end tests in headless mod
 type TestDriver interface {
 	// Start provides the test driver with a testing.T, as well as the path
 	// to the Gio app to use for the test. The app will be run with the
-	// given width and height. When the function returns, the gio app must
+	// given width and height, and the platform's background should be
-	// be ready to use on the platform.
+	// white.
+	//
+	// When the function returns, the gio app must be ready to use on the
+	// platform.
 	//
 	// The returned cleanup funcs must be run in reverse order, to mimic
 	// deferred funcs.

cmd/gogio/testdata/red.go

@@ -10,7 +10,7 @@ import (
 	"gioui.org/app"
 	"gioui.org/f32"
 	"gioui.org/io/system"
-	"gioui.org/op"
+	"gioui.org/layout"
 	"gioui.org/op/paint"
 )
 
@@ -30,64 +30,41 @@ func loop(w *app.Window) error {
 	botLeft := color.RGBA{R: 0x00, G: 0x00, B: 0x00, A: 0xff}
 	botRight := color.RGBA{R: 0x00, G: 0x00, B: 0x00, A: 0x80}
 
-	ops := new(op.Ops)
+	gtx := &layout.Context{
+		Queue: w.Queue(),
+	}
 	for {
 		e := <-w.Events()
 		switch e := e.(type) {
 		case system.DestroyEvent:
 			return e.Err
 		case system.FrameEvent:
-			ops.Reset()
+			gtx.Reset(e.Config, e.Size)
-
+			rows := layout.Flex{Axis: layout.Vertical}
-			paint.ColorOp{Color: topLeft}.Add(ops)
+			r1 := rows.Flex(gtx, 0.5, func() {
-			paint.PaintOp{Rect: f32.Rectangle{
+				columns := layout.Flex{Axis: layout.Horizontal}
-				Min: f32.Point{
+				r1c1 := columns.Flex(gtx, 0.5, quarterWidget(gtx, topLeft))
-					X: 0,
+				r1c2 := columns.Flex(gtx, 0.5, quarterWidget(gtx, topRight))
-					Y: 0,
+				columns.Layout(gtx, r1c1, r1c2)
-				},
+			})
-				Max: f32.Point{
+			r2 := rows.Flex(gtx, 0.5, func() {
-					X: float32(e.Size.X) / 2,
+				columns := layout.Flex{Axis: layout.Horizontal}
-					Y: float32(e.Size.Y) / 2,
+				r2c1 := columns.Flex(gtx, 0.5, quarterWidget(gtx, botLeft))
-				},
+				r2c2 := columns.Flex(gtx, 0.5, quarterWidget(gtx, botRight))
-			}}.Add(ops)
+				columns.Layout(gtx, r2c1, r2c2)
-
+			})
-			paint.ColorOp{Color: topRight}.Add(ops)
+			rows.Layout(gtx, r1, r2)
-			paint.PaintOp{Rect: f32.Rectangle{
+			e.Frame(gtx.Ops)
-				Min: f32.Point{
-					X: float32(e.Size.X) / 2,
-					Y: 0,
-				},
-				Max: f32.Point{
-					X: float32(e.Size.X),
-					Y: float32(e.Size.Y) / 2,
-				},
-			}}.Add(ops)
-
-			paint.ColorOp{Color: botLeft}.Add(ops)
-			paint.PaintOp{Rect: f32.Rectangle{
-				Min: f32.Point{
-					X: 0,
-					Y: float32(e.Size.Y) / 2,
-				},
-				Max: f32.Point{
-					X: float32(e.Size.X) / 2,
-					Y: float32(e.Size.Y),
-				},
-			}}.Add(ops)
-
-			paint.ColorOp{Color: botRight}.Add(ops)
-			paint.PaintOp{Rect: f32.Rectangle{
-				Min: f32.Point{
-					X: float32(e.Size.X) / 2,
-					Y: float32(e.Size.Y) / 2,
-				},
-				Max: f32.Point{
-					X: float32(e.Size.X),
-					Y: float32(e.Size.Y),
-				},
-			}}.Add(ops)
-
-			e.Frame(ops)
 		}
 	}
 }
+
+func quarterWidget(gtx *layout.Context, clr color.RGBA) func() {
+	return func() {
+		paint.ColorOp{Color: clr}.Add(gtx.Ops)
+		paint.PaintOp{Rect: f32.Rectangle{Max: f32.Point{
+			X: float32(gtx.Constraints.Width.Max),
+			Y: float32(gtx.Constraints.Height.Max),
+		}}}.Add(gtx.Ops)
+	}
+}

cmd/gogio/x11_test.go

@@ -44,7 +44,9 @@ func (d *X11TestDriver) Start(t_ *testing.T, path string, width, height int) (cl
 	display := fmt.Sprintf(":%d", rnd.Intn(100000)+1)
 
 	var xprog string
-	xflags := []string{"-wr"}
+	xflags := []string{
+		"-wr", // we want a white background; the default is black
+	}
 	if *headless {
 		xprog = "Xvfb" // virtual X server
 		xflags = append(xflags, "-screen", "0", fmt.Sprintf("%dx%dx24", width, height))