The Fyne GUI Toolkit (Steve O'Connor 2019)

Transcript

1. The Fyne GUI Toolkit GopherconAU, Sydney, Australia, 1 Nov 2019
2. The Fyne Toolkit GopherconAU, Sydney, Australia, 1 Nov 2019
3. Fyne GUI Toolkit – Talk Format • Show whats possible • State of Go GUI • Development Stories • TDD • Cross Platform • Deployment • Mobile / rPi, etc • Resources • http://fyne.io
4. 4 GUI Toolkits for Go • Go wrapped C libs (SDL, Qt, Gtk, etc) • The new breed of pure-Go toolkits https://www.linkedin.com/in/andrewjewilliams/
5. 5 Growing number of GUI tools https://github.com/avelino/awesome-go#gui
6. 6 HelloWorld – in Fyne github.com/fyne-io/fyne/cmd/hello
7. 7 Can I Haz Hello ? ... $ go get fyne.io/fyne $ cd $GOPATH/src/fyne.io/fyne/cmd/hello $ go build $ ./hello > demo 1
8. 8 Fyne Demo App • All the Widgets .. kitchen sink demo • github.com/fyne-io/fyne/cmd/fyne_demo
9. 9 Show me ALL The Things ... $ go get fyne.io/fyne $ cd $GOPATH/src/fyne.io/fyne/cmd/fyne_demo/ $ go build $ ./fyne_demo > demo 2
10. 10 App Scaling – with decimals ! • All output is scaled on the fly
11. 11 Grow It Shrink It $ go get fyne.io/fyne $ cd $GOPATH/src/fyne.io/fyne/cmd/fyne_settings/ $ go build $ ./fyne_settings > demo 3
12. 12 Today I learned • Pure-Go APIs are a reality in 2019 • Hello World in 4 lines of Go • Kitchen Sink app with example code to read • Fyne app displays are infinitely scalable • Fyne apps have dynamic Themes
13. 13 Now what if … We define a simple grid of blocks and animate them using the rules of Conway’s GameOfLife ?
14. 14 Game of Life – Animation Loop • Goroutine • Ticker chan • Calc New State • Call widget.Refresh()
15. 15 Game of Life – Generate next board • board.nextGen() • Apply Life Rules • Return as 2D Slice • Reset board data • ← to see animation code
16. 16 Game of Life – draw() function
17. 17 Make it ALIVE for me ! $ go github.com/fyne-io/examples $ cd $GOPATH/src/github.com/fyne-io/examples $ go build $ ./examples > demo 4 … then run “Life”
18. 18 Today I learned • Channels can make GUIs easy • Can paint inside a Goroutine • The “main thread” GUI problem is sorted • Simple animation loops are easy • How to paint framebuffers using Refresh()
19. 19 What if ? We wrap that Block-Framebuffer display in a BASIC interpreter and make it fully programmable ?
20. 20 That would work, yes indeed ! https://blog.steve.fi/tags/basic/ • $ go get a BASIC interpreter from the interwebz • Merge it into our app • …. ? • Profit !
21. 21 BOUNCY.BAS • Build a VM emulation – in Go • Give PEEK/POKE access to the framebuffer • Generate KEY interrupts • Generate VSYNC interrupts for video refresh
22. 22 Make it BOUNCY for me ... $ go get github.com/potato-arcade/p64 $ cd $GOPATH/src/github.com/potato-arcade/p64/cmd/potato64 $ go build $ ./potato64 ../../ROM/BOUNCY.BAS > demo 5
23. 23 TENNIS for 2 please ... $ go get github.com/potato-arcade/p64 $ cd $GOPATH/src/github.com/potato-arcade/p64/cmd/potato64 $ go build $ ./potato64 ../../ROM/TENNIS.BAS > demo 6
24. 24 I can code my own now .. $ go get github.com/andydotxyz/beebui $ cd $GOPATH/src/github.com/andydotxyz/beebui $ go build $ ./beebui > demo 7
25. 25 Today I learned • Because Go is a real compiler, we can write REAL programs … for real • The interwebz has a lot of good stuff • Other people’s Go code is (relatively) easy to grok • We can hack 3rd party Go code into our own projects, in unexpected ways • No ideas are ever too stupid to try
26. 26 Nintendo ? How about we wrap the Gameboy emulator inside a Fyne app too ?
27. 27 Can I Haz the Amazing Potato .. $ git clone https://github.com/HFO4/gameboy.live.git $ cd gameboy.live $ go build -o gbdotlive main.go $ gbdotlive -G -r ROMNAME.gb > demo 8
28. 28 Lets port Solitaire Lets write a solitaire clone 100% in Fyne .. no emulators this time. Lets Go !
29. 29 Fyne SVG Vector Solitaire $ go github.com/fyne-io/examples $ cd $GOPATH/src/github.com/fyne-io/examples $ go build $ ./examples > demo 4 … then run “Solitaire”
30. 30 Today I learned • Go is pretty good for doing simple GUIs • Its not hard to add a lot of complexity • Fyne, as a tool, keeps out of the way • pprof + race detector + GC + goroutines + channels == all ideal for rock solid GUI coding • Performance is pretty solid • Potentially more than “good enough” for a lot of ideas
31. 31 Good enough … for business ?
32. 32 Testing GUI Code • fyne/test package • Mock driver and Mock widgets • Yes you can TDD with fyne • Test your app behavior before you code • www.youtube.com/wat
33. 33 Cross Platform https://github.com/lucor/fyne-cross
34. 34 Android and iOS (development) • Gomobile based pipelines and bundler for Android and iOS builds • It actually works pretty well so far • Lots still to do github.com/fyne-io/mobile
35. 35 WebAssembly (development) • Cross compile Fyne apps straight to WebASM to run in the browser • Progress = Classified • No release dates yet • Should be interesting !
36. 36 FreeBSD ? • FreeBSD • MacOSX • Linux • Windows • Raspberry Pi / ARM All first class citizens in the Fyne community. We use all of them daily
37. 37 Today I learned • Mock driver can test your app before writing most of the code • FrontEnd testing can be painful, but go test is cool • Fyne inherits native Cross Platform from Go • Fyne has its own youtube channel ! • Fyne has additional tooling for CCAS • Mobile ! WebAssembly ! Yes !
38. 38 Fyne Desktop Gtk has Gnome Qt has KDE Fyne has ….. ?
39. 39 Fyne has its own desktop $ go github.com/fyne-io/desktop $ cd $GOPATH/src/github.com/fyne-io/desktop/cmd/fynedesk $ go build $ ./fynedesk > demo 9
40. 40 2-Way Data Binding As our application grows, sharing data between views becomes hard
41. 41 2 Way Data Binding (Fyne 1.2 Release) • DataAPI is a set of interfaces • https://github.com/fyne-io/fyne/wiki/Data-API • DataItem – single item of data of any type • DataMap – map of DataItem • DataSource – lazy loading []DataItem
42. 42 DataItem type DataItem interface { String() string AddListener(func(DataItem)) } Listeners are fired when the underlying data changes
43. 43 DataMap type DataMap interface { DataItem Get(string) DataItem AddListener(func(DataMap)) } Listeners are fired when the map is modified
44. 44 DataSource type DataSource interface { Count() int Get(int) DataItem AddListener(func(DataSource)) } Wraps a slice []DataItem Supports lazy loading and paging. Listeners are fired when the size of the []DataItem changes
45. 45 How does this affect the API All widgets alread have helper functions as constructors, ie : widget.NewLabel(string) widget.NewEntry() widget.NewCheck(callbackFn) … DataAPI adds a variant with the same function signature, but includes a reference to an object that implements the DataItem interface. Ie
46. 46 We ALL want to see this …. demo X
47. 47 The End .. hope you enjoyed that Thank You ! Fyne offers a consistent set of tools for application development, nicely packaged together so that you can use for favorite language and toolchain to work on your app. Join us on slack in the #fyne channel on Gophers Join us on github See you at drinks for any questions