X11   Fyne テーマ

ホーム

テーマ アプリの作成

fyne は、Windows ではライトテーマになり、macOS と Linux ではダークテーマになります。 今回はそのテーマを切り替えるアプリを作ります。

Fyne は一つのアプリケーションを一つディレクトリにまとめることになっています。 今回は Theme とうディレクトリにまとめることにします。 場所はどこでも構わないのですが、私はホームディレクトリに Documets というディレクトリを作り、その中に fyne というディレクトリを作り、そしてその中に、 Theme ディレクトリを作りました。 今後はその Theme ディレクトリでの作業になります。

Theme ディレクトリに移動し、次のようにコマンドして、 Fyne アプリケーションの初期設定を行います。 次のコマンドで初期内容は自動で設定されます。

go mod init example.com/Theme

// 通常は、example.com の部分を、あなたが持っているURLにします。
// URL をお持ちでない場合は、example.com などで大丈夫です。
// もし URL をお持ちなら、あなたさえ同じ名前のアプリケーションを作らなければ、
// 世界で、一つだけのアプケーション ID が生成されることになります。
// デフォルトでは、スラッシュ(/)の次の名前がアプリの名前になります。
    

Theme ディレクトリに、theme.go というファイルを作り、次のように記述します。 main 関数を記述しているファイルは、 main.go とするのが一般的ですが、 好きなファイル名にしても大丈夫です。

theme.go

package main

import (
	"fyne.io/fyne/v2"
	"fyne.io/fyne/v2/app"
	"fyne.io/fyne/v2/container"
	"fyne.io/fyne/v2/layout"
	"fyne.io/fyne/v2/theme"
	"fyne.io/fyne/v2/widget"
	"fyne.io/fyne/v2/driver/desktop"
)

func main() {
	app := app.New()
	win := app.NewWindow("Theme")
	label := widget.NewLabel("Theme")
	dark := widget.NewButton("Dark",
		func() {
			app.Settings().SetTheme(theme.DarkTheme())
		})
	light := widget.NewButton("Lignt",
		func() {
			app.Settings().SetTheme(theme.LightTheme())
		})
	quit := widget.NewButton("Quit",
		func() { app.Quit() })
	box := container.New(layout.NewHBoxLayout(),
		dark, light, layout.NewSpacer(), quit)
	content := container.New(layout.NewBorderLayout(box, nil, nil, nil),
		box, container.New(layout.NewCenterLayout(), label))
	win.SetContent(content)
	win.Canvas().SetOnTypedKey(func(e *fyne.KeyEvent) {
		switch e.Name {
		case fyne.KeyD:
			app.Settings().SetTheme(theme.DarkTheme())
		case fyne.KeyL:
			app.Settings().SetTheme(theme.LightTheme())
		}
	})
	win.Canvas().AddShortcut(
		&desktop.CustomShortcut{
			KeyName:  fyne.KeyQ,
			Modifier: desktop.ControlModifier,
		}, func(s fyne.Shortcut) { app.Quit() },
	)
	win.Resize(fyne.NewSize(400, 200))
	win.CenterOnScreen()
	win.ShowAndRun()
}
	

フォーマットの整形

Theme ディレクトリに戻り、次のようにコマンドすると、記述した go ファイルを正しいインデントや改行に整形してくれます。また完全にではありませんが、 記述エラーも検出してくれるみたいです。

go fmt theme.go

// theme.go とだけ表示されなければ、この段階では問題ありません。
theme.go
    

パッケージの追加

今の段階で、theme.go を実行しようとすると、パッケージの追加を促されます。

// 実行してみる
go run theme.go

// 次のようにパッケージの追加を促されます
theme.go:4:2: no required module provides package fyne.io/fyne/v2; to add it:
	go get fyne.io/fyne/v2
theme.go:5:2: no required module provides package fyne.io/fyne/v2/app; to add it:
	go get fyne.io/fyne/v2/app
theme.go:6:2: no required module provides package fyne.io/fyne/v2/container; to add it:
	go get fyne.io/fyne/v2/container
theme.go:7:2: no required module provides package fyne.io/fyne/v2/layout; to add it:
	go get fyne.io/fyne/v2/layout
theme.go:8:2: no required module provides package fyne.io/fyne/v2/theme; to add it:
	go get fyne.io/fyne/v2/theme
theme.go:9:2: no required module provides package fyne.io/fyne/v2/widget; to add it:
	go get fyne.io/fyne/v2/widget
theme.go:10:2: no required module provides package fyne.io/fyne/v2/dirver/desktop; to add it:
	go get fyne.io/fyne/v2/driver/desktop

// 指示のとおりパッケージを追加します。
go get fyne.io/fyne/v2
go get fyne.io/fyne/v2/app
go get fyne.io/fyne/v2/container
go get fyne.io/fyne/v2/layout
go get fyne.io/fyne/v2/theme
go get fune.io/fyne/v2/widget
go get fyne.io/fyen/v2/driver/desktop
	

この追加したパッケージは、そのアプリケーションだけに有効で、 アプリケーションを作るたびに、追加するパッケージが要求されます。 追加するパッケージは、アプリケーションによって違います。

実行

実際に実行する場合は、X11 が必要なので、次のようにコマンドします。

go run theme.go & X -retro
	

Dark ボタンをクリックするか D キーを押すと、テーマがダークになります。

Light ボタンをクリックするか L キーを押すと、テーマがライトになります。

Quit ボタンをクリックするか Ctrl + Q を押すと、 Theme アプリが終了します。

X11 ではウィンドウのフレーム（タイトルバーやリサイズする機能）は付きません。

theme.go のコードに間違いがあった場合でも、X11 は起動しますが、 Theme アプリケーションは起動しません。

終了

Quit ボタンをクリックすると、Theme アプリケーションは終了しますが、 X11 を終了するには次のようにします。

// 次のコマンドで X11 の画面が閉じます
 Ctrl + Alt + F1
 
 // F1 のところは、X11 を起動したコンソールの番号に合わせt、F1、F2、F3 と変えていきます
 // ほとんどの場合、コンソール番号 1 からの起動なので、F1 にしました
    
// 画面は閉じても X11 のタスクは起動したままです。次のコマンドで X11 は完全に終了します
Ctrl + C
    

ビルド

Linux ではビルドしたアプリケーションに直接アイコンがつくことはありません。 アイコンは別の方法で登録します。そもそも CentOS MInimal ではアイコンを登録しても 無意味です。しかし Fyne をビルドする時に アイコンファイルがないとビルドできない仕組みになっています。

Fyne で使えるアイコンファイルは png だけです。png ファイルを Fyne がそれぞれの OS のアイコンファイルへ変換してくれます。

アイコンファイルへの URL が分かっていれば、wget でダウンロードすることができます。 あるいは X11 で起動した Firefox でダウンロードすることもできるかもしれません。 試してみましたが、どの場所にダウンロードしたのかまだ見つけられていません。

もしアイコンファイルが用意できなければ、ダミーの PNG ファイルを作ります。

// PNG ファイルを用意できなかった場合は、次のようにしてダミーの PNG ファイルを作ります。
touch leaf.png

// ビルドします。アイコンファイル名は、あなたが用意したファイルの名前です。
fyne package -os linux -icon leaf.png

// Theme ディレクトリに Theme.tar.gz 圧縮ファイルができますので、それを展開します
tar vxzf Theme.tar.gz

// usr というディレクトリが作られ
// usr/local/bin の中に Theme という実行ファイルができます
// usr/local/bin に移動してそこで実行するか
// Theme 実行ファイルを Theme ディレクトリに移動して実行します。

// usr/local/bin へ移動
cd usr/local/bin

// Theme 実行ファイルを Theme ディレクトリへコピー
cp Theme ../../../

// Theme ディレクトリへ移動
cd ../../../

// Theme ディレクトリで Theme 実行ファイルを X11 で実行
./Theme & X -retro
    

補足

Theme 実行ファイルをルートディレクトリの /bin ディレクトリに入れると、 Theme & X -retro だけで起動できるようになります。しかし、/bin ディレクトリにどんな名前の実行ファイルがあるかはっきりしない場合は、 うっかりと上書きしてしまう場合がありますので、あまりおすすめしません。

---

ホーム   目次