From 49d74cae646d32013acab3dc965c9f763033cbf4 Mon Sep 17 00:00:00 2001 From: esimov Date: Fri, 3 Nov 2023 15:39:25 +0200 Subject: [PATCH] Trying to unify units on different screens --- help.go | 66 ++++++++++++++++++++++++++++----------------------------- hud.go | 28 ++++++++++++------------ main.go | 35 +++++++++++++++++------------- 3 files changed, 66 insertions(+), 63 deletions(-) diff --git a/help.go b/help.go index fa55eae..c819e45 100644 --- a/help.go +++ b/help.go @@ -17,18 +17,18 @@ import ( type help struct { fontType font.Typeface - lineHeight int - h1FontSize int - h2FontSize int + lineHeight unit.Dp + h1FontSize unit.Sp + h2FontSize unit.Sp } -type command map[string]string +type action map[string]string // ShowHelpDialog activates a dialog panel whith a list of the available key shortcuts. func (h *Hud) ShowHelpDialog(gtx layout.Context, th *material.Theme, isActive bool) { var ( - panelWidth int - panelHeight int + panelWidth unit.Dp + panelHeight unit.Dp ) // show the help dialog panel only if it's not yet activated. @@ -44,31 +44,31 @@ func (h *Hud) ShowHelpDialog(gtx layout.Context, th *material.Theme, isActive bo }, }, 0).Op(gtx.Ops)) - centerX := int(unit.Dp(windowWidth / 2)) - centerY := int(unit.Dp(windowHeight / 2)) - - fontSize := int(unit.Sp(h.h1FontSize)) - lineHeight := int(unit.Dp(h.lineHeight)) + centerX := windowWidth / 2 + centerY := windowHeight / 2 switch width := windowWidth; { - case width <= windowSizeX*1.4: - panelWidth = int(unit.Dp(windowWidth / 2)) + case width <= windowSizeX: + panelWidth = windowWidth / 2 default: - panelWidth = int(unit.Dp(windowWidth / 3)) + panelWidth = windowWidth / 3 } - ph := len(h.commands) * fontSize * lineHeight - panelHeight = ph + panelHeight = unit.Dp( + len(h.actions) * + gtx.Sp(h.h1FontSize) * + gtx.Dp(h.lineHeight), + ) - px := int(unit.Dp(panelWidth / 2)) - py := int(unit.Dp(panelHeight / 2)) + px := panelWidth / 2 + py := panelHeight / 2 dx, dy := centerX-px, centerY-py // Limit the applicable constraints to the panel size from this point onward. - gtx.Constraints.Min.X = panelWidth - gtx.Constraints.Max.X = panelWidth + gtx.Constraints.Min.X = gtx.Dp(panelWidth) + gtx.Constraints.Max.X = gtx.Constraints.Min.X // This offset will apply to the rest of the content laid out in this function. - defer op.Offset(image.Point{X: dx, Y: dy}).Push(gtx.Ops).Pop() + defer op.Offset(image.Point{X: gtx.Dp(dx), Y: gtx.Dp(dy)}).Push(gtx.Ops).Pop() layout.Flex{ Axis: layout.Vertical, @@ -77,23 +77,22 @@ func (h *Hud) ShowHelpDialog(gtx layout.Context, th *material.Theme, isActive bo paint.FillShape(gtx.Ops, color.NRGBA{R: 0xff, G: 0xff, B: 0xff, A: 0xff}, clip.UniformRRect(image.Rectangle{ Max: image.Point{ - X: panelWidth, - Y: panelHeight, + X: gtx.Dp(panelWidth), + Y: gtx.Dp(panelHeight), }, }, gtx.Dp(5)).Op(gtx.Ops)) paint.FillShape(gtx.Ops, color.NRGBA{A: 127}, clip.Stroke{ Path: clip.Rect{Max: image.Point{ - X: panelWidth, - Y: panelHeight, + X: gtx.Dp(panelWidth), + Y: gtx.Dp(panelHeight), }}.Path(), Width: 0.2, }.Op(), ) - layoutOffset := unit.Dp(20) - return layout.UniformInset(layoutOffset).Layout(gtx, func(gtx C) D { + return layout.UniformInset(20).Layout(gtx, func(gtx C) D { layout.Center.Layout(gtx, func(gtx C) D { h1 := material.H2(th, "Quick help") h1.TextSize = unit.Sp(h.h1FontSize) @@ -104,14 +103,13 @@ func (h *Hud) ShowHelpDialog(gtx layout.Context, th *material.Theme, isActive bo layout.Rigid(h1.Layout), ) }) - colOffset := unit.Dp(200) - gtx.Constraints.Min.X = panelWidth - int(layoutOffset) - int(colOffset) + gtx.Constraints.Min.X = gtx.Dp(panelWidth) - 220 defer op.Offset(image.Point{X: 0, Y: 50}).Push(gtx.Ops).Pop() - h.list.Layout(gtx, len(h.commands), + h.list.Layout(gtx, len(h.actions), func(gtx C, index int) D { builder := strings.Builder{} - if cmd, ok := h.commands[index]; ok { + if cmd, ok := h.actions[index]; ok { for key := range cmd { builder.WriteString(fmt.Sprintf("%s\n", key)) } @@ -126,11 +124,11 @@ func (h *Hud) ShowHelpDialog(gtx layout.Context, th *material.Theme, isActive bo ) }, ) - defer op.Offset(image.Point{X: gtx.Dp(colOffset), Y: 0}).Push(gtx.Ops).Pop() - h.list.Layout(gtx, len(h.commands), + defer op.Offset(image.Point{X: gtx.Dp(200), Y: 0}).Push(gtx.Ops).Pop() + h.list.Layout(gtx, len(h.actions), func(gtx C, index int) D { builder := strings.Builder{} - if cmd, ok := h.commands[index]; ok { + if cmd, ok := h.actions[index]; ok { for _, desc := range cmd { builder.WriteString(fmt.Sprintf("%s\n", desc)) } diff --git a/hud.go b/hud.go index 05cd654..5dc8311 100644 --- a/hud.go +++ b/hud.go @@ -32,13 +32,13 @@ type ( type Hud struct { hudTag struct{} panelInit time.Time - panelWidth int - panelHeight int + panelWidth unit.Dp + panelHeight unit.Dp winOffsetX float64 // stores the X offset on window horizontal resize winOffsetY float64 // stores the Y offset on window vertical resize ctrlBtn *Easing sliders map[int]*slider - commands map[int]command + actions map[int]action slide *Easing reset widget.Clickable debug widget.Bool @@ -65,13 +65,13 @@ type slider struct { // NewHud creates a new HUD used to interactively change the default settings via sliders and checkboxes. func NewHud() *Hud { hud := Hud{ - sliders: make(map[int]*slider), - commands: make(map[int]command), + sliders: make(map[int]*slider), + actions: make(map[int]action), help: &help{ fontType: "AlbertSans", - lineHeight: 3, - h1FontSize: 18, - h2FontSize: 15, + lineHeight: unit.Dp(3), + h1FontSize: unit.Sp(18), + h2FontSize: unit.Sp(15), }, } @@ -85,7 +85,7 @@ func NewHud() *Hud { hud.addSlider(idx, s) } - commands := []command{ + actions := []action{ {"F1": "Toggle the quick help panel"}, {"Space": "Redraw the cloth"}, {"Right click": "Tear the cloth at mouse position"}, @@ -94,8 +94,8 @@ func NewHud() *Hud { {"Ctrl+click": "Pin the cloth particle at mouse position"}, } - for idx, cmd := range commands { - hud.commands[idx] = cmd + for idx, action := range actions { + hud.actions[idx] = action } slide := &Easing{duration: 600 * time.Millisecond} @@ -227,7 +227,7 @@ func (h *Hud) ShowControlPanel(gtx layout.Context, th *material.Theme, isActive return D{} }) }) - h.panelHeight = layout.Size.Y + h.closeBtn + h.panelHeight = unit.Dp(layout.Size.Y + h.closeBtn) return layout }), layout.Rigid(func(gtx C) D { @@ -248,9 +248,9 @@ func (h *Hud) ShowControlPanel(gtx layout.Context, th *material.Theme, isActive w.Alignment = text.End w.Color = th.ContrastBg w.TextSize = 12 - txtOffs := h.panelHeight - (3 * h.closeBtn) + txtOffs := h.panelHeight - unit.Dp(3*h.closeBtn) - defer op.Offset(image.Point{Y: txtOffs}).Push(gtx.Ops).Pop() + defer op.Offset(image.Point{Y: int(txtOffs)}).Push(gtx.Ops).Pop() return layout.Flex{Axis: layout.Vertical}.Layout(gtx, layout.Rigid(func(gtx C) D { return layout.UniformInset(unit.Dp(10)).Layout(gtx, w.Layout) diff --git a/main.go b/main.go index 56641af..e60848c 100644 --- a/main.go +++ b/main.go @@ -29,11 +29,11 @@ const ( hudTimeout = 2.5 delta = 0.022 - windowSizeX = 1280 - windowSizeY = 820 + windowSizeX = unit.Dp(1280) + windowSizeY = unit.Dp(820) - defaultWindowWidth = 940 - defaultWindowHeigth = 580 + defaultWindowWidth = unit.Dp(940) + defaultWindowHeigth = unit.Dp(580) ) var ( @@ -66,7 +66,7 @@ func main() { go func() { w := app.NewWindow( app.Title("Gio - 2D Cloth Simulation"), - app.Size(unit.Dp(windowSizeX), unit.Dp(windowSizeY)), + app.Size(windowSizeX, windowSizeY), ) if err := loop(w); err != nil { log.Fatal(err) @@ -179,26 +179,31 @@ func loop(w *app.Window) error { hud.winOffsetX = 0 hud.winOffsetY = 0 + gtxWidth := gtx.Dp(windowWidth) + gtxHeight := gtx.Dp(windowHeight) + gtxDefaultWidth := gtx.Dp(windowWidth) + gtxDefaultHeight := gtx.Dp(windowHeight) + if defaultWindowWidth != windowWidth { - hud.winOffsetX = float64(e.Size.X-windowWidth) * 0.5 + hud.winOffsetX = float64(e.Size.X-gtxWidth) * 0.5 } if defaultWindowHeigth != windowHeight { - hud.winOffsetY = float64(e.Size.Y-windowHeight) * 0.25 + hud.winOffsetY = float64(e.Size.Y-gtxHeight) * 0.25 } - if e.Size.X != windowWidth || e.Size.Y != windowHeight { - cloth.Init(windowWidth, windowHeight, hud) + if e.Size.X != gtxWidth || e.Size.Y != gtxHeight { + cloth.Init(gtxWidth, gtxHeight, hud) - windowWidth = e.Size.X - windowHeight = e.Size.Y + windowWidth = unit.Dp(e.Size.X) + windowHeight = unit.Dp(e.Size.Y) - cloth.width = windowWidth - cloth.height = windowHeight + cloth.width = gtxWidth + cloth.height = gtxHeight - if e.Size.X < defaultWindowWidth { + if e.Size.X < gtxDefaultWidth { hud.showHelpPanel = false } - if e.Size.Y < defaultWindowHeigth { + if e.Size.Y < gtxDefaultHeight { hud.showHelpPanel = false } }