go-gtk3开发之GtkBuilder使用XML构建UI(6)

引用

传送门：go-gtk3开发之GtkBuilder使用XML构建UI

案例说明

在这节我将介绍GtkBuilder，其使我们可以从一个描述界面的xml文件构建UI。
而这个文件我们可以使用Glade生成，这会极大的方便我们编辑用户界面。
这节我们会使用到这么一个XML文件，名字为builder.ui(可以在本文后面看到，请创建并放在项目下)。
习惯上，我们使用.ui作为扩展名。
后面的案例都将使用builder.ui创建界面.

目录结构

➜  GTK3 tree ./
./

├── 1_空白窗口
│   └── demo.go
├── 2_显示一个按钮
│   └── demo.go
├── 3_Grid布局
│   └── demo.go
├── 4_GtkBuilder使用XML构建UI
│   ├── builder.ui
│   └── demo.go
├── 5_窗口
│   ├── builder.ui
│   └── demo.go
├── 6_标签
│   ├── builder.ui
│   └── demo.go
├── 7_图片控件
│   ├── builder.ui
│   └── demo.go
├── 8_进度条
│   ├── builder.ui
│   └── demo.go
├── 9_按钮
│   ├── builder.ui
│   └── demo.go
├── 10_行编辑
│   ├── builder.ui
│   └── demo.go
├── 11_水平布局
│   ├── builder.ui
│   └── demo.go
├── 12_垂直布局
│   ├── builder.ui
│   └── demo.go
├── 13_表格布局
│   ├── builder.ui
│   └── demo.go
├── 14_对话框
│   ├── builder.ui
│   └── demo.go
├── 15_定时器
│   ├── builder.ui
│   ├── demo2.go
│   ├── demo3.go
│   └── demo.go
├── 16_鼠标事件
│   ├── builder.ui
│   └── demo.go
├── 17_窗口移动
│   ├── builder.ui
│   └── demo.go
├── 18_键盘事件
│   ├── builder.ui
│   └── demo.go
├── 19_大小改变事件
│   ├── builder.ui
│   └── demo.go
├── 20_绘图事件
│   ├── builder.ui
│   └── demo.go
├── 21_无边框鼠标移动
│   ├── builder.ui
│   └── demo.go
├── go.mod
├── go.sum
└── images
    ├── app.ico
    └── icons8-youtube.png

demo.go

package main

import (
	"github.com/gotk3/gotk3/glib"
	"github.com/gotk3/gotk3/gtk"
	"log"
	"os"
)

func main() {
	const appId = "com.nayoso.example"

	app, _ := gtk.ApplicationNew(appId, glib.APPLICATION_FLAGS_NONE)
	_, err := app.Connect("activate", func() {
		createWindow(app)
	})
	if err != nil {
		log.Fatal(err)
	}

	app.Run(os.Args)
}

/*
func createWindow(application *gtk.Application) {
	if builder, err := gtk.BuilderNewFromFile("3_GtkBuilder使用XML构建UI/builder.ui"); err != nil { //从文件中创建Builder
		log.Fatal(err)
	} else if winObj, err := builder.GetObject("window"); err != nil { //从文件中读取window对象，其实际上是Gobject
		log.Fatal(err)
	} else {
		window := winObj.(*gtk.Window) //由于winObj是Gobject，所以我们使用类型断言得到Gtk.Window对象
		application.AddWindow(window)  //记得将window加入我们的application中

		window.ShowAll()
	}
}
*/

func createWindow(application *gtk.Application) {
	// 从文件中创建Builder
	builder, err := gtk.BuilderNewFromFile("4_GtkBuilder使用XML构建UI/builder.ui")
	if err != nil {
		log.Fatal(err)
	}

	// 从文件中读取window对象，其实际上是Gobject
	winObj, err := builder.GetObject("window")
	if err != nil {
		log.Fatal(err)
	}

	//由于winObj是Gobject，所以我们使用类型断言得到Gtk.Window对象
	window := winObj.(*gtk.Window)

	//记得将window加入我们的application中
	application.AddWindow(window)

	// 显示所有界面
	window.ShowAll()
}

builder.ui

<interface>
    <object id="window" class="GtkWindow">
        <property name="visible">True</property>
        <property name="title">Grid</property>
        <property name="border-width">10</property>
        <child>
            <object id="grid" class="GtkGrid">
                <property name="visible">True</property>
                <child>
                    <object id="button1" class="GtkButton">
                        <property name="visible">True</property>
                        <property name="label">Button 1</property>
                    </object>
                    <packing>
                        <property name="left-attach">0</property>
                        <property name="top-attach">0</property>
                    </packing>
                </child>
                <child>
                    <object id="button2" class="GtkButton">
                        <property name="visible">True</property>
                        <property name="label">Button 2</property>
                    </object>
                    <packing>
                        <property name="left-attach">1</property>
                        <property name="top-attach">0</property>
                    </packing>
                </child>
                <child>
                    <object id="quit" class="GtkButton">
                        <property name="visible">True</property>
                        <property name="label">Quit</property>
                    </object>
                    <packing>
                        <property name="left-attach">0</property>
                        <property name="top-attach">1</property>
                        <property name="width">2</property>
                    </packing>
                </child>
            </object>
            <packing>
            </packing>
        </child>
    </object>
</interface>