GUI界面編寫與人機(jī)交互

1、Gen esis2000（Script）腳本編寫視頻教程第二課GUI界面編寫與人機(jī)交互本課內(nèi)容主要介紹genesis2000軟件自帶的GUI界面：首先介紹如何編寫出我們需要的 GUI界面；而后介紹我們?nèi)绾卫肎UI實(shí)現(xiàn)人機(jī)交互；最后用實(shí)例進(jìn)行詳細(xì)講解。2.1 GUI界面編寫：2.1.1 : GUI 簡(jiǎn)介：GUI為Graphic User in terface單詞縮寫，意思為用戶圖形界面，大多數(shù)編程工具都會(huì)提供 實(shí)現(xiàn)人機(jī)交互的界面，以使程序更智能，操作更簡(jiǎn)單，genesis2000提供的GUI界面編寫很簡(jiǎn)單，只需要很簡(jiǎn)短的語句就可以寫出你所需要的界面，并同樣可以實(shí)現(xiàn)數(shù)據(jù)的輸入輸出。2.1.2:

2、GUI的主程序：編寫GUI界面首先我們必須了解 gui.exe的位置，在程序中我們必須指明其位置，gui.exe是提供我們實(shí) 現(xiàn)gui界面的主程序，一般在genesis2000軟件安裝好后 gui.exe 會(huì)存在于$GENESIS_DIR/e$GENESIS_VER/all/gui 的目錄下面（其中 $GENESIS_DIR 為軟件 的安裝 目錄，$GENESIS_VER 為gen esis版本），如果你 編寫的程序無法彈出界面，有可能你的gui.exe所指目錄不對(duì)，你可以用搜索的方法找到它， 然后改變程序中指明 gui.exe路徑的語句。請(qǐng)大家按如下步驟做一個(gè)簡(jiǎn)單的GUI界面程序，以確定我們

3、的 GUI是否能夠運(yùn)行。（1） :在linux下打開gedit編輯器或者vi編輯器（如果為unix系統(tǒng)用V編輯器， windows用寫字板程序）（2）:輸入以下內(nèi)容：1) : set gui_out = /tmp/gui_out.$2) : set gui_in = /tmp/gui_in.$3) : echo "WIN 200 200" > $gui_in4) : echo "LABEL GUI_OK" >> $gui_in5) : /genesis/e91/all/gui $guin > $gui_out6) : source

4、 $gui_out（3）:進(jìn)入genesis，運(yùn)行我們剛保存的程序， 如果出現(xiàn)2.1所示界面則表示我們的gui程序正確，我們寫的程序也沒有錯(cuò)誤；如果出現(xiàn)2.2所示界面則同樣表示我們的gui.exe路徑正確，但我們的程序其它部分有錯(cuò)誤；但如果什么都沒出現(xiàn)則可能是我們的gui.exe路徑有問題或者GUI程序有問題，遇到這樣的情況需要查看gui.exe路徑設(shè)定是否有問題或者gui.exe程序有問題。圖2.1錄制：執(zhí)著 QQ : 271086879 Tel寶:Gen Gen esis2000(Script)腳本編寫視頻教程第二課GUI界面編寫與人機(jī)交互VALOK GTTT|二

5、|叵| 區(qū)圖2.2Error in line 2 - Illegal GUI directive CUOSiE "ND CONTINUE|(c) Copyright 1933 VaJor Cbmputeri2ed Systems Ltd2.1.3: GUI界面臨時(shí)目錄：gui是先將我們所寫的要顯示的內(nèi)容存入到一個(gè)臨時(shí)目錄中，然后在我們給出顯示的指令時(shí)將讀取這個(gè)臨時(shí)文件，并用gui.exe將這個(gè)文件解釋成界面并顯示出來。在我們上面寫的簡(jiǎn)單的 GUI程序中，我們可以看到其中有兩條語句為"set gui_out =/tmp/gui_out.$，set gui_in = /tmp/

6、gui_in.$ ”；其實(shí)這兩句就是設(shè)置 gui運(yùn)行時(shí)的臨時(shí)目錄。 后面就是將一些內(nèi)容存到 $gui_i n里面，在運(yùn)行到語句"/genesis/e91/all/gui $guin > $gui_out ”時(shí)讀取$gui_in文件，顯示出 如圖2.1的界面。2.1.4: GUI界面視窗：(1) : GUI界面的視窗起點(diǎn)語法格式為“WIN X Y ”，其中X和Y為坐標(biāo)值，如上面的 語句“ WIN 200 200 ”則表示從屏幕 200，200的地方顯示。(2) : GUI界面的大小是根據(jù)界面的內(nèi)容而定義的，我們不可以定義它的大小。(3) :“WIN X Y ”必須寫在程序顯示部分

7、的第一行。(4) : GUI界面的視窗起點(diǎn)語句在每個(gè)GUI程序中必須有且僅有一行，否則會(huì)出現(xiàn)錯(cuò)誤 提示。2.1.5 :背景顏色：(1) : GUI界面中設(shè)置背景顏色的語法格式為“BG color ”，其中“ BG”代表該語句設(shè)置背景顏色，color ”為要設(shè)置的顏色值，顏色由三基色進(jìn)行組合實(shí)現(xiàn)，模式為“ RGB”，每種基色有兩位數(shù)組成，取值范圍為“00-99”，如“ 990000”則顯示的背景為紅顏色。默認(rèn)的值為“328068”(2) : GUI界面背景顏色的設(shè)置語句在每個(gè)GUI程序中可以出現(xiàn)多次。(3) :每條語句的作用范圍為本條語句到下一條背景顏色設(shè)置語句之間的所有語句。如以下 程序：1)

8、 set gui_out = /tmp/gui_out.$2) set gui_in = /tmp/gui_in.$3) echo "WIN 100 100" > $gui_in4) echo "BG 990000" >> $gui_in5) echo "LABEL GUI_OK" >> $guin6) echo "BG 990099" >> $gui_in7) echo "LABEL GUI_OK1" >> $guin8）/genesis/

9、e91/all/gui $gui_in > $gui_out其中第4條背景顏色設(shè)置語句僅對(duì)第5條語句起作用，因?yàn)榈?6條也是背景顏色設(shè)置的語句。后面的語句就由第 6條語句中所設(shè)置的顏色控制。2.1.6 :前景顏色：（1） : GUI界面的前景顏色也即是字體的顏色，其語法格式為“FG color”，其中“ FG”代表該語句設(shè)置前景顏色，color ”為要設(shè)置的顏色值，其值的格式和背景顏色格式設(shè)置一致。默認(rèn)的值為“ 999999”，其顏色為黑色。（2） : GUI界面前景顏色的設(shè)置語句在每個(gè)GUI程序中可以出現(xiàn)多次。（3）:每條語句的作用范圍為本條語句到下一條前景顏色設(shè)置語句之間的所有語句。

10、2.1.7:字體：（1） : GUI界面中設(shè)置字體語法格式為“ FONT spec”，其中“ FONT為表示本條語句為設(shè) 置界面字體，“ spec”為字體的字型、粗細(xì)、字體、和大小，其模式為“xyznn ”，默認(rèn)的值 為“ tbr14 ”，其選項(xiàng)分別如下：x= c（ourier）,h（elvetica）,t（imes） 字型y= b（old）,m（edium）粗細(xì)（黑體，適中）z= r（egular）,l（talic）字體（正常，斜體）nn = 8,10,12,14,18,24（2）: GUI界面字設(shè)置語句在每個(gè) GUI程序中可以出現(xiàn)多次。（3）:每條語句的作用范圍為本條語句到下一條字體設(shè)置語

11、句之間的所有語句。2.1.8:邊緣寬度：（1） : GUI界面中設(shè)置邊緣寬度的語法為 “ BW width ”，其中“ BW ”為表示本條語句設(shè)置 GUI 界面邊框的寬度，“width ”為寬度值，取值范圍為 110，默認(rèn)的值為1。（2）: GUI界面字設(shè)置語句在每個(gè) GUI程序中可以出現(xiàn)多次。（3）:每條語句的作用范圍為本條語句到下一條邊緣寬度設(shè)置語句之間的所有語句。2.1.9 : LABEL 元素：（1） : LABEL元素為界面中的標(biāo)題，其語法格式為“LABEL text 其中text可以為任何 字母，數(shù)字，一部分的符號(hào)。（2） : LABEL元素也可以顯示格式為 “xbm”和“xpm”

12、的圖片，其格式為“LABEL path ” 其中“ path”為圖片的路徑，如“ LABEL /genesis/sys/scripts/xx.xpm ”則會(huì)在 GUI界面中 顯示路徑/genesis/sys/scripts/下名為xx.xpm 的圖片。（3） :當(dāng)我們寫下如下程序會(huì)出現(xiàn)2.3所示圖形1）: set gui_out = /tmp/gui_out.$2）: set gui_in = /tmp/gui_in.$3）： echo "WIN 200 200" > $gui in4) : echo “ LABEL GUI_OK ” >> $gui_in

13、5) : /genesis/e91/all/gui $gui_in > $gui_out6): source $gui_out圖2.32.1.10: TEXT 元素：（1） : TEXT元素為界面中的文字輸入欄：其語法格式為“TEXT name len title ”，其中： TEXT :表示該欄為文字輸入欄。Name:為設(shè)置輸入欄的變量名稱。Len:為輸入欄的長(zhǎng)度，默認(rèn)為 20。Title:為輸入欄的提示字符，如果為字串則需要加上'也可以像LABEL 元素一樣加上“path”讓提示字符變?yōu)閳D形。（2） :示例：當(dāng)我們寫下如下程序會(huì)出現(xiàn)2.4所示圖形：程序名存為text錄制：執(zhí)著

14、 QQ : 271086879 Tel寶:Gen Gen esis2000(Script)腳本編寫視頻教程第二課GUI界面編寫與人機(jī)交互錄制：執(zhí)著 QQ : 271086879 Tel寶:Gen Gen esis2000(Script)腳本編寫視頻教程第二課GUI界面編寫與人機(jī)交互1):set gui_out = /tmp/gui_out.$2）：set guin 二 /tmp/gui_i n.$3):echo "WIN 200 200" > $gui_i n4）：echo "BG 990000"

15、 >> $gui_i n5）：echo “TEXT name INPUT ” >> $gui_in6) : /genesis/e91/all/gui $gui_in > $gui_out7) : source $gui_out圖2.42.1.11: DTEXT 元素:(1) : DTEXT元素是設(shè)定TEXT 元素輸入框中的默認(rèn)值，其語法格式為“DTEXT nametext ”其中：DTEXT :表示該欄為預(yù)設(shè)某個(gè) TEXT元素的默認(rèn)值。Name：為變量名稱，表示要設(shè)定那個(gè)變量名稱的默認(rèn)值，在此語句前必須有該變量，如果沒有則會(huì)顯示該語句錯(cuò)誤。text:為變量默認(rèn)值，

16、該值會(huì)顯示在某個(gè)TEXT的輸入框中。(2) :示例：當(dāng)我們?cè)谏厦?TEXT示例的程序中的第 5條語句下面加上一條如下語句則會(huì) 看到圖2.5的效果echo “ DTEXT name JACK” >> $gui_i n2.1.12: RADIO 元素:圖2.5(1) : RADIO 元素為界面中的按鈕，其語法格式為“RADIO name title V/H nc sc ”，其中,RADIO :表示在界面中會(huì)產(chǎn)生一個(gè)按鈕選項(xiàng)。name：為選項(xiàng)的變量。title :為選項(xiàng)的提示字符，若為字串則需要加上'也可以像LABEL 元素一樣加上“path” 讓提示字符變?yōu)閳D形，若為空則需要加

17、上.'V/H :表示按鈕是顯示是垂直方向還是水平方向。nc：為一欄顯示按鈕的個(gè)數(shù)。sc：為選擇某個(gè)按鈕后的顏色：(2) :按鈕的結(jié)束語句用“ END”，我們必須在每個(gè) RADIO 后面加上結(jié)束語句。(3) :示例：當(dāng)我們寫下如下語句則會(huì)出現(xiàn)如圖2.6的圖形：程序名存為 radio1):set gui_out = /tmp/gui_out.$2)：set guin 二 /tmp/gui_i n.$3):echo "WIN 100 100" > $gui_in4) : echo "RADIO layer 'layer number:' H

18、 1 990099" >> $gui_in5) : echo "1" >> $gui_in6) : echo "2" >> $gui_in7) : echo "3" >> $gui_in8) : echo "END" >> $gui_in9) : /genesis/e91/all/gui $gui_in > $gui_outVALOR GTH匚 區(qū)layer numbei: 123圖2.6CLOSE AND CO1ITIMUE(c) Cop

19、yright 1993 Valor Computerised Systems Ltd2.1.13: LIST 元素：(1) : LIST元素為界面中的選單，其語法格式為"LIST name visnum S/M start ”，其中:LIST :表示產(chǎn)生一個(gè)選單的界面。Name：為變量的名稱。Vis num :為可看見選項(xiàng)的數(shù)目。S/M :單選還是復(fù)選。Sta比從第幾列開始顯示。(2) :按鈕的結(jié)束語句用“ END”，我們必須在每個(gè) LIST后面加上結(jié)束語句。(3) :示例：當(dāng)我們寫下如下語句則會(huì)出現(xiàn)如圖2.7的圖形：程序名存為list1):set gui_out = /tmp/gu

20、i_out.$2)：set guin 二 /tmp/gui_i n.$3):echo "WIN 100 100" > $gui_i n4)：echo "LIST layer 2 S 2" >> $gui_in5)：echo "1" >> $gui_i n6)：echo "2" >> $gui_i n7)：echo "3" >> $gui_i n8) : echo "END" >> $gui_in9) : /ge

21、nesis/e91/all/gui $gui_in > $gui_outCLOSE AMD COHTIIIUE(c) Copyright 1993 Valor Computerized Systems Ltd圖2.72.1.14: OPTION 元素：(1) : OPTION元素在GUI界面中產(chǎn)生下拉選單，其語法格式為“OPTION name title ”， 其中：OPTION :表示產(chǎn)生一個(gè)下拉選單。Name：為變量名。title :為選項(xiàng)的提示字符，若為字串則需要加上'也可以像LABEL 元素一樣加上“path” 讓提示字符變?yōu)閳D形，若為空則需要加上.'(2) :按

22、鈕的結(jié)束語句用“ END”，我們必須在每個(gè) LIST后面加上結(jié)束語句。(3) :示例：當(dāng)我們寫下如下語句則會(huì)出現(xiàn)如圖2.8的圖形：程序名存為 option。set gui_out = /tmp/gui_out.$ set guin 二 /tmp/gui_i n.$ echo "WIN 100 100" > $gui_i necho "OPTION layer 'LA YER NUMBER'" >> $gui_inecho "1" >> $gui_i necho "2"

23、>> $gui_i necho "3" >> $gui_i n echo "END" >> $gui_in/ge nesis/e91/all/gui $gui_i n > $gui_out(c) Copyright 1993 1 ir Computenzed Systems Ltd圖2.8錄制：執(zhí)著 QQ : 271086879 Tel寶:Gen Gen esis2000（Script）腳本編寫視頻教程第二課GUI界面編寫與人機(jī)交互2.1.15: FORM （界面控制）（1） : FOR

24、M是控制界面的一個(gè)語句，作用是將FORM 下面的語句放在同一欄上直到出 現(xiàn)“ END FORM ”，其語法格式為“ FORM radio butto n ”，其中radio butt on是說我們可以 用控制RADIO元素使下面的某些元素是否可以進(jìn)行操作。（2）:“ END FORM ”為FORM 的結(jié)束語句，它們必須成對(duì)出現(xiàn)，否則會(huì)出現(xiàn)語法錯(cuò)誤。（3） ：示例：當(dāng)我們寫下如下語句則會(huì)出現(xiàn)如圖2.9的圖形：該界面中只有選擇 3時(shí)，下 面兩個(gè)TEXT元素才可以操作。11)： echo "TEXT name1 5NAME1 " >> $gui_in1):set gu

25、i_out = /tmp/gui_out.$2）：set guin 二 /tmp/gui_i n.$3):echo "WIN 100 100" > $gui_i n4）：echo "RADIO layer 'LAYER NUMBER'" >> $gui_in5）：echo "1" >> $gui_i n6）：echo "2" >> $gui_i n7）：echo "3" >> $gui_i n8）：echo "END

26、" >> $gui_i n9):echo "FORM layer 3" >> $gui_i n10): echo "TEXT name 5NAME " >> $gui_in錄制：執(zhí)著 QQ : 271086879 Tel寶:Gen 錄制：執(zhí)著 QQ : 271086879 Tel寶:Gen 12): echo "ENDFORM" >> $gui_in13): /genesis/e91/all/gui $gui_in >

27、$gui_out圖2.9錄制：執(zhí)著 QQ : 271086879 Tel寶:Gen Gen esis2000（Script）腳本編寫視頻教程第二課GUI界面編寫與人機(jī)交互2.1.16: CLABEL :（1） : CLABEL 為將上面圖形中的“ CLOSE AND CONTINUE ”改為我們想要顯示的單詞，“CLOSE AND CONTINUE ”為退出界面并執(zhí)行下面的語句，其語法為“CLBEL text 女口“CLABE OK ” 則默認(rèn)顯示“ CLOSE AND CONTINUE ”會(huì)變?yōu)椤?OK”。2.2： GUI界面變量規(guī)則：（1） :由上面的敘述我們可以

28、看出TEXT、OPTION、RADIO、LIST四種元素都需要進(jìn)行變量定義，實(shí)質(zhì)上也只有這四種元素可以進(jìn)行人機(jī)交互，它們的變量名都跟在元素后面。（2）：變量名可以是字母，數(shù)字，一部分符號(hào)，但必須以字母開始。（3）:變量名必須只能為一個(gè)單詞。（4）:在一個(gè)GUI界面中，變量名不能被重復(fù)定義。2.3、GUI界面變量的結(jié)果：以上的敘述中，我們定義了很多變量，那么我們輸入或者選擇后，它們會(huì)返回些什么結(jié)果呢？在CSH中，我們可以利用echo $name來看出返回的值， 其中name為變量名，下面我們 分別對(duì)不同元素的變量結(jié)果給予介紹：（1 ）、TEXT 元素,TEXT元素的變量輸出結(jié)果和我們?cè)赥EXT欄

29、輸入的字符一樣，即當(dāng)我們?cè)赥EXT的輸入欄輸入任何字符，相應(yīng)變量輸出的結(jié)果和我們輸入的字符一樣，如我們?cè)谏厦妗癟EXT”的程序中最后面加上一條 “echo $name",且在INPUT 欄輸入” jack”，在我們使用echo $name 語句后，將會(huì)在 genesis2000的后臺(tái)或者在script run 界面中的執(zhí)行記錄中顯示“ jack”表 明這時(shí)$xsize等于“ jack”。（2）、RADIO 元素：RADIO按鈕的輸出結(jié)果為“ 1”、“ 2”、“3”、“4”、“5”、等數(shù)值，它根據(jù)你所選擇的按鈕排 在第幾位，如：我們?cè)谏厦娴膔adio程序中最后面加上一條 echo $l

30、ayer語句，當(dāng)我們?cè)谶\(yùn)行程序后彈出的 GUI界面中，在layer number欄選“1”，將會(huì)在genesis2000的后臺(tái)或者 在script run界面中的執(zhí)行記錄中顯示“ 1 ”，表明這時(shí)$layer等于1，如果選擇“3”，則$layer將等于3。（3）、OPTION 元素：其返回的結(jié)果和 RADIO 一樣，都為“1”、“2”、“3”等數(shù)值，它也是根據(jù)你所選擇的按鈕 排在第幾位，女口：我們?cè)谏厦娴某绦?option的程序中的最后面加上一條echo $layers語句，當(dāng)我們?cè)谶\(yùn)行程序后彈出的GUI界面中，在“ LAYER NUMBER ”欄位選擇“ 2”，將會(huì)在genesis2000的

31、后臺(tái)或者在script run界面中的執(zhí)行記錄中顯示“ 2",表明這時(shí)$layers等于 2,如果選擇“ 1”則$layers值將等于1。（4）、LIST 元素：其返回的值和我們選擇的一樣，如：我們?cè)谏厦娴某绦騦ist的程序中最后面加上一條 echo$layer語句，當(dāng)我們?cè)谶\(yùn)行“l(fā)ist”程序后彈出的 GUI界面中，在list選項(xiàng)框里面選擇“2”， 將會(huì)在genesis2000的后臺(tái)或者在script run界面中的執(zhí)行記錄中顯示 “ 2",表明這時(shí)$layer 等于2,如果選擇“ 3”則$layer值將等于3。2.4:實(shí)例詳解：2.4.1程序內(nèi)容：綜合上述所學(xué)，我們編寫

32、一個(gè)擁有各種元素的板框界面程序：取名叫panel。程序源代碼如下（在按照下列程序鍵入時(shí)請(qǐng)不要輸入序號(hào)）：錄制：執(zhí)著 QQ : 271086879 Tel寶:Gen Gen esis2000(Script)腳本編寫視頻教程第二課GUI界面編寫與人機(jī)交互1) set gui_out = /tmp/gui_out.$2) set guin 二 /tmp/guin.$3) echo "WIN 200 200" > $gui_i n4) echo "FG 000000" >> $gui_in5) echo "B

33、G 328068" >> $gui_i n6) echo "FONT tbr14" >> $gui_i n7) echo "LABEL this panel gui :">> $gui_in8) echo "TEXT xsize 15 XSIZE: " >> $gui_i n9) echo "TEXT ysize 15 Y SIZE: " >> $gui_i n10) echo "TEXT xnum 15 XNUM: " &g

34、t;> $gui_i n11) echo "TEXT ynum 15 Y NUM: " >> $gui_i n12) echo "DTEXT ynum 1" >> $gui_i n13) echo "RADIO vcut '"V-CUT:"' H 1 88000 " >> $gui_i n14) echo "no" >> $gui_i n15) echo "yes" >> $gui_i n16)

35、 echo "END" >> $gui_i n17 )echo "OPTION layers 'nu mber of layers'" >> $gui_i n18) echo "2" >> $gui_i n19) echo "1" >> $gui_i n20) echo "4" >> $gui_i n21) echo "END" >> $gui_i n22) echo "FORM

36、" >> $gui_i n23) echo "BW 2" >> $gui_i n24) echo "BG 990099" >> $gui_i n25) echo "FG 009999" >> $gui_i n26) echo "LABEL Select panel name" >> $gui_i n27) echo "LIST pan el_name 3 s 1" >> $gui_i n28) echo "

37、;pa nel" >> $gui_i n29) echo "edit" >> $gui_i n30) echo "orig" >> $gui_i n31) echo "END" >> $gui_i n32) echo "ENDFORM" >> $gui_i n33) echo "CLABEL OK" >> $gui_i n34) /ge nesis/e91/all/gui $gui_in > $gui_out35) source $gui_out36) echo “ xsize value $xsize ”37) echo“ ysize value $ysize”38) echo“ xnum value $xnum”39) echo“ ynum va