hello ios sdk & objective-c
DESCRIPTION
about UIKit/Foundation FrameworksTRANSCRIPT
Hello iOS and Objective-C !
UIKit/Foundation Frameworks
compatible with
iOS5.x
Nobuhiro TakahashiOS X / iOS Developer
http://feb19.jp
Mac OS X Appスマホサイト画像最適化ツール
ImageBind
Presenter
http://itunes.apple.com/jp/app/image-bind/id530343153?mt=12
iPhone を買った。Mac を買った。Xcode を入れた。アプリを作ろう。でも何を知ればいいの? Objective-C?フレームワーク?まずは
UIKit/Foundation Frameworksを触ってみよう。
フレームワークとはクラスの集まりのことUIKit Frameworks は Foundation Framework の NSObject を源流に持つiOS 用コンポーネント群のフレームワーク
NSObject
NSString NSArray
UIResponder
UIView UIViewController
UIControl
UIButton
UIKitFramework
FoundationFramework
FoundationFramework
Chapter #1
プリミティブ型のクラスやネットワーク接続用のクラスなどを提供する
Objective-C でプログラミングするなら必ず使う基本フレームワーク
Foundation Framework 代表的なクラス
NSObject
NSString
NSNumber
NSData
NSDate
NSURL
NSArray
NSDictionary
NSSet
全てのクラスのルートクラス (生成、比較、メモリ管理)alloc, init isEqual: retain, release, autorelease, dealloc
様々なエンコード (ASCII, UTF-8 など) の文字列をラップするクラス※Objective-C の「プリミティブ型」的なものは、全て「ラッパークラス」
配列をラップするクラス
連想配列をラップするクラス
バイナリデータをラップするクラス
様々な数字をラップするクラス
日付をラップするクラス
URL をラップするクラス
オブジェクトの集まりをラップするクラス
NSString
文字列を格納する
Objective-C の文字列は @”hello” と書くObjective-C は C 言語をラップしたような言語なので、他の言語を触ってきた人には変な言語に見えるかもしれない。
char *str = "Hello";printf("%s", str);
[C言語] 文字列の生成と出力
NSString *str = @"Hello";NSLog(@"%s", str);
[Objective-C] 文字列の生成と出力
NSString *str = [[NSString alloc] initWithString:@"Hello"];NSLog(@"%s", str);
[Objective-C] 別の書き方
NSString *str = [NSString stringWithString:@"Hello"];NSLog(@"%s", str);
[Objective-C] さらに別の書き方
NSString
文字列の結合や文字列比較には演算子ではなく専用のインスタンスメソッドを使用する
NSString *str1 = @"Hello";NSString *str2 = [str1 stringByAppendingString:@" world!"];NSLog(@"%s", str2);
[Objective-C] 文字列の結合
NSString *str = @"Hello";if ([str isEqualToString:@"Hello"]) { NSLog(@"Hello.");}
[Objective-C] 文字列の比較
NSString *str = @"1000";if ([str intValue] > 500) { NSLog(@"ok");}
[Objective-C] 数値に変換
NSMutableString
ミュータブルな String=変化できる String(ミュータブルはミュータントの形容詞)ミュータブルストリングではないただのストリングは途中で内容の変更ができないただしただのストリングの方がメモリの使用量などは少ない ※初心者は全部ミュータブルにしてしまえ!
NSMutableString *str = [NSMutableString string];[str appendString:@"Hi"];[str appendFormat:@", my favorite number is %d.", 128];[str appendString:@" Thank you."];NSLog(@"%s", str);
[Objective-C] 一つの文字列を変化させていく一連のコード
他にも NSArray に対しての NSMutableArrayNSData に対しての NSMutableDataNSDictionary に対しての NSMutableDictionary NSSet に対しての NSMutableSet などが用意されている
NSNumber に対しての NSMutableNumber は無い
NSArray
オブジェクトを保持する順番リスト(配列)を格納する
NSArray *array = [NSArray arrayWithObjects:@"Red", @"Blue", @"Green", nil];if ([array indexOfObject:@"Purple"] == NSNotFound) { NSLog(@"No color purple.");}
[Objective-C] 配列を作成してオブジェクトが存在するか確認する
NSArray に格納されるオブジェクトは Objective-C のオブジェクトなのでint や float や char などは格納できないので、NSNumber や NSString に変換する
NSMutableArray *array = [NSMutableArray arrayWithObjects:@"first", nil];NSNumber *number = [NSNumber numberWithInt:1000];[array addObject:number];char *c = "aaa";NSString *string = [NSString stringWithCString:c encoding:NSUTF8StringEncoding];[array addObject:string];
[Objective-C] int や char を NSMutableArray に追加する
NSDictionary
キーから値を取りだす「辞書」を格納する
NSDictionary *colors = [NSDictionary dictionaryWithObjectsAndKeys:@"Red", @"Color 1", @"Green", @"Color 2", @"Blue", @"Color 3", nil];
NSString *firstColor = [colors objectForKey:@"Color 1"];
[Objective-C] 辞書を作成してオブジェクトを取り出す
UIKitFramework
Chapter #2
Mac OS X との違いを補完しiOS 用のユーザーインターフェースを用意するフレームワーク
iOS 特有の「タッチできるぐらい大きいボタン」や「一度に表示する画面はただ一つ」「項目が縦に並ぶリスト」など見た目や
iOS には不要な情報を捨てて、iOS 独自の情報を取得できるクラスも用意「デバイスの傾き」「バッテリー残量」「iOS に最適化した画像データ」
UIKit には iOS 用コンポーネント群が定義されている
ViewController
Table ViewController
NavigationController
Tab BarController
Split ViewController
Page ViewController
GLKit ViewController
Object
Label
Round RectButton
SegmentedControl
Text Field
Slider
Switch
ActivityIndicatorView
ProgressView
Page Control
Stepper
TableView
TableViewCell
ImageView
TextView
WebView
MapView
ScrollView
DatePicker
PickerView
iAdBannerView
GLKitView
TapGestureRecognizer
PinchGestureRecognizerRotation
GestureRecognizer
SwipeGestureRecognizerPan
GestureRecognizer
LongPressGestureRecognizer
View
NavigationBar
NavigationItem
SearchBar Search Bar
and SearchDisplayController
Toolbar
BarButtonItem
FixedSpace BarButtonItem
FlexibleSpace BarButtonItem
Tab Bar
Tab BarItem
※一部 UIKit 以外のフレームワークのコンポーネントが含まれています
UIKit のユーザーインターフェース系のクラスでは「タッチイベント」を受け取ることができる
touchesBegan:withEvent:touchesMoved:withEvent:touchesEnded:withEvent:touchesCancelled:withEvent:
UIWindow
スクリーンに表示するアプリケーションのウィンドウを管理する
アプリにつき一つだけ存在する
View1
UIView
画面上に設置する矩形の表示エリア
テキストラベル、ボタン、画像など様々なタイプがある表示オブジェクトアプリにつき無数に存在する
View の中に View を入れて入れ子にすることもできる(位置情報に注意)
(0,0)+ x
y
View2
(70,170)
SubView1(10,100)
SubView2(10,60)
ViewController’sView
UIViewController
UIView などの表示オブジェクトを管理する一つのシーン、画面に対して一つが一般的
タブ、ナビゲーションなどが使用されている場合は複数使うこともある
ViewController 自体が View を持っている (ViewController.view) ので、そこに色々 View (ラベル、ボタン、画像など) を配置する
UIScreen
UIImageUIFont
UIDevice
UIColor UIAcceleration
UIView
ユーザーインターフェース以外を操作することができる UIKit のクラス
ユーザーインターフェース系のクラス
UIKit
UIWindow
UIViewController
色
画面情報
フォント
加速度
デバイス情報
画像データ
画面
ビュー
シーン
UIResponder
タッチに反応するオブジェクト
他色々 他色々
Single View Application
基本的には Xcode で新規作成するプロジェクトはこれを使おう
Window が生成されていて一つその中に ViewController が用意されているテンプレートUIWindow にルート用の ViewController を指定されている
この ViewController に色んな View を生成して乗せることでアプリを作っていくことをまずは覚えてみよう
UIViewChapter #2-2
座標 (10, 10) に大きさ (300, 100) で View を生成して、親のビュー(スーパービュー)に乗せる
UIView *aView = [[UIView alloc] initWithFrame:CGRectMake(10,10,300,100)];[superView addSubview:aView];
- (void)removeFromSuperview;- (void)insertSubview:(UIView *)view atIndex:(NSInteger)index;- (void)bringSubviewToFront:(UIView *)view;
UIView の主なメソッド
(CGRect) frame(BOOL) hidden(BOOL) userInteraction
UIView の主なプロパティ
View 0-0
View 1-1 View 1-2View 1-0
View 2-0 View 2-1
View 1-2 に対しての Superview
View 1-2 に対しての Subview
表示リストSubview は一つの Superview を持つSuperview は複数の Subview を持つことができる
UIView
View Class HierarchyUIView クラスを基底にして無数のサブクラスが存在するUIView クラスの機能はサブクラスに継承される
UIView
UIWindow UILabel UIPickerView UIProgressView UIActivityIndicatorView
UIImageView UITabBar UIToolBar UINavigationBar UITableViewCell
UIActionSheet UIAlertView UIScrollView UIWebView UIControl
UITableView UITextView
UIButton UIDatePicker UIPageControl
UISegmentedControl UITextField UISlider
UISwitch
UILabel
read-only なテキスト表示用ビュー
こんにちは
UIImageView
画像を表示する用のビュー ‘ ‘
UIImage *image = [UIImage imageNamed:@"illustration.png"];UIImageView *imageView = [[[UIImageView alloc] initWithImage:image] autorelease];[window addSubview:imageView];
生成と設置UIImage というオブジェクトを作成して UIImageView にはめ込むXcode のプロジェクトペインにドラッグアンドドロップしてインポートした画像を使用してみましょう
[imageView removeFromSuperview];
生成と設置
取り除く
UIImageView UIImage
Other View
setImage:
addSubview:
UIView
UIWindow UILabel UIPickerView UIProgressView UIActivityIndicatorView
UIImageView UITabBar UIToolBar UINavigationBar UITableViewCell
UIActionSheet UIAlertView UIScrollView UIWebView
UITableView UITextView
UIControl
UIButton UIDatePicker UIPageControl
UISegmentedControl UITextField UISlider
UISwitch
UIControl
タッチイベントを検知して「コントロール機能」を提供するビュー
指定されたイベントが発生したらターゲットオブジェクトへアクションメッセージを送信する
UIButton
ボタン用のビュー色んな形のボタンが用意されている
UIControl のサブクラス
He l lo
[button addTarget:self action:@selector(buttonWasTapped:) forControlEvents:UIControlEventTouchUpInside];
[Objective-C] ボタンがタップされたら自分 (self) に buttonWasTapped: を送信するよう設定
- (void) buttonWasTapped:(id)sender{ NSLog(@"Button Was Tapped!");};
[Objective-C] メッセージを受け取ったら実行するメソッド
ボタンのインタラクションUIButton など UIControl 系のビューは「~されたらメッセージを送信する」ことができる※「メッセージを送信する」=メソッドを呼び出す(この言い方はこの言語の成りたちに由来している)
[UIControl addTarget:(id)target action:(SEL)action forControlEvents:(UIControlEvents)controlEvents];
[Objective-C] UIControl のメソッド。controlEvents が発生したら target に action を送信する
XcodeChapter #3
(応用編)今までのスライドの知識を使ってアプリを作る
Xcode でアプリケーションを新規作成
適当な場所に保存するとプロジェクトが作成され、Xcode の画面に戻る
画面左上が iPhone x.x Simulator となっているのを確認して ▶ Run をクリックするとMac 上で iOS シミュレータが動作して空のアプリが実行されるのを確認する
Xcode のメニューから File > New > Project > iOS > Application > Single View Application を選択
ProductNameHello World (アプリ名)
Organization NameTakahashi Nobuhiro (制作者名)
Company Identifierjp.feb19 (アプリ ID)
Class Prefix
DevicesiPhone (ターゲットデバイス)
Use StoryboardsNO
Use Automatic Reference CountingYES
Include Unit TestNO
- (void)viewDidLoad{ [super viewDidLoad];! // Do any additional setup after loading the view, typically from a nib. UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0,0,320,30)]; label.text = @"Hello World."; [self.view addSubview:label];}
[Objective-C] UILabel を表示する
再度 ▶ Run すると画面に Hello World. と表示されることを確認する
新規作成したプロジェクトに自前のコードを加えていく左側にあるプロジェクトファイルペインから ViewController.m を選択してコードエディタを表示ちょっとだけコードを足してみよう
Hello World
UILabel *label_;
- (void)viewDidLoad{ [super viewDidLoad];! // Do any additional setup after loading the view, typically from a nib. UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0,0,320,30)]; label.text = @"Hello World."; [self.view addSubview:label]; label_ = label; UIButton *button = [UIButton buttonWithType:UIButtonTypeRoundedRect]; button.frame = CGRectMake(110, 200, 100, 50); [button setTitle:@"CLEAR" forState:UIControlStateNormal]; [self.view addSubview:button]; [button addTarget:self action:@selector(clearLabel:) forControlEvents:UIControlEventTouchUpInside];}
- (void)clearLabel:(UIButton *)button{ [label_ removeFromSuperview];}
[Objective-C] UIButton を作成してラベルを消す
再度 ▶ Run して、ボタンをタップするとラベルが消えることを確認する
新規作成したプロジェクトに自前のコードを加えていく2さらにコードを加えてみようボタンを設置してラベルを消してみよう
Hello World
CLEAR
UILabel *label_;int count = 0;
- (void)viewDidLoad{ [super viewDidLoad];! // Do any additional setup after loading the view, typically from a nib. UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0,0,320,30)]; label.text = @"Hello World."; [self.view addSubview:label]; label_ = label; UIButton *button = [UIButton buttonWithType:UIButtonTypeRoundedRect]; button.frame = CGRectMake(110, 200, 100, 50); [button setTitle:@"CLEAR" forState:UIControlStateNormal]; [self.view addSubview:button]; [button addTarget:self action:@selector(clearLabel:) forControlEvents:UIControlEventTouchUpInside];}
- (void)clearLabel:(UIButton *)button{ NSArray *array = [NSArray arrayWithObjects:@"いっかいめ", @"にかいめ", @"さんかいめ", @"それいじょう", nil]; label_.text = [array objectAtIndex:count]; if (count < 3) { count++; }}
[Objective-C] UIButton を作成してラベルを消す
再度 ▶ Run して、ボタンをタップするたびにラベルの表示が変わることを確認する
新規作成したプロジェクトに自前のコードを加えていく3さらにコードを加えてみよう条件分岐や NSArray を使ってボタンをタップすると表示を変えてみる
Hello World
CLEAR
Let’s make an application!
♂♀クイズ
①Google 画像検索などで
「ニューハーフ」「美しすぎる男性」などと検索して
男性か女性か分かりにくい画像を探してください
②UIImageView を使って画像を表示してください
③UIButton を押すと、UILabel で答えを表示してください
④10問出題してください
⑤最後は UILabel で「お疲れさまでした!」表示と
とびきりの画像を見せてあげてください
♂♀クイズ
♂ ♀
正解!
残り 3/10 残り 4/10
次へ 最初から
THANK YOUFOR PLAYING!
正解率 50%
♂♀クイズ
最後に実践チャレンジ!
UICatalog必見!UIKit を一通り触ることができる Apple 製サンプルコードhttp://developer.apple.com/library/ios/#samplecode/UICatalog/
iColors - Color SwatchesiPhone 上で RGB カラーチップを確認、作成できるユーティリティツール作成したカラーを HTML 化してメールでエクスポートすることも
http://itunes.apple.com/jp/app/icolors-color-swatches/id414588543?mt=8
お疲れさまでした!
Hello iOS and Objective-C !
UIKit/Foundation Frameworks