使用開(kāi)源工具M(jìn)onoDevelop開(kāi)發(fā)GTK#圖形界面
Mono一直到現(xiàn)在的2.8已經(jīng)完全可以勝任一些比較小的項(xiàng)目了,但相關(guān)的開(kāi)發(fā)文檔與教程一直比較匱乏,中文材料更是***。雖然Mono與.net很多類庫(kù)都是通用的,但Mono仍然有為數(shù)不少的擴(kuò)充類庫(kù),其中最重要的就是對(duì)于GTK二次封裝的GTK#圖形界面類庫(kù)了,目前想要開(kāi)發(fā)原生的Mono圖形界面程序此類庫(kù)必不可少。在MonoDevelop里已經(jīng)支持對(duì)于GTK#界面設(shè)計(jì)的直接拖放,有相關(guān)經(jīng)驗(yàn)的開(kāi)發(fā)人員可以很快上手。
Mono官方網(wǎng)站上也有一篇GTK#開(kāi)發(fā)的入門文檔:Stetic GUI Designer,現(xiàn)在結(jié)合此教程簡(jiǎn)要概述一下如何在MonoDevelop下使用GTK#。
首先,我們需要做的就是創(chuàng)建一個(gè)工程……(這是一句廢話)。在MonoDevelop主界面選擇文件->New->Solution(話說(shuō)目前MonoDevelop漢化工作還未徹底完成,菜單中中文夾英文……),在彈出來(lái)的對(duì)話框選擇C#->GTK#2.0工程。
![=Stetic_Tutorial_01[1] =Stetic_Tutorial_01[1]](https://s5.51cto.com/oss/202207/20/221aad413bc5a488bb94686ed23a1d8b0fbe52.jpg)
輸入想建立的工程名,我們這里用“SteticTutorial”,然后點(diǎn)新建。再下面的一個(gè)對(duì)話框中根據(jù)自己的需求選擇,然后就可以點(diǎn)擊OK了。
稍等一會(huì)之后,可以看到MonoDevelop已經(jīng)幫我們做好了一個(gè)GTK#工程所需要做的最基本的工作了,點(diǎn)擊運(yùn)行菜單里的運(yùn)行按鈕或者工具欄上的齒輪按鈕就可以編譯執(zhí)行當(dāng)前工程了,因?yàn)槲覀儸F(xiàn)在什么也沒(méi)做,只是單純彈出了一個(gè)空白的窗體。
![=Stetic_Tutorial_04[1] =Stetic_Tutorial_04[1]](https://s3.51cto.com/oss/202207/20/81810b742960bc4a4c0363988f96cdc6840dd7.jpg)
嗯嗯,很漂亮的界面……咳咳……
現(xiàn)在我們要往這個(gè)界面中添加一些控件,雙擊工程目錄中的MainWindow.cs,這里可以看到窗體事件的代碼。注意看MonoDevelop的下方有兩個(gè)選項(xiàng),目前選中的是“源代碼”,現(xiàn)在讓我們點(diǎn)擊“設(shè)計(jì)器”。
![=Stetic_Tutorial_06[1] =Stetic_Tutorial_06[1]](https://s5.51cto.com/oss/202207/20/8247574360e0803aafb3812a7e4acd1ef79afd.png)
界面右側(cè)有隱藏的工具欄,其中有常用的控件,現(xiàn)在我們可以使用常用的拖放操作來(lái)畫(huà)窗體了,萬(wàn)歲~
好了,現(xiàn)在我們先不急,首先選中主窗體(MainWindow),然后再右側(cè)的屬性欄可以查看當(dāng)前選中控件的屬性。
![=Stetic_Tutorial_07[1] =Stetic_Tutorial_07[1]](https://s7.51cto.com/oss/202207/20/532ba6a63deff78ef51517ee2ee96821241d69.jpg)
我們先把Window Tile一項(xiàng)改成需要的名字,這一項(xiàng)決定了窗體運(yùn)行時(shí)標(biāo)題欄上的文字。
好了,剩下的就是往窗體中拖放控件。這里GTK#與WinForms有一些不同,WinForms下直接往窗體上拖放需要使用的控件就好,而基于GTK的GTK#,大部分控件都需要放在“容器”中。容器就是專門用來(lái)盛放控件的控件,在工具欄的***部分全是這些容器。GTK#就是依賴這些容器來(lái)進(jìn)行控件的定位的,學(xué)習(xí)過(guò)Swing或者QT的同學(xué)應(yīng)該很容易理解。
根據(jù)我們的需要,我們往主窗體拖放一個(gè)VBox。VBox是一個(gè)縱向排列的容器,將窗體分割為了一個(gè)個(gè)縱向的單元,可以往這些單元中添加控件或者其他容器來(lái)滿足需求。
![=Stetic_Tutorial_10[1] =Stetic_Tutorial_10[1]](https://s6.51cto.com/oss/202207/20/115f97c83593ee52eb1337863ed1c4c7a52850.jpg)
默認(rèn)的VBox有三欄,我們需要兩欄就足夠了。右擊第三個(gè),選擇“Delete”。
大部分窗體應(yīng)用中菜單欄是不可或缺的一部分,所以我們首先要往窗體中VBox頂欄中添加一個(gè)MenuBar。VBox的一個(gè)很有意思的特性就是可以根據(jù)它其中的控件而改變?nèi)萜鞯拇笮?,所以?dāng)我們把MenuBar拖進(jìn)***欄的時(shí)候可以看到MenuBar并沒(méi)有變得像整個(gè)窗體一半大小那樣難看,而是自動(dòng)將VBox縮成單行的寬度了。
![=Stetic_Tutorial_11[1] =Stetic_Tutorial_11[1]](https://s8.51cto.com/oss/202207/20/35836553668693de972834f5ce74f969962a8c.jpg)
接下來(lái)添加菜單選項(xiàng)就很簡(jiǎn)單了,直接點(diǎn)擊“Click to create menu”就可以添加按鈕,還可以選擇按鈕的圖標(biāo)。選中菜單,在屬性欄還可以設(shè)置Accelerator項(xiàng)來(lái)設(shè)定此菜單的快捷鍵。
![=Stetic_Tutorial_12[1] =Stetic_Tutorial_12[1]](https://s5.51cto.com/oss/202207/20/24971f594c526d01b9e92655d59ced5126da56.jpg)
建立完菜單后,MainWindow.cs的窗體下多了一個(gè)選項(xiàng)“行為”(英文叫Action),點(diǎn)開(kāi),看到我們之前在菜單欄中所有的定義。選中“Exit”,然后查看屬性欄,注意看屬性欄上方有一個(gè)“信號(hào)”(Signal)的選項(xiàng)看,選擇它。
![=Stetic_Tutorial_14[1] =Stetic_Tutorial_14[1]](https://s2.51cto.com/oss/202207/20/c509065725c8e64dc8d430c677aff739966e1f.png)
在“Activated”項(xiàng)后面的Hander一欄點(diǎn)擊“Click here to add a new hander”,需要注意的是很多時(shí)候因?yàn)楣ぞ邫谀J(rèn)寬度有些窄而導(dǎo)致Handler項(xiàng)顯示不出來(lái),我們可以拉長(zhǎng)一下工具欄的長(zhǎng)度。點(diǎn)擊后添加一個(gè)“OnExit”的事件,雙擊它進(jìn)入源代碼編輯窗口。
![=Stetic_Tutorial_16[1] =Stetic_Tutorial_16[1]](https://s3.51cto.com/oss/202207/20/279711110263df12c51997f96e2e6a6560a964.jpg)
這里添加一句代碼:
- protected virtual void OnExit(object sender, System.EventArgs e)
 - {
 - Application.Quit();
 - }
 
嘗試編譯運(yùn)行一下,在程序菜單欄的File菜單欄中選擇Exit,看看程序是否如期關(guān)閉。
如果你的代碼沒(méi)有問(wèn)題的話,讓我們繼續(xù)往下走?,F(xiàn)在VBox的下欄還空著,我們往里添加一個(gè)TextView控件,命名為logTextView。原教程中提到先要添加一個(gè)ScrolledWindow容器,再往其中填充TextView控件才能實(shí)現(xiàn)滾動(dòng)條,但實(shí)際發(fā)現(xiàn)ScrolledWindow容器并非必需的,大概是GTK#版本不同的緣故吧。
好了,現(xiàn)在我們的程序界面已經(jīng)完成,已經(jīng)可以在窗體寫(xiě)入文字。不過(guò)你會(huì)發(fā)現(xiàn)有一個(gè)小問(wèn)題,TextView并不能自動(dòng)換行,每當(dāng)一行文字的長(zhǎng)度超過(guò)窗體的長(zhǎng)度時(shí)程序只是添加了一個(gè)水平的滾動(dòng)條。解決這個(gè)問(wèn)題的方法很簡(jiǎn)單,只要將textview控件的Wrap Mode改為Word or Charactor就可以了。實(shí)際編程中***將此屬性最為可選項(xiàng)提供為用戶。
剩下的就是在每個(gè)菜單添加相應(yīng)時(shí)間代碼:
- For the OnOpen method:
 - protected virtual void OnOpen(object sender, System.EventArgs e) {
 - // Reset the logTreeView and change the window back to original size
 - int width, height;
 - this.GetDefaultSize( out width, out height );
 - this.Resize( width, height );
 - logTextView.Buffer.Text = "";
 - // Create and display a fileChooserDialog
 - FileChooserDialog chooser = new FileChooserDialog(
 - "Please select a logfile to view ...",
 - this,
 - FileChooserAction.Open,
 - "Cancel", ResponseType.Cancel,
 - "Open", ResponseType.Accept );
 - if( chooser.Run() == ( int )ResponseType.Accept ) {
 - // Open the file for reading.
 - System.IO.StreamReader file =
 - System.IO.File.OpenText( chooser.Filename );
 - // Copy the contents into the logTextView
 - logTextView.Buffer.Text = file.ReadToEnd();
 - // Set the MainWindow Title to the filename.
 - this.Title = "Nate's Log Viewer -- " + chooser.Filename.ToString();
 - // Make the MainWindow bigger to accomodate the text in the logTextView
 - this.Resize( 640, 480 );
 - // Close the file so as to not leave a mess.
 - file.Close();
 - } // end if
 - chooser.Destroy();
 - } // end method OnOpen
 - For the OnClose method:
 - protected virtual void OnClose(object sender, System.EventArgs e) {
 - // Reset the logTreeView and change the window back to original size
 - int width, height;
 - this.GetDefaultSize( out width, out height );
 - this.Resize( width, height );
 - logTextView.Buffer.Text = "";
 - // Change the MainWindow Title back to the default.
 - this.Title = "Nate's Log Viewer"; }
 - // end method OnClose
 - For the OnAbout method:
 - protected virtual void OnAbout(object sender, System.EventArgs e) {
 - // Create a new About dialog
 - AboutDialog about = new AboutDialog();
 - // Change the Dialog's properties to the appropriate values.
 - about.Name = "Nate's Log Viewer";
 - about.Version = "1.0.0";
 - // Show the Dialog and pass it control
 - about.Run();
 - // Destroy the dialog
 - about.Destroy(); }
 - // end method OnAbout
 
其實(shí)可以更加完善,比如再新建文檔或者關(guān)閉文檔的時(shí)候檢測(cè)textview內(nèi)容是否改變,提示用戶保存等等功能。
編譯運(yùn)行界面:
原文鏈接:http://www.cnblogs.com/aisk/archive/2010/11/24/1886988.html
【編輯推薦】















![=Stetic_Tutorial_22[1] =Stetic_Tutorial_22[1]](https://s2.51cto.com/oss/202207/20/a785329515f19ed63f1524a119c845f0b76f65.jpg)
 
 
 

 
 
 
 