Fyne   Slider

ホーム   Goチュートリアル

Slider

この章では、Sliderを使う方法を説明しています。

アプリケーションディレクトリの作成

ターミナルを起動して、次のようにしてアプリケーション作成の下準備をします。 ディレクトリはどこでも構いませんが、Documents などに go か fyne などのディレクトリを作って、さらに次のようにディレクトリを作るのが良いでしょう。

mkdir Slider
cd Slider
go mod init example.com/Slider

// 通常は、example.com の部分を、あなたが持っているURLにします。
// デフォルトでは、スラッシュ(/)の次の名前がアプリの名前になります。
    

コードの記述

次のファイルを記述します。main 関数を記述しているファイルは、 main.go とするのが一般的ですが、好きなファイル名にしても構いません。

slider.go

package main

import (
	"fyne.io/fyne/v2"
	"fyne.io/fyne/v2/app"
	"fyne.io/fyne/v2/canvas"
	"fyne.io/fyne/v2/container"
	"fyne.io/fyne/v2/layout"
	"fyne.io/fyne/v2/widget"
	"image/color"
)

func main() {
	app := app.New()
	win := app.NewWindow("Slider")
	red := widget.NewSlider(0, 255.0)
	red.Orientation = 1
	green := widget.NewSlider(0, 255.0)
	green.Orientation = 1
	blue := widget.NewSlider(0, 255.0)
	blue.Orientation = 1
	R := canvas.NewRectangle(color.RGBA{0xff, 0x00, 0x00, 0xff})
	R.SetMinSize(fyne.NewSize(25, 25))
	G := canvas.NewRectangle(color.RGBA{0x00, 0xff, 0x00, 0xff})
	G.SetMinSize(fyne.NewSize(25, 25))
	B := canvas.NewRectangle(color.RGBA{0x00, 0x00, 0xff, 0xff})
	B.SetMinSize(fyne.NewSize(25, 25))
	rBorder := container.New(layout.NewBorderLayout(R, nil, nil, nil),
		R, red)
	gBorder := container.New(layout.NewBorderLayout(G, nil, nil, nil),
		G, green)
	bBorder := container.New(layout.NewBorderLayout(B, nil, nil, nil),
		B, blue)
	control := container.New(layout.NewHBoxLayout(),
		rBorder, gBorder, bBorder)

	r := uint8(0)
	g := uint8(0)
	b := uint8(0)
	rect := canvas.NewRectangle(color.RGBA{r, g, b, 0xff})
	red.OnChanged = func(f float64) {
		r = uint8(int(f))
		rect.FillColor = color.RGBA{r, g, b, 0xff}
		rect.Refresh()
	}
	green.OnChanged = func(f float64) {
		g = uint8(int(f))
		rect.FillColor = color.RGBA{r, g, b, 0xff}
		rect.Refresh()
	}
	blue.OnChanged = func(f float64) {
		b = uint8(int(f))
		rect.FillColor = color.RGBA{r, g, b, 0xff}
		rect.Refresh()
	}
	content := container.New(layout.NewBorderLayout(nil, nil, nil, control),
		control, rect)
	win.SetContent(content)
	win.Resize(fyne.NewSize(400, 200))
	win.ShowAndRun()
}
	

パッケージの読み込み

コードの記述が完了しましたら、次のようにして実行します。

go run slider.go

// 次のようにパッケージをインストールしてくださいという表示が出ます。
	go get fyne.io/fyne/v2
slider.go:5:2: no required module provides package fyne.io/fyne/v2/app; to add it:
	go get fyne.io/fyne/v2/app
slider.go:6:2: no required module provides package fyne.io/fyne/v2/canvas; to add it:
	go get fyne.io/fyne/v2/canvas
slider.go:7:2: no required module provides package fyne.io/fyne/v2/container; to add it:
	go get fyne.io/fyne/v2/container
slider.go:8:2: no required module provides package fyne.io/fyne/v2/layout; to add it:
	go get fyne.io/fyne/v2/layout
slider.go:9:2: no required module provides package fyne.io/fyne/v2/widget; to add it:
	go get fyne.io/fyne/v2/widget

// 指示のとおりインストールします。
go get fyne.io/fyne/v2
go get fyne.io/fyne/v2/app
go get fyne.io/fyne/v2/canvas
go get fyne.io/fyne/v2/container
go get fyne.io/fyne/v2/layout
go get fune.io/fyne/v2/widget

// もう一度実行してみます。
go run slider.go
    

実行結果

デフォルトでは、Windowsの場合は白いウィンドウ、macOSとLinuxの場合は、 黒いウィンドウになります。

アプリケーションのパッケージ化

アプリケーションのパッケージ化は、ダブルクリックで起動する、 アイコンのついたファイルにすることです。

アイコンを自作するか、次のサイトなどからお気に入りのアイコンをダウンロードします。 大きさは一番大きい 512px のものを、種類は png にします。Fyne では png 形式のファイルしかアイコンに変換できないみたいです

フリーアイコンSVG、PNG、ICO、ICNS

アイコンの準備ができましたら、Form ディレクトリの中に入れます。 そしてターミナルに次のようにコマンドしてパッケージ化します。

fyne package -os darwin -icon leaf.png

// -os のところは、Windows の場合は windows、macOS の場合は darwin、Linux の場合は linux にします。
// -icon のところは、あなたが png ファイルにつけた名前にします。
    

コード説明

コード説明は一旦割愛して、先へ進みます。また戻ってきてコード説明をしたいと思います。

ホーム   Goチュートリアル   目次