Ruby 入門指南 - 加入 command

Tk 的 GUI 事件 (event) 由替每個視窗元件設定 command , command 就是指定與該元件連動的方法 (method)




例如 GUIDemo 中有 NewLoadSaveEncodeDecodeClearCopy 等七個按鈕,我們替每個按鈕設計一個方法,使按下按鈕後就將 @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

沒有留言: