用Glade和libGlade設(shè)計(jì)Gtk＋圖形界面

bitmilong

用Glade和libGlade設(shè)計(jì)Gtk＋圖形界面

作者：張威、曹劍    轉(zhuǎn)貼自：賽迪網(wǎng)


Gnome下已開發(fā)出了Glade這一應(yīng)用軟件，它是傳統(tǒng)界面設(shè)計(jì)工具Gtk/Gdk的擴(kuò)展，能滿足基于Gtk+庫的圖形用戶界面可視化開發(fā)的基本需求。

　　一、Glade簡(jiǎn)介
　　如果有一種軟件能將圖形界面的設(shè)計(jì)及時(shí)地展現(xiàn)于開發(fā)人員的面前，而且在設(shè)計(jì)完后能直接看到界面的外觀效果，這樣就使程序員的主要精力集中于應(yīng)用程序核心功能的開發(fā)上，這就是所謂的可視化編程思想。

　　在Windows環(huán)境下，這種可視化的集成開發(fā)環(huán)境已有許多成熟的產(chǎn)品，如VC++、VB、PB、Delphi、C++Bulider等�；�于 Linux 操作系統(tǒng)的軟件并不豐富，但絕非一片空白，例如Borland公司推出的Kylix。目前Gnome下已開發(fā)出了Glade這一應(yīng)用軟件，它是傳統(tǒng)界面設(shè)計(jì)工具Gtk/Gdk的擴(kuò)展，能滿足基于Gtk+庫的圖形用戶界面可視化開發(fā)的基本需求。
　

　　Glade可為你生成界面代碼，基本過程如下：

　　1.讓Glade設(shè)計(jì)出界面元素，設(shè)置界面元素屬性，為構(gòu)件的信號(hào)設(shè)置回調(diào)函數(shù)；

　　2.將其存為XML格式，觀察并修改不符合要求的部分；

　　3.編寫應(yīng)用其它部分代碼，并在應(yīng)用中載入Glade文件，編譯C代碼生成執(zhí)行文件。

　　這種模式使設(shè)計(jì)界面與其它部分代碼完全分開，并且有可能做到在對(duì)界面進(jìn)行改動(dòng)后不必對(duì)應(yīng)用進(jìn)行編譯。圖形用戶界面設(shè)計(jì)小組可不必關(guān)心應(yīng)用程序的運(yùn)行細(xì)節(jié)，同時(shí)編程人員也可以把他們的時(shí)間用于其它方面，而不需為界面的修改重復(fù)編寫大量煩瑣的Gtk+函數(shù)。這種分工開發(fā)的形式符合軟件工程的要求，對(duì)GUI 軟件的開發(fā)也更方便。

　　二、使用Glade的預(yù)備條件
　　在學(xué)習(xí)使用Glade之前，我們假設(shè)你已對(duì)Linux操作系統(tǒng)的基本運(yùn)用有初步了解、熟悉rpm包或gzip包的處理命令、對(duì)C語言有一定的了解，并熟悉消息處理編程機(jī)制。以上基礎(chǔ)是使用Glade的必備知識(shí)，如果讀者在以上某些方面尚存不明之處可先查閱相關(guān)資料。為了能更靈活地使用Glade開發(fā)應(yīng)用，用戶最好能熟悉gcc編譯器，掌握make文件的編寫規(guī)則。

　　我們?cè)賮砜纯慈绾问笹lade加入到Linux操作系統(tǒng)的開發(fā)環(huán)境中，主要分兩步：

　　1.獲得Glade的源代碼

　　你可以在大多數(shù)Linux操作系統(tǒng)的發(fā)布中找到Glade的源代碼，也可從網(wǎng)上下載，目前能方便獲得源代碼的網(wǎng)站是www.Glade.pn.org，下載的文件可能是rpm或zip格式。

　　2.解壓、編譯并安裝Glade

　　在獲得源代碼后，對(duì)壓縮包解壓縮，然后再運(yùn)行make編譯Glade。

　　三、設(shè)計(jì)界面
　　在對(duì)Glade有了初步的了解之后，讓我們來看一看它的真面目吧，在Linux上先運(yùn)行Xwindow，調(diào)出圖形化界面后，你可以在虛擬控制臺(tái)上輸入Glade或在命令選單上找到開發(fā)子選單下的Glade項(xiàng)，點(diǎn)擊即可。

　　調(diào)出Glade后，我們一般能看到三個(gè)窗口（如圖1）：一個(gè)工程管理窗口（主窗口）、一個(gè)常用構(gòu)件窗口和桓鍪糶怨芾澩翱�。震t?齟翱詮鉤閃艘桓鯣UI的開發(fā)環(huán)境，對(duì)于使用過可視化編程的用戶而言，這三個(gè)窗口應(yīng)是很熟悉的。

　　工程管理窗口主要負(fù)責(zé)對(duì)一個(gè)工程項(xiàng)目的管理，我們所說的工程項(xiàng)目就是指所設(shè)計(jì)的圖形界面。這個(gè)窗口中使用最多的是它的選單，常用的選單是創(chuàng)建新的工程項(xiàng)目，打開一個(gè)已有的項(xiàng)目文件進(jìn)行編輯修改，以及改變對(duì)項(xiàng)目的視角等。

　　圖1

　　常用構(gòu)件窗口則是由Glade提供的常用Gtk+構(gòu)件的圖形化集。在需要調(diào)用某構(gòu)件時(shí)只需在這個(gè)窗口中點(diǎn)擊該構(gòu)件的圖標(biāo)，然后在設(shè)計(jì)好的位置單擊鼠標(biāo)，這時(shí)構(gòu)件就被安排到適當(dāng)?shù)奈恢谩?

　　屬性窗口主要負(fù)責(zé)對(duì)項(xiàng)目對(duì)象的屬性調(diào)整，它本身是一個(gè)分頁式的notebook構(gòu)件，在各頁上集中了項(xiàng)目對(duì)象（構(gòu)件）某個(gè)方面的屬性，如構(gòu)件的標(biāo)題名稱、尺寸大小、位置、停靠對(duì)齊方式、快捷鍵設(shè)置和信號(hào)處理等。

　　值得一提的是有些構(gòu)件是根構(gòu)件，或者說是頂層容器構(gòu)件（如頂層窗口構(gòu)件，對(duì)話框構(gòu)件等），每一個(gè)頂層容器構(gòu)件都會(huì)出現(xiàn)在工程管理窗口的主區(qū)內(nèi)，頂層容器之間是獨(dú)立的，要使它們能產(chǎn)生連接調(diào)度關(guān)系還需對(duì)由Glade生成的源碼進(jìn)行少量編輯。一個(gè)頂層構(gòu)件的所有子孫構(gòu)件由Glade維護(hù)在一個(gè)構(gòu)件樹中，我們可以調(diào)用工程管理窗口中的“查看構(gòu)件樹”選單項(xiàng)瀏覽構(gòu)件樹。

　　四、生成代碼選項(xiàng)
　　當(dāng)我們?cè)O(shè)計(jì)出想要的界面后就要讓Glade生成我們需要的代碼，點(diǎn)擊build按鈕，Glade會(huì)彈出一個(gè)選項(xiàng)窗口，這個(gè)窗口中有三頁，分別是普通選項(xiàng)、C語言選項(xiàng)和libGlade選項(xiàng)(如圖2)。


　　圖2

　　五、Glade生成的文件
　　Glade 生成的主要目錄及代碼文件有如下幾個(gè)：在項(xiàng)目的根目錄（假設(shè)為/root/projects/project1）下有三個(gè)子目錄/po、/src和/macros，程序源代碼都放在/src目錄中，這個(gè)目錄下的文件可以用文本編輯器再修改以增加應(yīng)用。

　　六、運(yùn)用XML指針建立構(gòu)件
　　libGlade在程序運(yùn)行時(shí)才根據(jù)XML文檔 （.Glade文件）構(gòu)造構(gòu)件，為了應(yīng)用libGlade，我們?cè)诔绦虻拈_始要對(duì)Gnome和libGlade進(jìn)行初始化。初始程序如下：

　　/?初始化 gnome ?/

　　 gnome_init(phonebook, VERSION, argc, argv);

　　/? 初始化libGlade ?/

　　 Glade_gnome_init();

　　獲得一個(gè)構(gòu)件指針的代碼如下：

　　 /?聲明指針?/

　　 GladeXML xml;

　　 GtkWidget dialog1;

　　/?在由Glade軟件生成的XML界面文件中找到名為“about1”的根構(gòu)件，生成XML構(gòu)件并將構(gòu)件指針賦給 xml ?/

　　 xml = Glade_xml_new(phonebook.Glade, about1);

　　 dialog = Glade_xml_get_widget(xml, dialog1);

　　/?對(duì)不用的指針要及時(shí)釋放?/

　　 gtk_object_unref(GTK_OBJECT(xml));

　　設(shè)計(jì)界面時(shí)往往有相對(duì)獨(dú)立的構(gòu)件，在建造應(yīng)用工程時(shí)要在這些構(gòu)件之間建立聯(lián)系，如主窗口和對(duì)話框的父子關(guān)系等，步驟如下：

　　1.用XML建立兩個(gè)構(gòu)件：

　　dialog = Glade_xml_get_widget(xml, dialog1);

　　app= Glade_xml_get_widget(xml, app1);

　　2.用gnome_dialog_set_parent(GNOME_DIALOG(dialog), GTK_WINDOW(app))函數(shù)將對(duì)話框設(shè)定為app窗口的從屬構(gòu)件。

　　注意：在用Glade設(shè)計(jì)界面時(shí)有一點(diǎn)需要注意的是所有的構(gòu)件名不能重名，因?yàn)槲覀円�以它們的名字�?duì)該構(gòu)件進(jìn)行訪問。

　　七、消息處理函數(shù)
　　對(duì)于消息處理函數(shù)，我們可以在設(shè)計(jì)構(gòu)件時(shí)就在構(gòu)件的屬性管理窗口中的signal頁指明（如圖3），Glade在生成的代碼中自動(dòng)加入函數(shù)名。如果用libGlade則有兩點(diǎn)限制：

　　1. 回呼函數(shù)接收的參數(shù)不能指定類型而只能用空指針類型gpointer(void)；


　　圖3

　　2. 因?yàn)閘ibGlade是在運(yùn)行時(shí)才調(diào)用回呼函數(shù)，所以這類函數(shù)不能設(shè)為 static型。

　　八、實(shí)例代碼
　　以下是用Glade生成的一個(gè)示例程序，它是一個(gè)簡(jiǎn)單的電話薄程序，共有三個(gè)用Glade設(shè)計(jì)的獨(dú)立構(gòu)件，一個(gè)主窗口、一個(gè)錄入對(duì)話框和一個(gè)用于展示錄入內(nèi)容的clist列表構(gòu)件。

　　我們可以從主窗口點(diǎn)擊按鈕彈出對(duì)話框，在對(duì)話框中有兩個(gè)錄入條，分別用于錄入人名和電話號(hào)碼，當(dāng)點(diǎn)擊對(duì)話框中的“確定”之后，人名和電話號(hào)碼會(huì)加入到clist列表中，對(duì)話框關(guān)閉。有興趣的讀者可以對(duì)這個(gè)應(yīng)用程序加以豐富。

　　#include 〈string.h〉

　　#include 〈gnome.h〉

　　#include 〈Glade/Glade.h〉

　　#define VERSION 1.0

　　 static GtkWidget ?app;

　　 static GtkWidget ?clist;

　　 void do_nothing(GtkWidget ?w);

　　 void run_about_dialog(GtkWidget ?w);

　　 void add_number(GtkWidget ?w);

　　 void do_nothing(GtkWidget ?w){

　　 gnome_app_message(GNOME_APP(app), Doesn't do anything!);

　　 }

　　 void run_about_dialog(GtkWidget ?w){

　　 GladeXML ?xml;

　　 xml = Glade_xml_new(phonebook.Glade, about1);

　　 if(!xml) {

　　 g_warning(We could not load the interface!);

　　 return;

　　 }

　　 gtk_object_unref(GTK_OBJECT(xml));

　　 }

　　static void

　　really_add_number(GtkWidget ?w, int button, gpointer data){

　　 char ?strings[2];

　　 GtkWidget ?name_entry;

　　 GtkWidget ?phone_entry;

　　 GladeXML ?xml = data;

　　 if (button != 0)

　　 return;

　　 name_entry = Glade_xml_get_widget(xml, add_name_entry);

　　 phone_entry = Glade_xml_get_widget(xml, add_phone_entry);

　　 strings[0] = gtk_entry_get_text(GTK_ENTRY(name_entry));

　　 strings[1] = gtk_entry_get_text(GTK_ENTRY(phone_entry));

　　 gtk_clist_append(GTK_CLIST(clist), strings);

　　 }

　　void add_number(GtkWidget ?w){

　　 GtkWidget ?dialog;

　　 GladeXML ?xml;

　　 xml = Glade_xml_new(phonebook.Glade, dialog1);

　　 if(!xml) {

　　 g_warning(We could not load the interface!);

　　 return;

　　 }

　　 dialog = Glade_xml_get_widget(xml, dialog1);

　　 gnome_dialog_set_parent(GNOME_DIALOG(dialog), GTK_WINDOW(app));

　　 gtk_signal_connect_full(GTK_OBJECT(dialog),clicked,GTK_SIGNAL_FUNC (really

　　add_number), NULL, xml,(GtkDestroyNotify)gtk_object_unref,FALSE, FALSE);

　　 }

　　int main(int argc, char ?argv[]){

　　 GladeXML ?xml;

　　 gnome_init(phonebook, VERSION, argc, argv);

　　 Glade_gnome_init();

　　 xml = Glade_xml_new(phonebook.Glade, app1);

　　 if(!xml) {

　　 g_warning(We could not load the interface!);

　　 return 1;

　　 }

　　app=Glade_xml_get_widget(xml,app1);

　　clist=Glade_xml_get_widget(xml,clist1);

　　Glade_xml_signal_autoconnect(xml);

　　gtk_object_unref(GTK_OBJECT(xml));

　　gtk_main();

　　 return 0;

　　 }

　　對(duì)于使用過或熟悉Gtk+的讀者來說，這樣的代碼就是以前我們要花大量時(shí)間和精力來編寫的。有了這些代碼，我們只要稍作修改就能完成所需的應(yīng)用界面。

　　九、代碼的編譯與執(zhí)行
　　Glade生成所需的代碼后最后一步就是生成可執(zhí)行文件了。

　　1.編譯代碼的條件

　　系統(tǒng)中必須安裝automake 1.4和autoconf 2.13以上版本的兩個(gè)軟件，一般來說操作系統(tǒng)在安裝時(shí)已將這兩個(gè)軟件安裝好了，如要獲得這兩個(gè)軟件可以到www.rawhide.redhat.com/pub/rawhide/i386/

　　redhat/rpms/下載。

　　2.編譯代碼的步驟

　　#〉./autogen.sh

　　在項(xiàng)目根目錄下有一個(gè)autogen.sh文件, 它是一個(gè)shell腳本文件，運(yùn)行這個(gè)腳本文件就能生成標(biāo)準(zhǔn)的 makefile文件。

　　#〉make

　　運(yùn)行make 命令按makefile進(jìn)行編譯。

　　（1）#〉make install

　　運(yùn)行install使某些資源如圖片等安裝到程序中，如果沒有這一步程序也能運(yùn)行，但當(dāng)資源文件的路徑有變化時(shí)，程序就會(huì)因找不到資源文件而出現(xiàn)問題。

　�。�2）已生成的可執(zhí)行文件放在/src子目錄下，在該目錄下運(yùn)行該程序名即可。

[ 本帖最后由 bitmilong 于 2005-11-24 18:42 編輯 ]