第 5 回 iphone アプリ勉強会 age 〜 日付と多言語対応

27
第 5 第 iPhone 第第第第第第 Age 第 第第第第第第第第 竹竹竹 竹竹

Upload: ethan-floyd

Post on 31-Dec-2015

23 views

Category:

Documents


2 download

DESCRIPTION

第 5 回 iPhone アプリ勉強会 Age 〜 日付と多言語対応.                       竹ノ内 信寛. はじめに. アプリケーションの概要 前準備 チュートリアル: Age プロジェクトの作成 ビュー・アイテムの作成 アウトレットやアクションの接続 日付の期間の処理 x ib ファイルのローカライズ アイコンと名前のローカライズ エイジの改良・発展 本勉強会で使用する教科書. アプリケーションの概要. デイト・ピッカーで日付を設定すると その日付から今日までの時間を返すアプリ 表示単位を指定して、表示される数値を 変更できる. - PowerPoint PPT Presentation

TRANSCRIPT

Page 1: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

第 5 回 iPhone アプリ勉強会      Age 〜 日付と多言語対応

                      竹ノ内 信寛

Page 2: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

2

はじめに

• アプリケーションの概要• 前準備• チュートリアル: Age

– プロジェクトの作成– ビュー・アイテムの作成– アウトレットやアクションの接続– 日付の期間の処理– xib ファイルのローカライズ– アイコンと名前のローカライズ– エイジの改良・発展

• 本勉強会で使用する教科書

Page 3: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

3

アプリケーションの概要

デイト・ピッカーで日付を設定するとその日付から今日までの時間を返すアプリ

表示単位を指定して、表示される数値を変更できる

Page 4: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

4

前準備

• 画像ファイルの準備– アプリ作成に使用する画像ファイルを用意する– 用意した画像を Images フォルダにまとめる

• X-Code を立ち上げる

Page 5: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

5

チュートリアル: Age

• STEP1: プロジェクトの作成– 新規プロジェクト「 Age 」の作成– 作成したプロジェクトの Resources を選択し

lmages フォルダを追加– AgeViewController.h , AgeViewController.m も

同様に追加 ( このとき古いファイルを削除する )

Page 6: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

6

チュートリアル: Age

• STEP2: ビュー・アイテムの作成 -1– ビューとライブラリを開く– ライブラリの Data Views にある Date Picker を貼り付ける– Attributes インスペクタを開く– Mode を Date に変更する

Page 7: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

7

チュートリアル: Age

• STEP2: ビュー・アイテムの作成 -2– ライブラリの Input&Values にある Segmented Control を貼り付ける– Segments に「3」を入力して enter キーを押す– Title に「 Years 」を入力する– ポップアップメニューでセグメントを変更し

同様に「 Months 」 , 「 Days 」を入力する

Page 8: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

8

チュートリアル: Age

• STEP2: ビュー・アイテムの作成 -3– ライブラリの Input&Values にある Label を貼り付ける– Text に「 12345 」と入力する– Layout のを中央揃えに変更する– フォントの大きさを変更する

Page 9: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

9

チュートリアル: Age

• STEP2: ビュー・アイテムの作成 -4– Birthday ラベルと Age ラベルを追加する– ビュー編集ウィンドウ上のラベルのハンドルをドラッグし

位置やサイズを調整する

Page 10: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

10

チュートリアル: Age

• STEP3: アウトレットやアクションの接続 -1– Xcode で AgeViewController.h を開く– 以下のアウトレットとアクションを宣言する

Page 11: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

11

チュートリアル: Age

• STEP3: アウトレットやアクションの接続 -2– Xib ウィンドウの File’s Owner を右クリック– birthdayPicker をデイト・ピッカーに接続する– ageLabel を age ラベルに接続する– resultLabel を計算結果表示ラベルに接続する– unitControl をセグメンティッドコントロールに接続する

Page 12: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

12

チュートリアル: Age

• STEP3: アウトレットやアクションの接続 -3– Calc アクションをデイト・ピッカーと

セグメンティッド・コントロールに接続する– どちらもイベント・タイプを Value Changed とする– Xib ファイルを保存する

Page 13: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

13

チュートリアル: Age

• STEP4: 日付の期間の処理 -1– Xcode で AgeViewController.m を開く– calc アクションに対応するメソッドを追加する

– コードの説明

NSDate *birthday = birthdayPicker.date;

誕生日の日付をデイト・ピッカーの date プロパティから取得する

NSDate *today = [NSDate date];

今日の日付を NSDate クラスのインスタンスとして取得する

Page 14: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

14

チュートリアル: Age

• STEP4: 日付の期間の処理 -2– 続・コードの説明

NSCalendar *gregorian = [[NSCalendar alloc]initWithCalendarIdentifier:NSGregorianCalendar];

デイト・ピッカーはグレゴリオ歴 * で扱われるのでグレゴリオ暦のカレンダーを用意する

NSUInteger unitFlags = NSYearClaendarUnit;

期間の単位として年を表す NSYearCalendarUnit という定数を用いる

* : グレゴリオ歴とは , 4 年に 1 度の閏年と , 年数が 100 で割り切れて且つ 400 で割り切れない年は  閏年としない , という調整を行い , 平均年を太陽年 ( 約 365.2422 日 ) に近似した暦である .

Page 15: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

15

チュートリアル: Age

• STEP4: 日付の期間の処理 -3– 続々・コードの説明

NSDateComponents *components = [gregorian components:unitFlagsfromDate:birthdaytoDate:todayoptions:0];

NSCalendar クラスの components:fromDate:toDate:options: メソッドを使って日付の計算を行う

NSInteger age = [components year];

Components は複数の単位を含めることができるため , 数値を取得するときに単位を指定する

Page 16: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

16

チュートリアル: Age

• ビルドして進行を押して動作確認

Page 17: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

17

チュートリアル: Age

• STEP5:xib ファイルのローカライズ -1– ユーザの使用言語に合わせて表示言語を

変えるために , ローカライズを行う– AgeViewController.xib を選択し , アクションから「情報を見る」を選択– 「ファイルをローカライズ可能にする」を選択する– 一般タグから「 Japanese 」というローカリゼーションを追加する

Page 18: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

18

チュートリアル: Age

• STEP5:xib ファイルのローカライズ -2– プロジェクトウィンドウの AgeViewController.xib (Japanese) をダブルクリック– View のラベルやセグメンティド・コントロールを対応する日本語に変更

Page 19: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

19

チュートリアル: Age

• STEP5:xib ファイルのローカライズ -3– デイト・ピッカーの Locale を日本語(日本)に変更– AgeViewController.xib を保存して完了– これで日本語環境化では日本語表示になる– ローカライズが反映されない場合はファイルのクリーニングを行う

Page 20: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

20

チュートリアル: Age

• STEP6: アイコンと名前のローカライズ -1– Xib ファイルと同様にアプリのアイコンのローカライズを行う– Resouces から Icon.png を選択してローカライズする– うまく反映されない場合は Age-Info.plist ファイルを開き

Icon に Icon.png と入力する

Page 21: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

21

チュートリアル: Age

• STEP6: アイコンと名前のローカライズ -2– 同様にアプリの名前のローカライズを行う– Resouces を選択して新規ファイルを作成– 空のファイルを選択し「 InfoPlist.strings 」という名前で保存

Page 22: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

22

チュートリアル: Age

• STEP6: アイコンと名前のローカライズ -3– InfoPlist.strings に以下のテキストを入力し保存

– InfoPlist.strings をローカライズ可能にして「 Japanese 」を追加– InfoPlist.strings の Japanese を選択してテキストを以下のように編集

Page 23: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

23

チュートリアル: Age

• ビルドして進行を押してホーム画面でのアイコンの表示を確認する

• 設定から表示言語と書式を日本語にして日本語環境での表示を確認する

Page 24: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

24

チュートリアル: Age

• STEP7: コード中テキストのローカライズ– Resources を選択して空のファイルを作成– ファイル名を「 Localizable.strings 」として保存– Localizable.strings のテキストを以下のように編集して保存

– Localizable.strings をローカライズして Japanese の方のテキストを以下のように編集して保存

Page 25: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

25

チュートリアル: Age

• ビルドして進行を押して表示を確認

Page 26: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

26

チュートリアル: Age

• STEP8: エイジの改良・発展– 新しいアイディアをアプリケーションに実現してみよう– 以下にいくつかの例を示す

1  年齢を時間単位 , 分単位 , 秒単位でも表示できるようにする 2  任意の日における年齢が表示できるようにする3  起点となる日付と日数を設定すると , 終了日となる日付を表示できるようにする4  グレゴリオ歴以外の暦のカレンダーを表示する5  時分秒単位の時間計算機を作る

Page 27: 第 5 回 iPhone アプリ勉強会 Age 〜  日付と多言語対応

27

おわりに

• アプリケーションの概要• 前準備• チュートリアル: Age

– ビュー・アイテムの作成– アウトレットやアクションの接続– 日付の期間の処理– xib ファイルのローカライズ– アイコンと名前のローカライズ– コード中テキストのローカライズ– エイジの改良・発展

 次回の予定“iPhoneSDK の教科書”のサンプルプログラムを勉強

CounterSmashBalanceClockAgePile