常用控件集合

本章介紹并學(xué)習(xí)路線中彈窗之前（包含彈窗）的所有控件

一、認(rèn)識控件

本章將要學(xué)習(xí)的控件列表如下圖所示，逐一講解使用方法；

二、預(yù)備知識

2.1 控件結(jié)構(gòu)體中通用字段

• AssignTo ：綁定該控件類型指針，目的是后續(xù)業(yè)務(wù)中可以控制該控件屬性；
• ToolTipText ：作用是當(dāng)鼠標(biāo)移到該控件時(shí)，會浮窗顯示提示信息；

三、控件使用

3.1 TextLabel

TextLabel{AssignTo: &myMain.TextLabel,Text: "我是文本標(biāo)簽", },

3.2 TextEdit

TextEdit{AssignTo: &myMain.TextEdit,Text: "我是文本框",ReadOnly: false, // false:文本框只讀 true:文本框可讀可寫ColumnSpan: 9, },

3.3 Label

Label{AssignTo: &myMain.Label,Text: "我是標(biāo)簽", },

3.4 NumberLabel

NumberLabel{AssignTo: &myMain.NumberLabel,Value: float64(521), //警告：這里給的默認(rèn)值，一定要強(qiáng)轉(zhuǎn)為int64，否則NumberLabel.Create時(shí)，斷言失敗就是0了。 },

3.5 NumberEdit

NumberEdit{AssignTo: &myMain.NumberEdit,Value: float64(10), //警告：這里給的默認(rèn)值，一定要強(qiáng)轉(zhuǎn)為int64，否則NumberLabel.Create時(shí)，斷言失敗就是0了。 },

3.6 LineEdit

LineEdit{AssignTo: &myMain.LineEdit,Text: "我是行編輯",TextColor: walk.Color(walk.RGB(100, 100, 100)),Enabled: true, // false:文本框只讀 true:文本框可讀可寫PasswordMode: true, //可選，輸入內(nèi)容后密文，顯示******MaxLength: 5, //設(shè)置最大輸入字符數(shù)TextColor:walk.RGB(218, 8, 9),//設(shè)置文本顏色ReadOnly: true,//設(shè)置文本只讀 }, // 獲取輸入框內(nèi)容 myMain.LineEdit.Text()

3.7 CheckBox

CheckBox{AssignTo: &myMain.CheckBox,Text: "復(fù)選框",ToolTipText: "單選、復(fù)選框",Checked: true, //注意：true 默認(rèn)選中，false:默認(rèn)未選 }, // 在事件觸發(fā)接口中，實(shí)現(xiàn)多個(gè)單選框使用時(shí)邏輯： func OK_Clicked() {switch {case myMain.CheckBox_english.Checked():le.SetText("英語系")case myMain.CheckBox_sport.Checked():le.SetText("體育系")case myMain.CheckBox_maths.Checked():le.SetText("數(shù)學(xué)系")} }

3.8 PushButton

PushButton{Text: "按鈕",OnClicked: func() {walk.MsgBox(nil, "我是彈框", "測試button", walk.MsgBoxIconInformation)// 此處實(shí)現(xiàn)你想要做的業(yè)務(wù)// ......}, },

3.9 ComboBox

第一種，簡單用法，默認(rèn)顯示選中蘋果 ComboBox{AssignTo: &myMain.ComboBox,Model: []string{"蘋果", "草莓", "香蕉"}, //下拉菜單數(shù)據(jù)源CurrentIndex: 0, // 默認(rèn)顯示model數(shù)據(jù)的索引// 選中下拉菜單中某個(gè)選項(xiàng)時(shí)觸發(fā)OnCurrentIndexChanged: func() {// 打印最新索引idlogger.Println(myMain.ComboBox.CurrentIndex())}, }, 第二種，綁定數(shù)據(jù) animal := new(Animal) Composite{DataBinder: DataBinder{AssignTo: &db,Name: "animal",DataSource: animal,ErrorPresenter: ToolTipErrorPresenter{},},Layout: Grid{Columns: 2},Children: []Widget{ComboBox{// 和DataBinder.DataSource字段關(guān)聯(lián)，當(dāng)前則是關(guān)聯(lián)animal.SpeciesId字段，即選擇下拉菜單中id對應(yīng)值刷新到DataBinder.DataSource字段中// SelRequired{} 作用是約束該選項(xiàng)不允許為空，否則會強(qiáng)制提示；Value: Bind("SpeciesId", SelRequired{}), BindingMember: "Id", // 綁定數(shù)據(jù)字段名(和Model字段關(guān)聯(lián))DisplayMember: "Name", // 顯示數(shù)據(jù)字段名(和Model字段關(guān)聯(lián))Model: KnownSpecies(),},PushButton{AssignTo: &acceptPB,Text: "OK",// 手動更新綁定數(shù)據(jù)，點(diǎn)擊OK按鈕時(shí)才更新OnClicked: func() {walk.MsgBox(nil, "修改前", fmt.Sprintf("%+v", animal), walk.MsgBoxIconInformation)// 此處手動提交更新綁定數(shù)據(jù)if err := db.Submit(); err != nil {log.Print(err)return}walk.MsgBox(nil, "結(jié)果", fmt.Sprintf("%+v", animal), walk.MsgBoxIconInformation)},},}, },type Animal struct {Name stringArrivalDate time.TimeSpeciesId intSpeed intSex SexWeight float64PreferredFood stringDomesticated boolRemarks stringPatience time.Duration }type Species struct {Id intName string } func KnownSpecies() []*Species {return []*Species{{1, "Dog"},{2, "Cat"},{3, "Bird"},{4, "Fish"},{5, "Elephant"},} }

3.10 RadioButton

RadioButton{AssignTo: &myMain.RadioButton,Text: "單選按鈕",ToolTipText: "單選按鈕", },

3.11 RadioButtonGroup

// 首先定義該按鈕要綁定的數(shù)據(jù)結(jié)構(gòu) type Fool struct {Bar stringBaz int } // 聲明一個(gè)變量 fooBox := Fool{"box", 0} Composite{Layout: HBox{},DataBinder: DataBinder{DataSource: &foo, // 變量名 此處必須是指針Name: "foo",// 變量名AutoSubmit: true,// 自動提交，意思是選中后，變量fooBox.Baz 字段值會自動更新；// 每次操作選中后，自動觸發(fā)該接口調(diào)用，所以對應(yīng)業(yè)務(wù)就可以在這里實(shí)現(xiàn)，案例中只是打印了變量內(nèi)容；OnSubmitted: func() {logger.Printf("foo:%v", foo)},},Children: []Widget{RadioButtonGroup{DataMember: "Baz",//指定綁定變量中的字段名，和上面的DataBinder是配套的；Buttons: []RadioButton{RadioButton{Name: "oneRB",Text: "one", //界面顯示的選項(xiàng)名Value: 1, // 選擇選項(xiàng)后的值，此處綁定的是fooBox.Baz字段值},RadioButton{Name: "twoRB",Text: "two",Value: 2,},RadioButton{Name: "threeRB",Text: "three",Value: 3,},},},}, },

3.12 RadioButtonGroupBox

用法邏輯：
??????? 1. 根據(jù)業(yè)務(wù)創(chuàng)建自己的結(jié)構(gòu)體，例如
?????????????????type Fool struct
????????????????????????Bar string
????????????????????????Baz int
?????????????????}
???????2. 創(chuàng)建一個(gè)結(jié)構(gòu)體變量fooBox ；
???????3. 將該結(jié)構(gòu)體變量中的字段和按鈕進(jìn)行綁定，比如Baz字段；
???????4.當(dāng)點(diǎn)擊按鈕選中時(shí)，變量fooBox 的字段值就會被更新；

// 首先定義該按鈕要綁定的數(shù)據(jù)結(jié)構(gòu) type Fool struct {Bar stringBaz int } // 聲明一個(gè)變量 fooBox := Fool{"box", 0} // 創(chuàng)建控件 Composite{Layout: HBox{},// 綁定數(shù)據(jù)DataBinder: DataBinder{DataSource: &fooBox, //變量名，此處必須是指針Name: "fooBox",//變量名AutoSubmit: true, //自動提交，意思是選中后，變量fooBox.Baz 字段值會自動更新；// 每次操作選中后，自動觸發(fā)該接口調(diào)用，所以對應(yīng)業(yè)務(wù)就可以在這里實(shí)現(xiàn)，案例中只是打印了變量內(nèi)容；OnSubmitted: func() {logger.Printf("foo:%v", fooBox)},},Children: []Widget{RadioButtonGroupBox{Title: "box",//組框的名稱，界面會顯示Layout: HBox{},DataMember: "Baz", //指定綁定變量中的字段名，和上面的DataBinder是配套的；Buttons: []RadioButton{{Text: "Male", Value: 5},// Text按鈕名稱，Value按鈕對應(yīng)點(diǎn)擊后的值{Text: "Female", Value: 6},{Text: "Hermaphrodite", Value: 7},},},}, },

3.13 TableView

追加：表格記錄右鍵子菜單功能

mdTableView := NewStudentModel() Composite{Layout: HBox{},// 該節(jié)點(diǎn)作用是添加表格右鍵子菜單ContextMenuItems: []MenuItem{Action{Text: "I&nfo",// OnTriggered: mw.tv_ItemActivated,},Action{Text: "E&xit",OnTriggered: func() {//此處實(shí)現(xiàn)邏輯// mw.Close()},},},Children: []Widget{TableView{AssignTo: &myMain.TableView,ToolTipText: "表格數(shù)據(jù)",ColumnsOrderable: true, // 列支持排序MultiSelection: true, // 可以同時(shí)選中多行// 表格內(nèi)容列Columns: []TableViewColumn{{Title: "序號"},{Title: "姓名"},{Title: "年齡"},{Title: "錄入時(shí)間", Width: 200}},//可單獨(dú)指定某列寬度Model: mdTableView,//綁定數(shù)據(jù)源},}, },type StudentInfo struct {SeqNo int // 序號Name string // 名字Age int // 年齡CreateTime string // 錄入時(shí)間checked bool //是否被選中，下面SetChecked接口調(diào)用時(shí)設(shè)置 }type StudentModel struct {walk.TableModelBasewalk.SorterBasesortColumn intsortOrder walk.SortOrderitems []*StudentInfo // 存放數(shù)據(jù)，后續(xù)通過修改該字段內(nèi)容，實(shí)現(xiàn)界面的數(shù)據(jù)刷新 }func NewStudentModel() *StudentModel {m := new(StudentModel)m.ResetRows()return m }// 用戶自己定義的，生成測試數(shù)據(jù) func (m *StudentModel) ResetRows() {m.items = make([]*StudentInfo, 10, 20)// 注意，這里一定不能寫成m.items = make([]*StudentInfo, 20)，否則會panic，除了當(dāng)前寫法，也可以把for循環(huán)長度改為20即可for i := 0; i < 10; i++ {m.items[i] = &StudentInfo{i, "xiaoming", i + 2, "2020-10-10 10:10:10", false}}m.PublishRowsReset() //手動觸發(fā)界面刷新，數(shù)據(jù)變更時(shí)根據(jù)需要調(diào)用。 }// 控件刷新時(shí)調(diào)用 func (m *StudentModel) RowCount() int {logger.Println("len:", len(m.items), cap(m.items))return len(m.items) }// 當(dāng)TableView需要為給定單元格顯示文本時(shí)，由TableView調(diào)用 func (m *StudentModel) Value(row, col int) interface{} {item := m.items[row]switch col {case 0:return item.SeqNocase 1:return item.Namecase 2:return item.Agecase 3:return item.CreateTime}panic("unexpected col") }// 由TableView調(diào)用以檢索是否選中了給定行。 func (m *StudentModel) Checked(row int) bool {return m.items[row].checked }// 當(dāng)用戶切換給定行的復(fù)選框時(shí)由TableView調(diào)用 func (m *StudentModel) SetChecked(row int, checked bool) error {m.items[row].checked = checkedreturn nil }// 由TableView調(diào)用以對模型進(jìn)行排序 func (m *StudentModel) Sort(col int, order walk.SortOrder) error {logger.Println("sort..............", m.items)return nil }

3.14 ListBox

listBoxMd := NewEnvModel() ListBox{AssignTo: &myMain.ListBox,ToolTipText: "列表控件",Model: listBoxMd,OnItemActivated: func() {name := listBoxMd.items[myMain.ListBox.CurrentIndex()].namevalue := listBoxMd.items[myMain.ListBox.CurrentIndex()].valuewalk.MsgBox(nil, name, value, walk.MsgBoxIconInformation)}, }, type EnvModel struct {walk.ListModelBaseitems []EnvItem } type EnvItem struct {name stringvalue string }func NewEnvModel() *EnvModel {// 初始化列表內(nèi)容，此處功能時(shí)讀取電腦環(huán)境變量，將名字以列表形式顯示，單據(jù)某條時(shí)，彈出對應(yīng)的環(huán)境變量；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 }// 獲取節(jié)點(diǎn)數(shù)，即有多少條數(shù)據(jù)，由ListBox調(diào)用 func (m *EnvModel) ItemCount() int {return len(m.items) }// 顯示每一行時(shí)由ListBox調(diào)用 func (m *EnvModel) Value(index int) interface{} {if m.items[index].name == "" {return "null"}return m.items[index].name }

3.15 Slider

// 當(dāng)前實(shí)現(xiàn)的是，拖動滑動條，在指定NumberEdit控件中顯示實(shí)時(shí)數(shù)據(jù) Slider{AssignTo: &myMain.Slider,ToolTipText: "滑動條",MaxValue: 1000, // 滑動條最大值MinValue: 0, // 滑動條最小值Orientation: Horizontal, // 滑動條方向，垂直或者水平，當(dāng)前水平// 點(diǎn)擊某一個(gè)位置時(shí)觸發(fā)OnValueChanged: func() {v := myMain.Slider.Value()myMain.NumberEdit.SetValue(float64(v))},// 拖動滑動條過程即觸發(fā)OnMouseMove: func(x, y int, button walk.MouseButton) {v := myMain.Slider.Value()myMain.NumberEdit.SetValue(float64(v))}, },

3.16 StatusBarItem

StatusBarItem{AssignTo: &myMain.StatusBarItem,Icon: icon1, // 可選 顯示圖標(biāo) Text: "click", // 顯示名字Width: 80, // 寬度//點(diǎn)擊該狀態(tài)欄是，圖標(biāo)來回切換OnClicked: func() {if myMain.StatusBarItem.Text() == "click" {myMain.StatusBarItem.SetText("again")myMain.StatusBarItem.SetIcon(icon2)} else {myMain.StatusBarItem.SetText("click")myMain.StatusBarItem.SetIcon(icon1)}}, }, StatusBarItem{Text: "left",ToolTipText: "no tooltip for me", }, StatusBarItem{Text: "\tcenter", }, StatusBarItem{Text: "\t\tright", }, StatusBarItem{Icon: icon1,ToolTipText: "An icon with a tooltip", },

總結(jié)

以上是生活随笔為你收集整理的教程二：go语言windows gui界面开发之walk 控件学习第一节的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。