
例如 GUIDemo 中有 New 、 Load 、 Save 、 Encode 、 Decode 、 Clear 與 Copy 等七個按鈕,我們替每個按鈕設計一個方法,使按下按鈕後就將 @display 的文字標籤顯示按下哪個按鈕。程式如下
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 | require "tk" class GUIDemo def initialize # 每個 command 的設定 p_new = proc {newMethod} p_load = proc {loadMethod} p_save = proc {saveMethod} p_encode = proc {encodeMethod} p_decode = proc {decodeMethod} p_clear = proc {clearMethod} p_copy = proc {copyMethod} p_input = proc {inputMethod} # 設定 GUI 各元件 root = TkRoot.new { title "EncryptGUI Demo" } @inputText = TkLabel.new(root) { text "Input:" width 8 height 1 grid( 'row' => 0 , 'column' => 0 ) } @inputField = TkEntry.new(root) { width 60 grid( 'row' => 0 , 'column' => 1 , 'columnspan' => 6 ) } @outputText = TkLabel.new(root) { text 'Output:' width 8 height 1 grid( 'row' => 1 , 'column' => 0 ) } @outputField = TkEntry.new(root) { width 60 grid( 'row' => 1 , 'column' => 1 , 'columnspan' => 6 ) } @newButton = TkButton.new(root) { text "New" grid( 'row' => 2 , 'column' => 0 ) command p_new } @loadButton = TkButton.new(root) { text "Load" grid( 'row' => 2 , 'column' => 1 ) command p_load } @saveButton = TkButton.new(root) { text "Save" grid( 'row' => 2 , 'column' => 2 ) command p_save } @encodeButton = TkButton.new(root) { text "Encode" grid( 'row' => 2 , 'column' => 3 ) command p_encode } @decodeButton = TkButton.new(root) { text "Decode" grid( 'row' => 2 , 'column' => 4 ) command p_decode } @clearButton = TkButton.new(root) { text "Clear" grid( 'row' => 2 , 'column' => 5 ) command p_clear } @copyButton = TkButton.new(root) { text "Copy" grid( 'row' => 2 , 'column' => 6 ) command p_copy } @displayText = TkLabel.new(root) { text 'something happened' width 65 height 1 ; grid( 'row' => 4 , 'column' => 0 , 'columnspan' => 7 ) } end # 建立新 Encrypt 物件 def newMethod @displayText .text = "This is New Button." end # 載入儲存的密碼表 def loadMethod @displayText .text = "This is Load Button." end # 儲存密碼表 def saveMethod @displayText .text = "This is Save Button." end # 進行編碼 def encodeMethod @displayText .text = "This is Encode Button." end # 進行解碼 def decodeMethod @displayText .text = "This is Decode Button." end # 清除所有輸入、輸出 def clearMethod @displayText .text = "This is Clear Button." end # 拷貝編碼結果到剪貼簿 def copyMethod @displayText .text = "This is Copy Button." end end GUIDemo.new Tk.mainloop = begin 《程式語言教學誌》的範例程式 檔名:tkdemo2.rb 功能:示範 Ruby 程式 作者:張凱慶 時間:西元 2012 年 12 月 = end |
這裡 command 用變數設定的原因是要放在之後的大括弧裡,每一個變數的等號右邊先用 proc ,然後再用大括弧寫對應的方法名稱,例如 New 按鈕用變數 p_new ,對應到方法 newMethod
5 6 7 8 9 10 11 12 13 | # 每個 command 的設定 p_new = proc {newMethod} p_load = proc {loadMethod} p_save = proc {saveMethod} p_encode = proc {encodeMethod} p_decode = proc {decodeMethod} p_clear = proc {clearMethod} p_copy = proc {copyMethod} p_input = proc {inputMethod} |
然後在按鈕的地方,例如 New 按鈕,就加上 command 與變數名稱即可
42 | command p_new |
執行後,點擊一下 Encode 按鈕

接下來,我們要開始整合 Encrypt 類別 (class) 囉!
中英文術語對照 | |
---|---|
事件 | event |
方法 | method |
類別 | class |
您可以繼續參考
GUI 篇
相關目錄
回 Ruby 入門指南
回 Ruby 教材
回首頁
參考資料
http://www.ruby-doc.org/docs/ProgrammingRuby/html/ext_tk.html
http://www.tutorialspoint.com/ruby/ruby_tk_guide.htm
沒有留言:
張貼留言