GO語言 GUI編程 | 怎樣實現 page 頁面?

一句話概要:本文是GO語言開發,GUI編程相關知識--page頁面

大家知道什麼GUI樣式是page頁吧,也有的叫Tab頁,其實都是一排按鈕一樣的界面,來控制一個較大的顯示區(子窗口)。


GO語言 GUI編程 | 怎樣實現 page 頁面?

page頁面基本樣式

這樣的界面設計,可以方便地在多個子窗口之間切換。

圖中Page1 和Page 2就是切換控制器的內部按鈕。下面的顯示區就是stack。stack可以包含多個子窗口,但一個時間只能顯示一個子窗口內容,由stackswitcher來控制。

它們的對象層次體系如下:


GO語言 GUI編程 | 怎樣實現 page 頁面?

gtkstackswitcher直接繼承自gtkbox


GO語言 GUI編程 | 怎樣實現 page 頁面?

gtkstack則繼承自gtkcontainer

下面我們實現一個例子,來熟悉這種界面的基本用法:

先看結果圖,這樣腦海裡就有一個圖形,在看代碼時比較方便理解:


GO語言 GUI編程 | 怎樣實現 page 頁面?

第一頁 顯示一個文本框子窗口


GO語言 GUI編程 | 怎樣實現 page 頁面?

第二頁 顯示一個 radio button group


GO語言 GUI編程 | 怎樣實現 page 頁面?

第三頁 顯示一個文本框子窗口

先看main()主函數:

<code>

func

main

()

{ gtk.Init(

nil

) win := setup_window(winTitle) box := newStackFull() win.Add(box) win.ShowAll() gtk.Main() }/<code>

主函數就是程序框架,主要包含初始化,創建主窗口,創建工作區,把工作區和主窗口通過ADD關聯起來,主窗口顯示,進入主消息循環,直到app收到退出信號。這個和win32編程的窗口消息循環是一致的。如果不太理解,建議看下window系統編程。

主窗口的創建就非常簡單明瞭:

<code>

func

setup_window

(title

string

)

*

gtk

.

Window

{ win, err := gtk.WindowNew(gtk.WINDOW_TOPLEVEL) win.SetTitle(title) win.Connect(

"destroy"

,

func

()

{ gtk.MainQuit() }) win.SetDefaultSize(

800

,

600

) win.SetPosition(gtk.WIN_POS_CENTER)

return

win }/<code>

主窗口的創建也很簡單,創建window對象,設置屬性,標題,映射銷燬回調函數,設置窗口默認大小,設置默認顯示在屏幕中的位置。

來看看創建工作區窗口

<code>

func

newStackFull

()

gtk

.

IWidget

{ stack, err := gtk.StackNew() sw, err := gtk.StackSwitcherNew() sw.SetStack(stack) boxText1 := newBoxText(

"Hello there!"

) boxRadio := newBoxRadio(

"choice 1"

,

"choice 2"

,

"choice 3"

,

"choice 4"

) boxText2 := newBoxText(

"third page"

) stack.AddTitled(boxText1,

"key1"

,

"first page"

) stack.AddTitled(boxRadio,

"key2"

,

"second page"

) stack.AddTitled(boxText2,

"key3"

,

"third page"

) stack.ChildSetProperty(boxRadio,

"icon-name"

,

"list-add"

) box := setup_box(gtk.ORIENTATION_VERTICAL) box.PackStart(sw,

false

,

false

,

0

) box.PackStart(stack,

true

,

true

,

0

)

return

box }/<code>

創建stack窗口和Windows編程幾乎一樣,就是window編程時,工作區是不需要自己創建的。而這裡需要自己廠家一個box組件來作為工作區。而工作區窗口add到主窗口時顯然按照“填充”剩餘空間的方式顯示的。

box中有一個開關組件,有一個stack組件。且box內部的組件按照垂直排列,開關先加入“不展開,不填充”,就會顯示在最上面。stack後加入box,“展開且填充”即佔滿剩餘空間。

代碼中第二個page頁面顯示圖標,其文本則作為幫助提示顯示。這裡還可以自定義圖片。(以後完善項目再分享)

每個page也面對應文本框的,實際項目中也需要動態更新文本內容(以後分享如何改變內容)。

剩下的代碼比較簡單,直接上圖,如下:


GO語言 GUI編程 | 怎樣實現 page 頁面?

newBoxText


GO語言 GUI編程 | 怎樣實現 page 頁面?

newBoxRadio


GO語言 GUI編程 | 怎樣實現 page 頁面?

其他細節代碼


總結:

要活用page頁界面,先了解各個組件之間的協作關係。用法其實比較簡單的。你可以擴展成更復雜的界面。

今天剛看了《Hands-On-GUI-Application-Development-in-Go》這本書,雖然它用的gtk2版本和我安裝的不一致,但它從GUI編程的整體歷史出發,詳細介紹了幾個庫,還是受益匪淺。

我是程序員黑洞,正在學習GoLang,基礎學完後,準備分享一個工具軟件的設計開發整個過程,代碼開源到github或者gitee。歡迎關注我,可以留言私信。


分享到:


相關文章: