はじめに
こんにちは。@af-2784です。
入社してから1年半、バッチやAPIなど、Goでバックエンド中心の開発をしてきましたが、
たまにはGUIの開発をしてみたい、オシャンな画面を作ってみたい…!
調べてみたら、GoにはFyneというGUIライブラリがあると知り、今回はこちらを少し触ってみたいと思います。
準備
Fyneをインストールします。
$ go get fyne.io/fyne/v2/app
$ go get fyne.io/fyne/v2/widget
$ go get fyne.io/fyne/v2/container
$ go get fyne.io/fyne/v2/canvas
Hello World
何事もまずはHello Worldから。
hello := widget.NewLabel("Hello World!")
のようにウィンドウに表示したいオブジェクトを定義し、SetContentの中に定義したオブジェクトを入れれば、GUIの画面に表示できるようです。
package main
import (
"fyne.io/fyne/v2/app"
"fyne.io/fyne/v2/widget"
"fyne.io/fyne/v2/container"
)
func main() {
a := app.New()
w := a.NewWindow("Hello")
hello := widget.NewLabel("Hello World!")
w.SetContent(container.NewVBox(
hello,
))
w.ShowAndRun()
}
これを実行すると、以下のようなウィンドウが表示されました!
ボタンの追加
先ほどのHello Worldの画面にボタンを追加し、ウィンドウの中のテキストを変えてみようと思います。
先ほどのコードに以下を追加します。
widget.NewButton("Button", func() {
hello.SetText("Merry Christmas!")
}),
全体像
package main
import (
"fyne.io/fyne/v2/app"
"fyne.io/fyne/v2/widget"
"fyne.io/fyne/v2/container"
)
func main() {
a := app.New()
w := a.NewWindow("Hello")
hello := widget.NewLabel("Hello World!")
w.SetContent(container.NewVBox(
hello,
widget.NewButton("Button", func() {
hello.SetText("Merry Christmas!")
}),
))
w.ShowAndRun()
}
ボタンを押すと、テキストがHello World!
からMerry Christmas!
に変わりました!
終了ボタンを追加する
一般的なGUIアプリケーションんのように、ウィンドウの左上の閉じるボタンを押せば、ウィンドウを閉じることができますが、Fyneを使って閉じるボタンを自作することも可能です。
先ほどのプログラムに以下を追加します。main関数の最初に定義した変数a := app.New()
に対してQuit()を実行することで、アプリケーションを終了することができるようです。
widget.NewButton("Quit", func() {
a.Quit()
}),
全体像
package main
import (
"fyne.io/fyne/v2/app"
"fyne.io/fyne/v2/widget"
"fyne.io/fyne/v2/container"
)
func main() {
a := app.New()
w := a.NewWindow("Hello")
hello := widget.NewLabel("Hello World!")
w.SetContent(container.NewVBox(
hello,
widget.NewButton("Button", func() {
hello.SetText("Merry Christmas!")
}),
widget.NewButton("Quit", func() {
a.Quit()
}),
))
w.ShowAndRun()
}
これを実行すると、ボタンが1つ増えました。新しく追加されたQuit
ボタンを押したらウィンドウが消えました。
オブジェクトを表示したり消したりする
まずは、以下のような変数を定義します。Hello Worldの時に定義したNewLabel()と似て新たなテキストオブジェクトを定義できますが、canvasを使えば、オブジェクトの色を変えたり、オブジェクトを動かしたり、オブジェクトに対して様々な操作を行うことができます。
text := canvas.NewText("Mele Kalikimaka", color.RGBA{255, 0, 0, 255});
そして、SetContentの中に以下を追加します。Visible()で対象のオブジェクトが現在、画面に表示されているか確認することができます。オブジェクトが表示されている時は、Hide()でオブジェクトを非表示にし、表示されていない時はShow()でオブジェクトを表示します。
text,
widget.NewButton("ON/OFF", func() {
if text.Visible() {
text.Hide()
} else {
text.Show()
}
}),
全体像
package main
import (
"fyne.io/fyne/v2/app"
"fyne.io/fyne/v2/widget"
"fyne.io/fyne/v2/container"
"fyne.io/fyne/v2/canvas"
"image/color"
)
func main() {
a := app.New()
w := a.NewWindow("Hello")
hello := widget.NewLabel("Hello World!")
text := canvas.NewText("Mele Kalikimaka", color.RGBA{255, 0, 0, 255});
w.SetContent(container.NewVBox(
hello,
text,
widget.NewButton("ON/OFF", func() {
if text.Visible() {
text.Hide()
} else {
text.Show()
}
}),
widget.NewButton("Button", func() {
hello.SetText("Merry Christmas!")
}),
widget.NewButton("Quit", func() {
a.Quit()
}),
))
w.ShowAndRun()
}
上の状態でON/OFF
ボタンを押すと、Mele Kalikimaka
という文字が消えました。
そして、もう一度ON/OFF
ボタンを押すと、Mele Kalikimaka
が再び表示されました。
まとめ
Fyneを使いこなせれば、ゲームやメモアプリなど、様々なGUIアプリを作れるようです。以下のサイトでは、Fyneを使った様々なアプリが提供されています。
https://apps.fyne.io/all
今回は初歩的な部分しか触れていませんが、また時間があるときにもっとFyneを触ってみたいと思います。