[Go語言寫介面]三、使用介面設計器設計視窗，在程式碼中呼叫，背景編輯器的使用

twgh發表於2022-08-27
Go
系列文章：
[Go語言寫介面]一、使用xcgui完成go語言第一個軟體介面 [Go語言寫介面]二、簡單美化視窗，設定視窗圖示，簡單美化資訊框，建立按鈕和註冊事件 Go語言給編譯出來的程式新增圖示和版本資訊 [Go語言寫介面]三、使用介面設計器設計視窗，在程式碼中呼叫，背景編輯器的使用 Go語言Windows GUI庫XCGUI，DirectUI設計思想，高度自定義介面，支援Direct2D硬體加速

請先獲取：

go get github.com/twgh/xcgui

然後到網盤下載xcgui.dll，百度雲 , 藍奏雲

網盤裡有64位的和32位的dll，一般選擇64位的，go編譯的程式預設也是64位的。

xcgui.dll需要和編譯出來的程式放在一起，但每寫一個程式都重複放的話就很麻煩了。

在開發時我建議把xcgui.dll放到C:\Windows\System32目錄下，這樣就不需要每次都把dll和程式放在一起了。

下載介面設計器

左上角檔案→新建專案→介面設計美化-無程式碼檔案，輸入專案名稱，選好存放路徑，點確定。

下面的炫語言那些選項和介面設計無關，那是炫彩介面庫作者自己搞得一門程式語言，不用管。

新建介面設計專案

1.雙擊開啟main.xml

這個就是視窗布局檔案，檔名無所謂，你可以新建多個xml代表多個視窗。

main.xml

2.設定視窗背景

滑鼠左鍵點一下視窗選中它，然後在視窗上點選滑鼠右鍵，在右鍵選單中選擇背景編輯器：

開啟背景編輯器

在背景編輯器中點選新增狀態組，選中整個視窗背景，點確定：

在這裡插入圖片描述
5

滑鼠點選選中藍色矩形方塊，然後再點一下下面的區域，會出現一個深藍色的矩形：

6

點選右邊的鋪滿，然後在上面選擇一種顏色（雙擊顏色可以自定義），最後點修改並關閉：

7

在介面設計器右側有元素列表，點選選中按鈕後，再點選視窗即可新增按鈕元素。

新增一個按鈕後，滑鼠選中按鈕，在右側的元素屬性裡修改按鈕文字和名稱（name）：

8

按下Ctrl+S鍵儲存xml檔案，然後點選介面設計器上方的預覽按鈕，即可預覽介面：

9
10

package main

import (
    "github.com/twgh/xcgui/app"
    "github.com/twgh/xcgui/widget"
    "github.com/twgh/xcgui/window"
)

func main() {
    a := app.New(true)
    // 新增檔案搜尋路徑, 因為main.xml沒有在程式執行目錄
    a.AddFileSearchPath(`D:\GoProject\src\xcguitest\001`)
    // 建立視窗從佈局檔案
    w := window.NewByLayout("main.xml", 0, 0)

    // 獲取視窗布局檔案中的按鈕
    btn := widget.NewButtonByName("btn1")
    // 註冊按鈕被單擊事件
    btn.Event_BnClick(func(pbHandled *bool) int {
        a.Alert("提示", btn.GetText()+"被點選")
        return 0
    })

    // 調整佈局, 必須
    w.AdjustLayout()
    // 顯示視窗
    w.Show(true)
    a.Run()
    a.Exit()
}

點選介面設計器上方的打包按鈕，可以打包為zip檔案，還可以設定密碼，然後點確定。

11

把生成的zip放到go專案目錄裡，然後修改原始碼：

package main

import (
    _ "embed"

    "github.com/twgh/xcgui/app"
    "github.com/twgh/xcgui/widget"
    "github.com/twgh/xcgui/window"
)

//go:embed 001.zip
var zip []byte

func main() {
    a := app.New(true)
    // 建立視窗從記憶體壓縮包中的佈局檔案
    w := window.NewByLayoutZipMem(zip, "main.xml", "", 0, 0)

    // 獲取視窗布局檔案中的按鈕
    btn := widget.NewButtonByName("btn1")
    // 註冊按鈕被單擊事件
    btn.Event_BnClick(func(pbHandled *bool) int {
        a.Alert("提示", btn.GetText()+"被點選")
        return 0
    })

    // 調整佈局, 必須
    w.AdjustLayout()
    // 顯示視窗
    w.Show(true)
    a.Run()
    a.Exit()
}

本章主要講了如何使用介面設計器設計視窗、背景編輯器的使用、在程式碼中從視窗布局檔案建立視窗、把佈局檔案打包程式序記憶體呼叫、根據name獲取佈局檔案中的按鈕，這裡提醒一下不要設定重複的name，它是全域性生效的，即使是不同的xml中也不能重複。

背景編輯器大部分元素都能用，你可以自己嘗試著修改出一個好看的按鈕。

本作品採用《CC 協議》，轉載必須註明作者和本文連結

相關文章