Hello iOS SDK & Objective-C
Upcoming SlideShare
Loading in...5
×
 

Hello iOS SDK & Objective-C

on

  • 3,013 views

about UIKit/Foundation Frameworks

about UIKit/Foundation Frameworks

Statistics

Views

Total Views
3,013
Views on SlideShare
2,504
Embed Views
509

Actions

Likes
5
Downloads
20
Comments
0

4 Embeds 509

http://feb19.jp 505
http://cloud.feedly.com 2
http://pinterest.com 1
http://reader.aol.com 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Hello iOS SDK & Objective-C Hello iOS SDK & Objective-C Presentation Transcript

  • Hello iOS and Objective-C !UIKit/Foundation Frameworks atibl e with comp iO S5.x
  • PresenterOS X / iOS DeveloperNobuhiro Takahashihttp://feb19.jpMac OS X Appスマホサイト画像最適化ツールImageBindhttp://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 UIResponder NSString NSArray UIView UIViewController UIControl UIButton UIKit Foundation Framework Framework
  • Chapter #1FoundationFramework
  • プリミティブ型のクラスやネットワーク接続用のクラスなどを提供するObjective-C でプログラミングするなら必ず使う基本フレームワーク
  • Foundation Framework 代表的なクラス alloc, init isEqual: retain, release, autorelease, deallocNSObject 全てのクラスのルートクラス (生成、比較、メモリ管理)NSString 様々なエンコード (ASCII, UTF-8 など) の文字列をラップするクラス ※Objective-C の「プリミティブ型」的なものは、全て「ラッパークラス」NSNumber 様々な数字をラップするクラスNSData バイナリデータをラップするクラスNSDate 日付をラップするクラスNSURL URL をラップするクラスNSArray 配列をラップするクラスNSDictionary 連想配列をラップするクラスNSSet オブジェクトの集まりをラップするクラス
  • NSString文字列を格納するObjective-C の文字列は @”hello” と書くObjective-C は C 言語をラップしたような言語なので、他の言語を触ってきた人には変な言語に見えるかもしれない。[C言語] 文字列の生成と出力char *str = "Hello";printf("%s", str);[Objective-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);
  • NSString文字列の結合や文字列比較には演算子ではなく専用のインスタンスメソッドを使用する[Objective-C] 文字列の結合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");}
  • NSMutableStringミュータブルな String=変化できる String(ミュータブルはミュータントの形容詞)ミュータブルストリングではないただのストリングは途中で内容の変更ができないただしただのストリングの方がメモリの使用量などは少ない ※初心者は全部ミュータブルにしてしまえ![Objective-C] 一つの文字列を変化させていく一連のコードNSMutableString *str = [NSMutableString string];[str appendString:@"Hi"];[str appendFormat:@", my favorite number is %d.", 128];[str appendString:@" Thank you."];NSLog(@"%s", str);他にも NSArray に対しての NSMutableArrayNSData に対しての NSMutableDataNSDictionary に対しての NSMutableDictionaryNSSet に対しての NSMutableSet などが用意されているNSNumber に対しての NSMutableNumber は無い
  • NSArrayオブジェクトを保持する順番リスト(配列)を格納する[Objective-C] 配列を作成してオブジェクトが存在するか確認するNSArray *array = [NSArray arrayWithObjects:@"Red", @"Blue", @"Green", nil];if ([array indexOfObject:@"Purple"] == NSNotFound) { NSLog(@"No color purple.");}NSArray に格納されるオブジェクトは Objective-C のオブジェクトなのでint や float や char などは格納できないので、NSNumber や NSString に変換する[Objective-C] int や char を NSMutableArray に追加する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];
  • NSDictionaryキーから値を取りだす「辞書」を格納する[Objective-C] 辞書を作成してオブジェクトを取り出すNSDictionary *colors = [NSDictionary dictionaryWithObjectsAndKeys:@"Red", @"Color 1",@"Green", @"Color 2", @"Blue", @"Color 3", nil];NSString *firstColor = [colors objectForKey:@"Color 1"];
  • Chapter #2UIKitFramework
  • Mac OS X との違いを補完しiOS 用のユーザーインターフェースを用意するフレームワークiOS 特有の「タッチできるぐらい大きいボタン」や「一度に表示する画面はただ一つ」「項目が縦に並ぶリスト」など見た目やiOS には不要な情報を捨てて、iOS 独自の情報を取得できるクラスも用意「デバイスの傾き」「バッテリー残量」「iOS に最適化した画像データ」
  • UIKit には iOS 用コンポーネント群が定義されている View Navigation Split View Controller Controller Controller Table View Tab Bar Page View Controller Controller Controller GLKit View Label Segmented Controller Control Round Rect Object Button Text Field Slider Activity Page Control Indicator View Progress Switch View Stepper Table Image Web View View View Table View Text Map Cell View View Scroll Picker GLKit View View View iAd Tap Date Banner Gesture Picker View Recognizer Pinch Swipe Long Gesture Gesture Press RecognizerRotation RecognizerPan Gesture Gesture Gesture Recognizer Recognizer Recognizer View Navigation Search Toolbar Bar Bar Search Bar and Search Bar Navigation Display Button Item Controller Item Fixed Tab Bar Space Bar Flexible Button Space Bar Item Button Tab Bar Item Item ※一部 UIKit 以外のフレームワークのコンポーネントが含まれています
  • UIKit のユーザーインターフェース系のクラスでは 「タッチイベント」を受け取ることができるtouchesBegan:withEvent:touchesMoved:withEvent:touchesEnded:withEvent:touchesCancelled:withEvent:
  • UIWindowスクリーンに表示するアプリケーションのウィンドウを管理するアプリにつき一つだけ存在する
  • +(0,0) x View1 (10,100) SubView1UIView (70,170)画面上に設置する矩形の表示エリア (10,60) SubView2テキストラベル、ボタン、画像など様々なタイプがある表示オブジェクト View2アプリにつき無数に存在するView の中に View を入れて入れ子にすることもできる(位置情報に注意) y
  • UIViewControllerUIView などの表示オブジェクトを管理する ViewController’s View一つのシーン、画面に対して一つが一般的タブ、ナビゲーションなどが使用されている場合は複数使うこともあるViewController 自体が View を持っている(ViewController.view) ので、そこに色々View (ラベル、ボタン、画像など) を配置する
  • UIKitユーザーインターフェース以外を ユーザーインターフェース系のクラス操作することができる UIKit のクラス UIColor UIAcceleration UIResponder UIWindow 色 加速度 タッチに反応するオブジェクト 画面 UIScreen UIDevice UIView 画面情報 デバイス情報 ビュー UIFont UIImage UIViewController フォント 画像データ シーン 他色々 他色々
  • Single View Application基本的には Xcode で新規作成するプロジェクトはこれを使おうWindow が生成されていて一つその中に ViewController が用意されているテンプレートUIWindow にルート用の ViewController を指定されているこの ViewController に色んな View を生成して乗せることでアプリを作っていくことをまずは覚えてみよう
  • Chapter #2-2UIView
  • UIView座標 (10, 10) に大きさ (300, 100) で View を生成して、親のビュー(スーパービュー)に乗せるUIView *aView = [[UIView alloc] initWithFrame:CGRectMake(10,10,300,100)];[superView addSubview:aView];表示リストSubview は一つの Superview を持つ View 0-0 View 1-2 に対しての SuperviewSuperview は複数の Subview を持つことができる View 1-0 View 1-1 View 1-2 View 1-2 に対しての Subview View 2-0 View 2-1UIView の主なメソッド- (void)removeFromSuperview;- (void)insertSubview:(UIView *)view atIndex:(NSInteger)index;- (void)bringSubviewToFront:(UIView *)view;UIView の主なプロパティ(CGRect) frame(BOOL) hidden(BOOL) userInteraction
  • View Class HierarchyUIView クラスを基底にして無数のサブクラスが存在するUIView クラスの機能はサブクラスに継承される UIView UIWindow UILabel UIPickerView UIProgressView UIActivityIndicatorViewUIImageView UITabBar UIToolBar UINavigationBar UITableViewCellUIActionSheet UIAlertView UIScrollView UIWebView UIControl UITableView UITextView UISwitch UIButton UIDatePicker UIPageControl UISegmentedControl UITextField UISlider
  • こんにちはUILabelread-only なテキスト表示用ビュー
  • UIImageView ‘ ‘画像を表示する用のビュー
  • 生成と設置UIImage というオブジェクトを作成して UIImageView にはめ込むXcode のプロジェクトペインにドラッグアンドドロップしてインポートした画像を使用してみましょう生成と設置UIImage *image = [UIImage imageNamed:@"illustration.png"];UIImageView *imageView = [[[UIImageView alloc] initWithImage:image] autorelease];[window addSubview:imageView];取り除く[imageView removeFromSuperview]; Other View addSubview: UIImageView UIImage setImage:
  • UIView UIWindow UILabel UIPickerView UIProgressView UIActivityIndicatorView UIControlUIImageView UITabBar UIToolBar UINavigationBar UITableViewCell タッチイベントを検知して 「コントロール機能」を提供するビューUIActionSheet UIAlertView UIScrollView UIWebView UIControl 指定されたイベントが発生したらターゲットオブジェクトへ アクションメッセージを送信する UITableView UITextView UISwitch UIButton UIDatePicker UIPageControl UISegmentedControl UITextField UISlider
  • UIButtonボタン用のビュー Hello色んな形のボタンが用意されているUIControl のサブクラス
  • ボタンのインタラクションUIButton など UIControl 系のビューは「∼されたらメッセージを送信する」ことができる※「メッセージを送信する」=メソッドを呼び出す(この言い方はこの言語の成りたちに由来している)[Objective-C] UIControl のメソッド。controlEvents が発生したら target に action を送信する[UIControl addTarget:(id)target action:(SEL)action forControlEvents:(UIControlEvents)controlEvents];[Objective-C] ボタンがタップされたら自分 (self) に buttonWasTapped: を送信するよう設定[button addTarget:self action:@selector(buttonWasTapped:)forControlEvents:UIControlEventTouchUpInside];[Objective-C] メッセージを受け取ったら実行するメソッド- (void) buttonWasTapped:(id)sender{ NSLog(@"Button Was Tapped!");};
  • Chapter #3Xcode(応用編)今までのスライドの知識を使ってアプリを作る
  • Xcode でアプリケーションを新規作成Xcode のメニューから File > New > Project > iOS > Application > Single View Application を選択 ProductName Hello World (アプリ名) Organization Name Takahashi Nobuhiro (制作者名) Company Identifier jp.feb19 (アプリ ID) Class Prefix Devices iPhone (ターゲットデバイス) Use Storyboards NO Use Automatic Reference Counting YES Include Unit Test NO適当な場所に保存するとプロジェクトが作成され、Xcode の画面に戻る画面左上が iPhone x.x Simulator となっているのを確認して ▶ Run をクリックするとMac 上で iOS シミュレータが動作して空のアプリが実行されるのを確認する
  • 新規作成したプロジェクトに自前のコードを加えていく左側にあるプロジェクトファイルペインから ViewController.m を選択してコードエディタを表示ちょっとだけコードを足してみよう[Objective-C] UILabel を表示する- (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];} Hello World再度 ▶ Run すると画面に Hello World. と表示されることを確認する
  • 新規作成したプロジェクトに自前のコードを加えていく2さらにコードを加えてみようボタンを設置してラベルを消してみよう[Objective-C] UIButton を作成してラベルを消す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; Hello World 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 CLEAR{ [label_ removeFromSuperview];}再度 ▶ Run して、ボタンをタップするとラベルが消えることを確認する
  • 新規作成したプロジェクトに自前のコードを加えていく3さらにコードを加えてみよう条件分岐や NSArray を使ってボタンをタップすると表示を変えてみる[Objective-C] UIButton を作成してラベルを消す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; Hello World 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];} CLEAR- (void)clearLabel:(UIButton *)button{ NSArray *array = [NSArray arrayWithObjects:@"いっかいめ", @"にかいめ", @"さんかいめ", @"それいじょう", nil]; label_.text = [array objectAtIndex:count]; if (count < 3) { count++; }}再度 ▶ Run して、ボタンをタップするたびにラベルの表示が変わることを確認する
  • Let’s make an application! 最後に実践チャレンジ! ♂♀クイズ ♂♀クイズ THANK YOU FOR PLAYING! ♂ ♀ 正解率 50% 正解!♂♀クイズ 次へ 最初から 残り 3/10 残り 4/10 ①Google 画像検索などで  「ニューハーフ」「美しすぎる男性」などと検索して  男性か女性か分かりにくい画像を探してください ②UIImageView を使って画像を表示してください ③UIButton を押すと、UILabel で答えを表示してください ④10問出題してください ⑤最後は UILabel で「お疲れさまでした!」表示と  とびきりの画像を見せてあげてください
  • 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 お疲れさまでした!