圖形使用者介面2:常用控制元件
認識幾種常用控制元件
- 按鈕
- 選單
- 工具欄
- 介面佈局
- 列表
- 顯示圖片
匯入依賴
import (
"github.com/lxn/walk"
. "github.com/lxn/walk/declarative"
"os"
"strings"
"io/ioutil"
"fmt"
"log"
)
定義全域性資料
// 全域性應用的選單項
var myAction *walk.Action
//自定義的主視窗
var myWindow *MyMainWindow
//自定義視窗
type MyMainWindow struct {
*walk.MainWindow
te *walk.TextEdit
//listbox使用的資料
model *EnvModel
//listbox控制元件
listBox *walk.ListBox
}
定義列表資料模型
//環境變數條目資料模型
type EnvItem struct {
//環境變數的名字和值
name string
value string
}
//列表資料模型
type EnvModel struct {
//繼承ListModelBase
walk.ListModelBase
//環境變數數集合
items []EnvItem
}
//列表資料模型的工廠方法
func NewEnvModel() *EnvModel {
env := os.Environ()
m := &EnvModel{items: make([]EnvItem, len(env))}
for i, e := range env {
j := strings.Index(e, "=")
if j == 0 {
continue
}
name := e[0:j]
value := strings.Replace(e[j+1:], ";", "\r\n", -1)
m.items[i] = EnvItem{name, value}
}
return m
}
定義列表相關的監聽和系統回撥介面
//定義列表專案的單擊監聽
func (mw *MyMainWindow) lb_CurrentIndexChanged() {
i := mw.listBox.CurrentIndex()
item := &mw.model.items[i]
mw.te.SetText(item.value)
fmt.Println("CurrentIndex: ", i)
fmt.Println("CurrentEnvVarName: ", item.name)
}
//定義列表專案的雙擊監聽
func (mw *MyMainWindow) lb_ItemActivated() {
value := mw.model.items[mw.listBox.CurrentIndex()].value
walk.MsgBox(mw, "Value", value, walk.MsgBoxIconInformation)
}
//列表的系統回撥方法:獲得listbox的資料長度
func (m *EnvModel) ItemCount() int {
return len(m.items)
}
//列表的系統回撥方法:根據序號獲得資料
func (m *EnvModel) Value(index int) interface{} {
return m.items[index].name
}
定義普通事件回撥
//顯示訊息視窗
func ShowMsgBox(title, msg string) int {
return walk.MsgBox(myWindow, "天降驚喜", "你老婆跟人跑了!", walk.MsgBoxOK)
}
//一個普通的事件回撥函式
func TiggerFunc() {
ShowMsgBox("天降驚喜", "你老婆跟人跑了!")
}
主調函式
func main() {
defer func() {
if err := recover(); err != nil {
errMsg := fmt.Sprintf("%#v", err)
ioutil.WriteFile("fuck.log", []byte(errMsg), 0644)
}
}()
myWindow = &MyMainWindow{model: NewEnvModel()}
if _, err := (MainWindow{
AssignTo: &myWindow.MainWindow,
Title: "常用控制元件",
//視窗選單
MenuItems: []MenuItem{
//主選單一
Menu{
Text: "川菜",
//選單項
Items: []MenuItem{
//選單項一
Action{
AssignTo: &myAction,
Text: "魚香肉絲",
//選單圖片
Image: "img/open.png",
//快捷鍵
Shortcut: Shortcut{walk.ModControl, walk.KeyO},
OnTriggered: func() {
ShowMsgBox("已下單", "我是選單項")
},
},
//分隔線
Separator{},
//選單項二
Action{
//文字
Text: "水煮魚",
//響應函式
OnTriggered: func() {
ShowMsgBox("已下單", "您要的菜馬上就去買")
},
},
},
},
//主選單二
Menu{
Text: "粵菜",
//選單項
Items: []MenuItem{
//選單項一
Action{
Text: "魚香肉絲",
//選單圖片
Image: "img/open.png",
//快捷鍵
Shortcut: Shortcut{walk.ModControl, walk.KeyO},
OnTriggered: func() {
ShowMsgBox("已下單", "我是選單項")
},
},
//分隔線
Separator{},
//選單項二
Action{
//文字
Text: "水煮魚",
//響應函式
OnTriggered: func() {
ShowMsgBox("已下單", "您要的菜馬上就去買")
},
},
},
},
},
//工具欄
ToolBar: ToolBar{
//按鈕風格:圖片在字的前面
ButtonStyle: ToolBarButtonImageBeforeText,
//工具欄中的工具按鈕
Items: []MenuItem{
//引用現成的Action
ActionRef{&myAction},
Separator{},
//自帶子選單的工具按鈕
Menu{
//工具按鈕本身的圖文和監聽
Text: "工具按鈕2",
Image: "img/document-properties.png",
OnTriggered: TiggerFunc,
//附帶一個子選單
Items: []MenuItem{
Action{
Text: "X",
OnTriggered: TiggerFunc,
},
Action{
Text: "Y",
OnTriggered: TiggerFunc,
},
Action{
Text: "Z",
OnTriggered: TiggerFunc,
},
},
},
Separator{},
//普通工具按鈕
Action{
Text: "工具按鈕3",
Image: "img/system-shutdown.png",
OnTriggered: func() {
ShowMsgBox("天降驚喜", "你老婆跟人跑了!")
},
},
},
},
MinSize: Size{600, 400},
Layout: VBox{},
//控制元件們
Children: []Widget{
//水平區域性
HSplitter{
MinSize: Size{600, 300},
Children: []Widget{
ListBox{
StretchFactor: 1,
//賦值給myWindow.listBox
AssignTo: &myWindow.listBox,
//要顯示的資料
Model: myWindow.model,
//單擊監聽
OnCurrentIndexChanged: myWindow.lb_CurrentIndexChanged,
//雙擊監聽
OnItemActivated: myWindow.lb_ItemActivated,
},
TextEdit{
StretchFactor: 1,
AssignTo: &myWindow.te,
ReadOnly: true,
},
},
},
HSplitter{
MaxSize:Size{600,50},
Children: []Widget{
//影象
ImageView{
Background: SolidColorBrush{Color: walk.RGB(255, 191, 0)},
//圖片檔案位置
Image: "img/open.png",
//和四周的邊距
Margin: 5,
//定義最大拉伸尺寸
MinSize: Size{50, 50},
//顯示模式
Mode: ImageViewModeZoom,
},
//按鈕
PushButton{
StretchFactor:8,
Text: "摸我有驚喜",
OnClicked: func() {
ShowMsgBox("天降驚喜", "你老婆跟人跑了!")
},
},
},
},
},
}.Run()); err != nil {
log.Fatal(err)
}
}
學院Go語言視訊主頁
https://edu.csdn.net/lecturer/1928
[清華團隊帶你實戰區塊鏈開發]
(https://ke.qq.com/course/344443?tuin=3d17195d)
掃碼獲取海量視訊及原始碼 QQ群:721929980
相關文章
- 26 使用者圖形介面
- GO-圖形使用者介面Go
- JavaGUI——Java圖形使用者介面JavaGUI
- 圖形使用者介面1:初識Walk
- 課時35:圖形使用者介面入門
- Android使用者介面之常用控制元件RadioGroup、CheckBox 2018/8/10Android控制元件
- XAML常用控制元件2控制元件
- Python常用的圖形介面程式設計框架,你知道幾個?Python程式設計框架
- Matlab圖形使用者介面程式設計初級入門Matlab程式設計
- 使用SCRT+XMING 圖形介面
- 07圖形化介面和命令列介面操作命令列
- Ubuntu18.04中設定使用root使用者登入圖形介面Ubuntu
- Python學習之Web開發及圖形使用者介面模組!PythonWeb
- Android常用控制元件-BannerView(無限輪播圖控制元件)Android控制元件View
- MySQL常用圖形管理工具MySql
- XManager:xshell顯示圖形化介面
- Ubuntu無法進入圖形介面Ubuntu
- WSL安裝及配置圖形介面
- Linux7 圖形介面的切換Linux
- 002.02 Tkinter 圖形介面之文字範例
- Ubuntu 16.04無法登入圖形介面Ubuntu
- 阿里雲centos安裝圖形化介面阿里CentOS
- Linux ubuntu命令列安裝圖形介面LinuxUbuntu命令列
- oracle linux 7 安裝圖形化介面OracleLinux
- Qt-跨平臺的C++圖形使用者介面應用程式框架(一)QTC++框架
- Windows10 WSL2 Ubuntu 圖形介面環境搭建(Xfce4 、XServer)WindowsUbuntuServer
- 3 個 Linux 上的 SSH 圖形介面工具Linux
- esxi伺服器進圖形化介面配置伺服器
- 圖形介面的TCP/IP簡單通訊TCP
- (grid重灌後圖形介面報錯)ASM磁碟組字元介面配置ASM字元
- Python入門教程100天:Day10-圖形使用者介面和遊戲開發Python遊戲開發
- 資料視覺化常用圖形都有哪些(一)視覺化
- 資料視覺化常用圖形都有哪些(二)視覺化
- 資料視覺化常用圖形都有哪些(三)視覺化
- 資料視覺化常用圖形都有哪些(四)視覺化
- GoJS互動式圖形庫常用的方法(二)GoJS
- Linux中 文字介面、X Window系統以及圖形介面的關係Linux
- linux系統中firewalld防火牆管理工具firewall-config(GUI圖形使用者介面)Linux防火牆GUI