2012年10月1日 星期一

IOS多國語系規劃與開發-ios multi language design and imeplementation

多國語系是在APP的規劃與開發設計中是一個很重要的一環,很簡單的一個原因就是「市場」!其實說簡單也算是簡單,因為 SDK 本身就提供了多國語系的功能,我們只需要簡單的幾個步驟就可以達到,下面是簡單的步驟:

多國語系的規劃
  1. 規劃好哪些產出需要多國語系: UI, Message, Mail Template ..ext
  2. 決定好上面的東西要怎樣做,例如:是否要將XIB, infos.plist 變成多國語系, 是否要對圖檔做多國語系, 是否要將 Strings 與 Template 做成多國語系
  3. 作出一個 POC Template 與 Design Guideline for Multi-language 給 UI Design , Designer (Technical Designer), Programmer。
一個方式
個人喜歡的方式是將所有文字抽出來做成多國語系檔,因為這樣你只需要維護的是各種語系的文字檔案,但是這樣需要考慮到的是:
  1. 所有圖片不能含有文字,UI設計師只能使用IOS內建的字型,並且必續要產出 Design Guideline 讓開發人員清楚地知道每個UI的字形大小, 字型種類, 文字的色碼, 最多支援行數
  2. UI設計師必須在設計的時候清楚知道有多少種語言需要被支援,並且在設計所有 UI 元件的時候考慮到「文字長度」,並且在視覺設計上儘量在不破壞美觀下定義長寬的最大值
  3. Designer必須要將所有文字的 KEY 值作名稱規劃,並且需要讓所有 Programmer能藉由KEY值就能知道文字的用途。
這樣的設計方式可以達到多國語系的設計而且可以將所有語系的內容框在 Localizable.strings 與 Template File 裡,解由修改修改語系檔案或是 Mail or Publish template就可以快速地達到修改多國語內容的目的。

SDK也支援 XIB的多國語系設計方式,只是當 View component 跟多國語系攪在一起,那可想而知的是修改的 Effort 太大了。

開發步驟
  1. 建立 Localizable.strings Files, New 一個 File , 選擇 Resource > Strings File, 將它命名為 Localizable.strings
  2. 點選左側 Navigator 中的「專案名字」> 右側點選 Info , 右邊的 Localizations 可以增加你要支援的語言, 點選後會有詢問你哪些檔案要變成多國語系,以上面的例子因為我的方式只有用到 Localizable.strings 所以只要選擇 Localizable.strings就可以
  3. 編輯 Localizable.strings , 基本我將所有的 strings 分為下面幾個類別
    // button
    "Done" = "Done";
    "Close" = "Close";
    "Tutorials" = "Tutorial";
    // message
    "Please insert valid information" = "Please insert valid information";
    // label string
    "You’ve traveled" = "You’ve traveled";

    // exception string
    "The hardware does not support" = "The hardware does not support";
  4. 在程式裡取用所有的 strings 只需要如下的寫法
    cell.value.text = NSLocalizedString(@"You’ve traveled"nil);
  5. 若需要在 UI 上顯示現在使用者所選用的語言, 你可以使用下面的方法顯示出各國語言表現的語言文字, 像當選擇日文時會顯示「日本語」
     NSLocale *locale=[NSLocale currentLocale];
     NSString *langName= [locale displayNameForKey:NSLocaleIdentifier
                                                            value:[[NSLocale preferredLanguages] objectAtIndex:0]];

結論
很多種方式可以達道不同程度的多國語系方式,只是需要注意的層面不同,這樣做法上很簡單,但是對於設計來說會需要注意的地方很多,一不注意就會讓文字超出UI或是變成...。在開發上唯一需要注意的是 Key 的命名規則,否則平行開發下 Programmer 若看不懂語系檔那只會有兩種情形:一種是花很多時間去搞清楚什麼是什麼,第二種就是會多出很多同樣的文字參數。

2012年8月21日 星期二

ios : the best way to implement rotation 實現 rotation 的好方式

在開發 app 時候不免需要對翻轉效果做很多克制化,有的需要換掉整個界面,有的需要換背景,一般來說通常都需要針對那種看起來很簡單的東西寫很多程式,做起來很麻煩,真的是件很苦的差事。

下面是幾個我試過的方法

  1. 在 翻轉的時候去重新配置所有元件的位置
  2. 直接在翻轉後去換一個特定方向的 UIViewController
這兩種方法都很麻煩而且費工,簡直就是大茶包一個。


今天發現一個新的方法!
不僅簡單又方便,可以大大省去很多時間,下面這個 Method 是關鍵。

NSBundle UIKit Additions Reference
- (NSArray *)loadNibNamed:(NSString *)name owner:(id)owner options:(NSDictionary *)options



不囉唆來一段簡單的範例程式,相信簡單幾行大家就會很快地瞭解了。

- (void)willAnimateRotationToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
                                         duration:(NSTimeInterval)duration
{
    NSLog(@" do rotation of the view controller");
    
    if( UIInterfaceOrientationIsLandscape(interfaceOrientation) )
    {
        [self viewDidUnload];
        [[NSBundle mainBundle] loadNibNamed: [NSString stringWithFormat:@"%@-landscape", NSStringFromClass([self class])]
                                      owner: self
                                    options: nil];
        [self viewDidLoad];
        NSLog(@" landscape");
    }
    else
    {
        [self viewDidUnload];
        [[NSBundle mainBundle] loadNibNamed: [NSString stringWithFormat:@"%@", NSStringFromClass([self class])]
                                      owner: self
                                    options: nil];
        [self viewDidLoad];
        NSLog(@" portrait");
    }
}

利用 NSBundle loadNibNamed 的方法在 Rotation 的後去替換掉 Views,如此可以快速地在 NIB 上面拉UI 不需要再去用程式算出每個UIs的位置,這樣的話方便很多。

當然別忘記在 Reload Views之後重新 init 所有的 values與行為,不過我想這應該原本設計客制化的 UIs 的時候就已經做好了。