iOS Basic Development
Day 1
Xcode & Objective-C 2.0
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-...
Slide
www.slideshare.net/eakkattiya
Source Code
www.ibluecode.com/training.html
Fan Page
www.ios-talk.com
twitter.com/eakk...
Course Outline
1. Xcode & Objective-C 2.0
2. Human Interface Design
3.TableViewController
4. Multimedia
5. Submit App Stor...
Developing iOS Apps
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Tuesday, July 30, 13
Mobile Device in World Market
Android
iOS
Windows Phone
BlackBerry
Linux
Symbian
credits: http://idc.com/
Worldwide Smartp...
Mobile Device in World Market
Symbian
1%
Linux
1%BlackBerry
3%Windows Phone
3%
iOS
17%
Android
75%
Android
iOS
Windows Pho...
- It’s Wow !
(iPhone 5 / iPad Mini / iOS 7)
- Best Store
(AppStore)
- BestTools
(Xcode , IB , Instruments )
- Best Support...
Developing iOS Apps : Setup
Download ชุดพัฒนา Xcode จาก
> Lion : Mac App Store
< Snow Leopard : developer.apple.com
by Eak...
Developing iOS Apps :Tools
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Tuesday, July 30, 13
Xcode Interface Builder iPhone Simulator
Dashcode Instruments
-Tool ในการพัฒนาโปรแกรมบนมือถือที่สะดวกและสมบูรณ์ที่สุดในปัจ...
Xcode : Navigator , Editor , Utility Area
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Tuesd...
Object-Oriented Programming
Objective-C 2.0
Developing iOS Apps : Language
http://tinyurl.com/o54n8jd
by Eakapong Kattiya ...
Objective-C 2.0
เราต้องเริ่มเรียนรู้อะไรบ้าง ?
- การตั้งชื่อวัตถุ Class & Object ( คลาส & ออปเจ็ค )
- การจองหน่วยความจําให...
Class = แบบแปลนหรือพิมพ์เขียว/ชนิดของวัตถุ
Object = วัตถุ
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 08...
UIView *myView ;
ClassName *objectName ;
Framework
<UIKit>
ขึ้นต้นด้วยตัวเล็กเสมอขึ้นต้นด้วยตัวใหญ่เสมอ
by Eakapong Kattiy...
Objective-C 2.0 : PrimitiveTypes (ตัวแปรเก็บค่าพื้นฐาน)
BOOL isCorrect = NO ; //YES
NSInteger myInteger = 1234 ;
CGFloat m...
Objective-C 2.0 : If Else Condition (เงื่อนไข)
NSString *name = @"world" ;
BOOL isCorrect = [name isEqualToString:@"world"...
Objective-C 2.0 : Instantiation (การจองหน่วยความจําให้ Object)
//This is variable type not object
CGRect rect = CGRectMake...
Objective-C 2.0 : Instantiation (การจองหน่วยความจําให้ Object)
//Instantiation 1
MyClass *myObject1 = [MyClass new];
[myOb...
Objective-C 2.0 : NSArray (แก้ไขข้อมูลไม่ได้)
// Compose a static array of string objects
NSString *objs[3] = {@"One", @"T...
Objective-C 2.0 : NSDictionary (แก้ไขข้อมูลไม่ได้)
NSDictionary *myDict =
[NSDictionary dictionaryWithObjectsAndKeys:@"eak...
Objective-C 2.0 : NSMutableDictionary (แก้ไขข้อมูลได้)
NSMutableDictionary *myDict =
[NSMutableDictionary dictionaryWithOb...
การสืบทอดคลาส Inheritance & Subclass
1. คลาส ทุกตัวต้องมีการสืบทอดจาก คลาสแม่ (Super class) เช่น
UILabel สืบทอดมาจาก UIVie...
Objective-C 2.0 : Interface & Implementation
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Tu...
Objective-C 2.0 : Interface (.h file)
@interface classname : superclassname {
// instance variables
NSString *userInput ;
}...
Objective-C 2.0 : Implementation (.m file)
@implementation classname
+ (return_type)classMethod
{
// implementation
}
- (re...
Developing iOS Apps : Frameworks
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Tuesday, July ...
Developing iOS Apps : Frameworks
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Tuesday, July ...
Developing iOS Apps : Frameworks
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Tuesday, July ...
http://www.apple.com/ios/ios7/
Developing iOS Apps : Frameworks
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com ...
Create a new Xcode project
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Tuesday, July 30, 13
Choose a template : iOS Application/ SingleView Application
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 ...
Choose Product Name : MyFirstApp (ขึ้นต้นด้วยตัวใหญ่เสมอ)
Product Name : MyFirstApp
Class Prefix : ไม่ใส่
Devices : Univers...
UIViewController
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Tuesday, July 30, 13
UIViewController
เป็น Class ที่ใช้สําหรับการเขียนคําสั่ง (Logic) เพื่อ
ควบคุมการแสดงViews เช่นการสลับViews แสดง
ข้อมูลบนVi...
UIViewController & UIView
-Control ที่ทําการแสดงผลที่เป็น Class UI (User Interfaces)
นั้นสืบทอดมาจาก Class UIView เหมือนกั...
#import <UIKit/UIKit.h>
@interface ViewController : UIViewController
// Method Declaration (instance method)
- (void)chang...
Objective-C 2.0 : Method Implementation (ViewController.m )
@implementation ViewController
- (void)viewDidLoad
{
[super vi...
UIWindow
- ทุก Application จะต้องมี window
- บน iOS จะมีเพียง 1 window
- ใช้สําหรับนําViewController(s)
มาวางบน UIWindow
-...
UIView
SubView (50,50,100,100)
SuperView (10,10,300,200)
self.view (0,0,320,480)
- เป็นการวาดพื้นที่สี่เหลี่ยมเพื่อแสดงบนห...
UIView
- CGRect
พื้นที่สี่เหลี่ยมในการวาด (x ,y ,width ,height)
- CGRectMake : (CGRect)
คําสั่งในการสร้าง CGRect
- setBack...
@implementation ViewController
- (void)viewDidLoad
{
[super viewDidLoad];
//Call instance method
[self changeColorToRed:5....
UIViewController
- presentModalViewController
แสดงViewController ขึ้นมาทับViewController อื่น ๆ
- dismissModalViewControll...
Developing iOS Apps : Design Patterns
Model-View-Controller
Target-Action
Delegation
Block Objects
Protocol
Notification Ce...
Model-View-Controller (MVC)
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Tuesday, July 30, 13
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Tuesday, July 30, 13
Model-View-Controller (MVC)
Model
เป็น Class ที่สร้างขึ้นเพื่อใช้เก็บข้อมูลของโปรแกรม
เช่น Class Contacts เก็บรายชื่อ เบอร...
Model-View-Controller (MVC)
View
เป็น Class ที่สร้างขึ้นเพื่อแสดงผลบนหน้าจอ เช่น UIView ,
UILabel , UITextField โดยไม่จําเ...
Model-View-Controller (MVC)
Controller
เป็น Class ที่สร้างขึ้นเพื่อเชื่อมต่อระหว่าง Model กับView เช่น
Class UIViewControl...
Model-View-Controller (MVC)
Decrease Spaghetti codes
เป็นการออกแบบโครงสร้างการทํางานของโปรแกรมเป็น 3 ส่วน
เพื่อลดความยุ่งเ...
Model-View-Controller (MVC)
Avoid Monster Class
หลีกเลี่ยงการสร้าง Monster Class แบบ Class เดียวทําหน้าหลาย
อย่างตั้งแต่ เ...
Model-View-Controller (MVC)
- ( Easy to maintain ) โดยการแยกหน้าที่แต่ละส่วนชัดเจนช่วยให้
แก้ไขโปรแกรมได้ง่ายภายหลัง เนื่อ...
IBOutlet
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
IBOutlet
สร้างเพื่อกําหนด ชื่อตัวแปร ใ...
Storyboard : Design User Interface
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Tuesday, Jul...
IBOutlet : Insert new outlet : myLabel
Assistant Editor
ViewController.h
by Eakapong Kattiya www.ibluecode.com eak.k@iblue...
IBOutlet : Insert new outlet : myLabel
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Tuesday,...
IBOutlet : Insert new outlet : myTextField
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Tues...
IBOutlet : Insert new outlet : myTextField
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Tues...
IBAction
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
IBAction
สร้างเพื่อกําหนด ชื่อคําสั่ง ...
IBAction : UIButtonTouch Up Inside : showName
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
T...
IBAction : UIButtonTarget-Action : showName
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Tue...
#import <UIKit/UIKit.h>
@interface ViewController : UIViewController<UITextFieldDelegate>
@property (weak, nonatomic) IBOu...
#import "ViewController.h"
@implementation ViewController
- (void)viewDidLoad
{
[super viewDidLoad];
!
self.myLabel.text =...
ViewController.m
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Tuesday, July 30, 13
Q & A
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Tuesday, July 30, 13
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Profile
The course is designed and delivered by ...
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
Assumption
University
BECTeroradio Thailand
Yel...
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
And More...
Android & iOS Training / Consulting...
by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111
dtac Accelerate - Wizard of Apps 2013
Top 10 Fi...
Upcoming SlideShare
Loading in …5
×

(31 July 2013) iOS Basic Development 1 introduction & Xcode

1,607 views
1,464 views

Published on

iOS Basic Development 1 introduction & Xcode , Eakapong Kattiya , iphone , iPad

Published in: Technology
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,607
On SlideShare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
91
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

(31 July 2013) iOS Basic Development 1 introduction & Xcode

  1. 1. iOS Basic Development Day 1 Xcode & Objective-C 2.0 by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  2. 2. Slide www.slideshare.net/eakkattiya Source Code www.ibluecode.com/training.html Fan Page www.ios-talk.com twitter.com/eakkattiya facebook.com/eakapong.kattiya email : eak.k@ibluecode.com by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Eakapong Kattiya Professional Mobile Application Developer / Trainer iOS & Android Platform About Tuesday, July 30, 13
  3. 3. Course Outline 1. Xcode & Objective-C 2.0 2. Human Interface Design 3.TableViewController 4. Multimedia 5. Submit App Store Course Outline by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  4. 4. Developing iOS Apps by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  5. 5. Mobile Device in World Market Android iOS Windows Phone BlackBerry Linux Symbian credits: http://idc.com/ Worldwide Smartphone Operating Systems Market Share 1Q2013 (16 May 2013) by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  6. 6. Mobile Device in World Market Symbian 1% Linux 1%BlackBerry 3%Windows Phone 3% iOS 17% Android 75% Android iOS Windows Phone BlackBerry Linux Symbian credits: http://idc.com/ Worldwide Smartphone Operating Systems Market Share 1Q2013 (16 May 2013) by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  7. 7. - It’s Wow ! (iPhone 5 / iPad Mini / iOS 7) - Best Store (AppStore) - BestTools (Xcode , IB , Instruments ) - Best Support (documentation , sample code ) - Multi Platform (iPhone , iPad , iPodTouch) - Advertising Program (iAds) Why iOS ? by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  8. 8. Developing iOS Apps : Setup Download ชุดพัฒนา Xcode จาก > Lion : Mac App Store < Snow Leopard : developer.apple.com by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  9. 9. Developing iOS Apps :Tools by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  10. 10. Xcode Interface Builder iPhone Simulator Dashcode Instruments -Tool ในการพัฒนาโปรแกรมบนมือถือที่สะดวกและสมบูรณ์ที่สุดในปัจจุบัน เนื่องจาก Apple ออกแบบทั้ง Software และ Hardware เอง - iOS Simulator ที่ดีที่สุดใช้งานง่ายที่สุด Tools : Xcode 4.6.3 / iOS 6.1 SDK by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  11. 11. Xcode : Navigator , Editor , Utility Area by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  12. 12. Object-Oriented Programming Objective-C 2.0 Developing iOS Apps : Language http://tinyurl.com/o54n8jd by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  13. 13. Objective-C 2.0 เราต้องเริ่มเรียนรู้อะไรบ้าง ? - การตั้งชื่อวัตถุ Class & Object ( คลาส & ออปเจ็ค ) - การจองหน่วยความจําให้วัตถุ Instantiation (Alloc & init) - การสร้างคลาสใหม่ Inheritance / Subclass คลาสลูก - โครงสร้างคลาส Interface and Implementation : - องค์ประกอบของคลาส Instance , Property & Method : Class & Object Instantiation (Alloc & Init) Inheritance & Subclass Interface & Implementation Instance , Property & Method by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  14. 14. Class = แบบแปลนหรือพิมพ์เขียว/ชนิดของวัตถุ Object = วัตถุ by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Class ------ Implement ------> Object คลาส (แม่แบบ) ------ นําไปสร้างเป็น ------> วัตถุ Objective-C 2.0 : การตั้งชื่อวัตถุ Tuesday, July 30, 13
  15. 15. UIView *myView ; ClassName *objectName ; Framework <UIKit> ขึ้นต้นด้วยตัวเล็กเสมอขึ้นต้นด้วยตัวใหญ่เสมอ by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 ปิดประโยค pointer Objective-C 2.0 : การตั้งชื่อวัตถุ Tuesday, July 30, 13
  16. 16. Objective-C 2.0 : PrimitiveTypes (ตัวแปรเก็บค่าพื้นฐาน) BOOL isCorrect = NO ; //YES NSInteger myInteger = 1234 ; CGFloat myFloat = 123.40 ; double myDouble = 123.40 ; Objective-C 2.0 : Value ObjectTypes (ตัวแปรเก็บค่าพื้นฐาน + Method) NSNumber *number = @1234 ; NSString *name = @"world" ; NSString *greeting = [NSString stringWithFormat:@"Hello, %@ , %d", name, [number integerValue]]; by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Objective-C 2.0 : การกําหนดค่าให้กับ Object Tuesday, July 30, 13
  17. 17. Objective-C 2.0 : If Else Condition (เงื่อนไข) NSString *name = @"world" ; BOOL isCorrect = [name isEqualToString:@"world"]; //Method if(isCorrect){ //Block NSLog(@"Welcome %@",name); }else{ NSLog(@"Wrong user name"); } by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  18. 18. Objective-C 2.0 : Instantiation (การจองหน่วยความจําให้ Object) //This is variable type not object CGRect rect = CGRectMake(10, 10, 300, 200); //Instantiation 1 UIView *myView1 = [UIView new]; [myView1 setFrame:rect]; [myView1 setBackgroundColor:[UIColor greenColor]]; //Instantiation 2 UIView *myView2 = [[UIView alloc]init]; [myView2 setFrame:rect]; [myView2 setBackgroundColor:[UIColor greenColor]]; //Instantiation 3 UIView *myView3 = [[UIView alloc]initWithFrame:rect]; [myView3 setBackgroundColor:[UIColor blueColor]]; by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  19. 19. Objective-C 2.0 : Instantiation (การจองหน่วยความจําให้ Object) //Instantiation 1 MyClass *myObject1 = [MyClass new]; [myObject1 setName:@"Hello"]; //Instantiation 2 MyClass *myObject2 = [[MyClass alloc]init]; myObject2.name = @"Hello"; //Instantiation 3 MyClass *myObject3 = [[MyClass alloc]initWithString:@"Hello"]; by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Custom Class / Construction Tuesday, July 30, 13
  20. 20. Objective-C 2.0 : NSArray (แก้ไขข้อมูลไม่ได้) // Compose a static array of string objects NSString *objs[3] = {@"One", @"Two", @"Three"}; // Create an array object with the static array NSArray *arrayOne = [NSArray arrayWithObjects:objs count:3]; // Create an array with a nil-terminated list of objects NSArray *arrayTwo = [NSArray arrayWithObjects:@"One", @"Two", @"Three", nil]; NSArray *arrayThree = @[ @"Hello World", @67, [NSDate date] ]; // get first object in array @”Hello World” String *one = arrayThree[1]; // get second object in array @67 NSNumber *two = [arrayThree objectAtIndex:1]; Objective-C 2.0 : NSMutableArray (แก้ไขข้อมูลได้) NSMutableArray *mutableArray = [NSMutableArray new]; [mutableArray addObject:@"First"]; [mutableArray removeObjectAtIndex:0]; by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  21. 21. Objective-C 2.0 : NSDictionary (แก้ไขข้อมูลไม่ได้) NSDictionary *myDict = [NSDictionary dictionaryWithObjectsAndKeys:@"eak",@"name", @10,@"age", YES,@"isPass", nil]; NSString *name =[myDict valueForKey:@"name"] ; NSDictionary *myDict = @{@"eak",@"name", @10,@"age", YES,@"isPass", nil]; NSString *name =[myDict valueForKey:@"name"] ; by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Shorten Format Tuesday, July 30, 13
  22. 22. Objective-C 2.0 : NSMutableDictionary (แก้ไขข้อมูลได้) NSMutableDictionary *myDict = [NSMutableDictionary dictionaryWithObjectsAndKeys:@"eak",@"name", @10,@"age", YES,@"isPass", nil]; NSString *name =[myDict valueForKey:@"name"] ; by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  23. 23. การสืบทอดคลาส Inheritance & Subclass 1. คลาส ทุกตัวต้องมีการสืบทอดจาก คลาสแม่ (Super class) เช่น UILabel สืบทอดมาจาก UIView 2. ยกเว้น คลาส NSObject เนื่องจากเป็นคลาสแม่ของทุกตัว by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  24. 24. Objective-C 2.0 : Interface & Implementation by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  25. 25. Objective-C 2.0 : Interface (.h file) @interface classname : superclassname { // instance variables NSString *userInput ; } // Class Property @property (weak, nonatomic) IBOutlet UILabel *myLabel; @property (weak, nonatomic) NSString *name ; + classMethod1; + (return_type)classMethod2; + (return_type)classMethod3:(param1_type)param1_varName; - (return_type) instanceMethod1With1Parameter:(param1_type)param1_varName; - (return_type)instanceMethod2With2Parameters:(param1_type)param1_varName param2_callName:(param2_type)param2_varName; @end by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  26. 26. Objective-C 2.0 : Implementation (.m file) @implementation classname + (return_type)classMethod { // implementation } - (return_type)instanceMethod { // implementation } @end by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  27. 27. Developing iOS Apps : Frameworks by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  28. 28. Developing iOS Apps : Frameworks by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  29. 29. Developing iOS Apps : Frameworks by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  30. 30. http://www.apple.com/ios/ios7/ Developing iOS Apps : Frameworks by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  31. 31. Create a new Xcode project by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  32. 32. Choose a template : iOS Application/ SingleView Application by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  33. 33. Choose Product Name : MyFirstApp (ขึ้นต้นด้วยตัวใหญ่เสมอ) Product Name : MyFirstApp Class Prefix : ไม่ใส่ Devices : Universal Use Storyboards :YES Use ARC :YES by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  34. 34. UIViewController by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  35. 35. UIViewController เป็น Class ที่ใช้สําหรับการเขียนคําสั่ง (Logic) เพื่อ ควบคุมการแสดงViews เช่นการสลับViews แสดง ข้อมูลบนView และลบViews by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  36. 36. UIViewController & UIView -Control ที่ทําการแสดงผลที่เป็น Class UI (User Interfaces) นั้นสืบทอดมาจาก Class UIView เหมือนกันหมด เช่น UILabel , UITextField , UIButton ดังนั้น UIViewController จึงสามารถเขียนคําสั่งควบคุม Control ได้ทุกตัว by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  37. 37. #import <UIKit/UIKit.h> @interface ViewController : UIViewController // Method Declaration (instance method) - (void)changeColorToRed:(float)red green:(float)green blue:(float)blue; @end Objective-C 2.0 : Method Declaration (ViewController.h ) by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  38. 38. Objective-C 2.0 : Method Implementation (ViewController.m ) @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; //Call instance method [self changeColorToRed:5.0 green:2.0 blue:6.0]; } //Method implementation - (void)changeColorToRed:(float)red green:(float)green blue:(float)blue { UIColor *color = [UIColor colorWithRed:red green:green blue:blue alpha:1.0]; [self.view setBackgroundColor:color]; } by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  39. 39. UIWindow - ทุก Application จะต้องมี window - บน iOS จะมีเพียง 1 window - ใช้สําหรับนําViewController(s) มาวางบน UIWindow - ขนาด 320 x 480 (iPhone) 640 x 960 (iPhone Retina) 640 x 1136 (iPhone 5 Retina) 768 x 1024 (iPad) 1536 x 2048 (iPad Retina) window by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  40. 40. UIView SubView (50,50,100,100) SuperView (10,10,300,200) self.view (0,0,320,480) - เป็นการวาดพื้นที่สี่เหลี่ยมเพื่อแสดงบนหน้าจอ - สามารถสร้างด้วย Interface Builder หรือ coding by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  41. 41. UIView - CGRect พื้นที่สี่เหลี่ยมในการวาด (x ,y ,width ,height) - CGRectMake : (CGRect) คําสั่งในการสร้าง CGRect - setBackgroundColor: (UIColor*) กําหนดสีพื้นหลัง - addSubView : (UIView*) เอาView1 (subView) หนึ่งไปแปะกับView2 (ParentView) by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  42. 42. @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; //Call instance method [self changeColorToRed:5.0 green:2.0 blue:6.0]; // CGRect rect1 = CGRectMake(10, 10, 300, 200); UIView *myView1 = [[UIView alloc]init]; [myView1 setFrame:rect1]; [myView1 setBackgroundColor:[UIColor greenColor]]; [self.view addSubview:myView1]; CGRect rect2 = CGRectMake(50, 50, 100, 100); UIView *myView2 = [[UIView alloc]initWithFrame:rect2]; [myView2 setBackgroundColor:[UIColor blueColor]]; [myView1 addSubview:myView2]; } by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 ViewController.m Tuesday, July 30, 13
  43. 43. UIViewController - presentModalViewController แสดงViewController ขึ้นมาทับViewController อื่น ๆ - dismissModalViewControllerAnimated ยกเลิกการแสดงViewController (ใช้คู่กับ presentModalViewController) by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  44. 44. Developing iOS Apps : Design Patterns Model-View-Controller Target-Action Delegation Block Objects Protocol Notification Center Key-Value Observing (KVO) http://tinyurl.com/o8pnof9 by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  45. 45. Model-View-Controller (MVC) by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  46. 46. by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  47. 47. Model-View-Controller (MVC) Model เป็น Class ที่สร้างขึ้นเพื่อใช้เก็บข้อมูลของโปรแกรม เช่น Class Contacts เก็บรายชื่อ เบอร์โทร ผู้ติดต่อ โดยไม่จําเป็นต้องคํานึงถึงView และ Controller by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  48. 48. Model-View-Controller (MVC) View เป็น Class ที่สร้างขึ้นเพื่อแสดงผลบนหน้าจอ เช่น UIView , UILabel , UITextField โดยไม่จําเป็นต้องคํานึงถึง Controller แต่ต้อง คํานึงถึงประเภทของข้อมูลที่จะเชื่อมต่อกับ Model by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  49. 49. Model-View-Controller (MVC) Controller เป็น Class ที่สร้างขึ้นเพื่อเชื่อมต่อระหว่าง Model กับView เช่น Class UIViewController และควบคุม Flow การทํางานของโปรแกรม by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  50. 50. Model-View-Controller (MVC) Decrease Spaghetti codes เป็นการออกแบบโครงสร้างการทํางานของโปรแกรมเป็น 3 ส่วน เพื่อลดความยุ่งเหยิงของ code ที่ link หรือพันกันไปมาใน Class เดียวแบบเส้น สปาเกตตี by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  51. 51. Model-View-Controller (MVC) Avoid Monster Class หลีกเลี่ยงการสร้าง Monster Class แบบ Class เดียวทําหน้าหลาย อย่างตั้งแต่ เก็บข้อมูล แสดงผล ควบคุมView ต่าง ๆ ในตัวเอง เนื่องจากไม่สามารถนํา code ไปใช้ใหม่ได้ง่าย by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  52. 52. Model-View-Controller (MVC) - ( Easy to maintain ) โดยการแยกหน้าที่แต่ละส่วนชัดเจนช่วยให้ แก้ไขโปรแกรมได้ง่ายภายหลัง เนื่องจากมีส่วนเชื่อมต่อกันน้อยลง - ( Reusability) การแยกแต่ละส่วนชัดเจนช่วยให้สามารถเกิดการนํา Code ไปใช้้ซ้ําใหม่ได้ หรือนําเอาไปใช้ที่อื่นได้ - การนําไปใช้ซ้ําใหม่ทําให้เขียน Code น้อยลง by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  53. 53. IBOutlet by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 IBOutlet สร้างเพื่อกําหนด ชื่อตัวแปร ให้กับ Control ต่าง ๆ โดยประกาศใน Header File (ViewController.h) สําหรับการเขียน Code ใน Implementation (ViewController.m) Tuesday, July 30, 13
  54. 54. Storyboard : Design User Interface by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  55. 55. IBOutlet : Insert new outlet : myLabel Assistant Editor ViewController.h by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  56. 56. IBOutlet : Insert new outlet : myLabel by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  57. 57. IBOutlet : Insert new outlet : myTextField by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  58. 58. IBOutlet : Insert new outlet : myTextField by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  59. 59. IBAction by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 IBAction สร้างเพื่อกําหนด ชื่อคําสั่ง ให้กับ Control ต่าง ๆ โดยประกาศใน Header File (ViewController.h) สําหรับการเขียน Code ใน Implementation (ViewController.m) Tuesday, July 30, 13
  60. 60. IBAction : UIButtonTouch Up Inside : showName by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  61. 61. IBAction : UIButtonTarget-Action : showName by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  62. 62. #import <UIKit/UIKit.h> @interface ViewController : UIViewController<UITextFieldDelegate> @property (weak, nonatomic) IBOutlet UILabel *myLabel; @property (weak, nonatomic) IBOutlet UITextField *myTextField; - (IBAction)showName:(id)sender; @end Interface file : ViewController.h IBOutlet สร้างเพื่อกําหนด ชื่อตัวแปร ให้กับ Control ต่าง ๆ สําหรับการเขียน Code ในViewController.m IBAction สร้างเพื่อกําหนด ชื่อคําสั่ง ให้กับ Control ต่าง ๆ สําหรับการเขียน Code ในViewController.m by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  63. 63. #import "ViewController.h" @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; ! self.myLabel.text = @"What is your name?" ; self.myTextField.delegate = self ; } #pragma mark UIButton Target-Action - (IBAction)showName:(id)sender { self.myLabel.text = [@"Welcome " stringByAppendingString:self.myTextField.text] ; } #pragma mark TextField Delegate -(BOOL)textFieldShouldReturn:(UITextField *)textField { [textField resignFirstResponder]; return YES ; } Implementation file : ViewController.m by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  64. 64. ViewController.m by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  65. 65. Q & A by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Tuesday, July 30, 13
  66. 66. by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Profile The course is designed and delivered by Eakapong Kattiya,a developer of several successful iOS and Android apps. Eakapong Kattiya is primarily an iOS / Android developer, rather than a part- time trainer and so brings direct experience in designing, developing, shipping and marketing successful apps. Experience 4 years iOS/Android developer ,Trainer and Project Adviser 10 years Software developer ,Trainer and Project Adviser iOS/Android Trainer iPhone Application for Beginner. iPhone Application for Advance : Database on iPhone. iPhone Application for Advance : Location Based & Social Network. Android Application for Beginner Android Application for Advance : Database on Android Android Application for Advance : Location Based & Social Network. Education MBA , Chiangmai University Bachelor Degree , Computer Engineering, Chiangmai University Eakapong Kattiya Professional Mobile Application Developer / Trainer iOS & Android Platform About Tuesday, July 30, 13
  67. 67. by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 Assumption University BECTeroradio Thailand YellowPages Thai M Service HIPKINGDOM ASTV Manager Android & iOS Application MeccanicNambud Social DiaryHISOMap And More... Spring News Blacklist Tuesday, July 30, 13
  68. 68. by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 And More... Android & iOS Training / Consulting Health Information System Development Office (HISO) Tuesday, July 30, 13
  69. 69. by Eakapong Kattiya www.ibluecode.com eak.k@ibluecode.com +66 086-673-2111 dtac Accelerate - Wizard of Apps 2013 Top 10 Finalists Evrdi : Social Diary True App Center Awards 2009 Top 20 Finalists : iMall : Siam paragon Tuesday, July 30, 13

×