延續從物件類別到GUI Application(二),我們提到可以使用同一個類別來製作跨平台的GUI Application,所以我們一樣沿用Encrypt這一支Class來製作第三部分 – iOS Application.

20

首先,我們必須建立一個iOS專案,在建立專案的時候,在左邊的選單選擇iOS->Application,並在右邊選擇Single View Application,如圖:
1

 

 

然後選擇一個喜歡的名稱以及儲存的位置:

2

建立專案完成之後,我們可以看到左邊擁有一個Main.storyboard,他是iOS的介面的主要檔案,所有的畫面都會在這個Storyboard裡面做編輯,我們剛開始打開的時候會是一個空白的專案:

3

 

接著我們從右下角將我們想要的元件拉近去畫面當中,與上一篇主題相似,使用TextField、Lebel之類的元件來建立我們要的畫面,當然要怎麼排就隨自己喜歡了。

4

 

而我多選擇了一個「Segmented Control」元件來進行加密與解密的切換,所以大家也記得要選擇這個喔!

5

 

製作好了自己喜歡的樣子之後,我們看到左邊的檔案導覽列,有一個在專案建立的時候就擁有的ViewController類別,這個類別則是用來控制這個Single View Application的所有事情,所以等一下我們想要實作「輸入文字且加密顯示或解密顯示」、「切換加密或解密」這兩個功能的實作也會在這個Controller裡面做撰寫。

6

 

 

在回到Storyboard,我們將會在Controller用到的元件連接到ViewController.h這支Interface檔案裡面,方法是按著Ctrool按鍵並且拖曳到右邊的檔案當中,所以我們總共要連結的元件有「inputTextField」、「outputTextFiled」、「somethingLabel」三個元件:

7

8

 

上面的元件連結就只用一個做示範,其他兩個的方法也一樣,接下來要連結的就是執行程式的時候所會發生的「動作」,我們打算讓TextField透過使用者按下虛擬鍵盤的Return按鈕之後直接將鍵盤收起來並且可以執行加密或解密的動作,而不用透過按其他按鈕的步驟,所以,我們一樣按著Control按鈕並且拖曳到Interface檔案當中,取一個喜歡的名字,並將Connection這個選項改成「Action」,系統才知道這樣的連結是一個「動作」的連結喔!而這一個「事件」稱之為「Did End On Exit」。

9

10

 

而「Segmented control」這個元件也用一樣的方式加入,但他的動作「事件」是「Value changed」,都連結完成之後,可以看選擇想要確認的元件,並且查看右邊的ViewController.h檔案當中有沒有相對應的標記。

11

 

接下來我們打開ViewController.m檔案,來查看我們剛剛加入的「Action」是否有自動建立了method來等著我們實作?答案當然是肯定的XD,圖片中有一個黑黑的地方是因為怕誤導大家(過程中忘記刪除的錯誤程式碼XD),所以大家就不要太介意了。

12

 

首先我們在回想我們整個Application需要的功能,就是要「加密及解密」,所以當然不能忘記我們最一開始已經新增近來的Encrypt類別,所以我們在ViewController.h檔案中新增一個property,型態是Encrypt類別,名為encrypt的物件。

接下來,我們還必須判定Segmented Control目前選定哪一個值(用來決定要加密還是解密),所以我多新增了一個encodeOrDecode這個整數變數,用來記錄這個值:

13

 

然後回到ViewController.m當中加上synthesize,把所有的property加進來:

14

 

接下來先看看「viewDidLoad」這個一開始就存在的method,它是程式用來做畫面Load的時候會使用的method,有別於上一篇文章,我們不再建立一個叫做new的按鈕來建立新的物件,而是將建立物件與初始化的動作放在這邊,所以程式意執行的時候就會有一個encrypt被allocate何Initialize,而我們另外江encodeOrDecode變數的初始值設成1,並在outputSomethingLabel當中顯示現在的模式是Encode,另外還有兩行程式碼,是用來定義TextField在被選取的時候,會自動顯示可以把TextField清空的叉叉按鈕,相當好用。

15

 

接下來的兩個method是用來實作我們想要的任務,分別是顯示我們要的結果以及選擇不同的功能,程式碼很簡單若encodeOrDecode是0的話就做加密,並且把加密的字串顯示出來,並放在outputTextField當中方便我們在copy來測試做解密的動作,若是1的話就做解密,道理就差不多囉。

16

 

changeFunction用來切換功能,segmented內有一個selectedSegmentIndex可以用來判定選了哪一個選項,由左至右就是0、1…類推,我們就可以用它來切換encodeOrDecode的值,補充一下,可能會有人覺得很多此一舉,但因為我一開始沒想到可以直接判斷seletedSegmentIndex的值…XD,加上比較容易釐清概念(命名還算有點意義吧!? XD),所以就不特別改啦!

17

 

最後,按下左上角的Run,就可以看到畫面並測試了。

1819

最後,附上ViewController的程式碼:

#import <UIKit/UIKit.h>
#import "Encrypt.h"

@interface ViewController : UIViewController

@property (retain) Encrypt *encrypt;

@property (weak, nonatomic) IBOutlet UILabel *inputTextLabel;
@property (weak, nonatomic) IBOutlet UILabel *decodeTextLabel;
@property (weak, nonatomic) IBOutlet UILabel *encodeOrDecodeTextLabel;


@property (weak, nonatomic) IBOutlet UITextField *inputTextField;
@property (weak, nonatomic) IBOutlet UITextField *outputTextField;

@property (weak, nonatomic) IBOutlet UISegmentedControl *functionSwitchSegmentedControl;
@property int encodeOrDecode; //0 is encode,1 is decode

- (IBAction)display:(id)sender;
- (IBAction)valueChanged:(id)sender;

@end

 

#import "ViewController.h"

@implementation ViewController

@synthesize inputTextField,outputTextField,inputTextLabel,decodeTextLabel,functionSwitchSegmentedControl;
@synthesize encodeOrDecode,encodeOrDecodeTextLabel;
@synthesize encrypt;

- (void)viewDidLoad
{
    [super viewDidLoad];
    encodeOrDecode = 0;
    inputTextLabel.text = @"Changed the mode to Encode. ";
    
    //當在編輯模式時,TextField自動變成擁有清除按鈕的模式
    inputTextField.clearButtonMode = UITextFieldViewModeWhileEditing;
    outputTextField.clearButtonMode = UITextFieldViewModeWhileEditing;
    
    
    encrypt = [[Encrypt alloc] initRandomEncrypt];
	// Do any additional setup after loading the view, typically from a nib.
}

- (void)didReceiveMemoryWarning
{
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

- (IBAction)display:(id)sender {
    [sender resignFirstResponder];
    inputTextLabel.text = inputTextField.text;
    
    if(encodeOrDecode == 0)
    {
        decodeTextLabel.text = [encrypt toEncode:inputTextField.text];
        outputTextField.text = decodeTextLabel.text;
    }
    else if (encodeOrDecode == 1)
        decodeTextLabel.text = [encrypt toDecode:inputTextField.text];
}

- (IBAction)valueChanged:(id)sender {
    switch (functionSwitchSegmentedControl.selectedSegmentIndex) {
        case 0:
            encodeOrDecode = 0;
            inputTextLabel.text = @"Changed the mode to Encode. ";
            encodeOrDecodeTextLabel.text = @"After Encode";
            break;
            
        case 1:
            encodeOrDecode = 1;
            inputTextLabel.text = @"Changed the mode to Decode. ";
            encodeOrDecodeTextLabel.text = @"After Decode";
            break;
            
        default:
            break;
    }
}

@end

 

一支iOS的簡單程式就完成囉!

 

Reference:

精通objective-c程式設計 第六版