1. Class 16
iOS 應⽤用軟體設計

2. 課程⼤大綱 (1/3)
• 各類型 framework 使⽤用
• ⽂文件上傳與預覽 (QuickLook.framework)
Samples：DocumentPreview, QuickLookDemo,
DocInteraction......
• 影像輸出⼊入 (ImageIO.framework)
Samples：ImageIOSample01, ImageIOSample02
• 影⽚片播放 (MediaPlayer.framework)
Samples：MoviePlayer
• ⾳音訊應⽤用 (AVFoundation.framework)
Samples：MediaSample01, MediaSample02

3. 課程⼤大綱 (2/3)
• 各類型 framework 使⽤用 (續)
• 信件與間訊傳送 (UIMessage.framework)
QV119：MFMail
• 通訊錄 (AddressBook.framework,
AddressBookUI.framework)
• 地圖⼯工具 (MapKit.framework)
Samples：MapSample01~MapSample05
• iAD ⾏行動廣告平台 (iAD.framework)
QV171：iAD
• ⾮非官⽅方 framework...

4. 課程⼤大綱 (3/3)
• Resources
• CocoaControls、CocoaObjects、iOSFrameworks
• 網⾴頁設計者的框架⼯工具
• 程式完成前注意事項
• 完善你的程式
• 圖像 icon 與啟動畫⾯面
• 多國語⾔言 (QV172：多國語⾔言⽰示範)
• 上架⽅方式
• 管理應⽤用程式

5. 各類型 framework 使⽤用
http://developer.apple.com/library/ios/#documentation/
Miscellaneous/Conceptual/iPhoneOSTechOverview/
iPhoneOSFrameworks/iPhoneOSFrameworks.html

6. Cocoa Touch Framework
• Address Book UI Framework
• Event Kit UI Framework
• Game Kit Framework
• iAD Framework
• Map Kit Framework
• Message UI Framework
• Twitter Framework
• UI Kit Framework
• ......

7. ⽂文件上傳與預覽
(QuickLook.framework)

8. ⽂文件預覽的功能
• UIDocumentInteractionController 類別
(iOS 3.2) UIKit
參考範例：DocumentPreview
• QuickLook framework
(iOS 4.0) framework
參考範例：QuickLookDemo

9. 設定可經由 iTunes 上傳⽂文件
• 在 info.plist 中新增 UIFileSharingEnabled
的 key，其值設為 YES

10. 範例觀摩：DocInteraction
Demonstrates how to use
UIDocumentInteractionController to obtain
information about documents and how to
preview them. There are two ways to
preview documents: one is to use
UIDocumentInteractionController's preview
API, the other is directly use
QLPreviewController. This sample also
demonstrates the use of
UIFileSharingEnabled feature so you can
upload documents to the application using
iTunes and then to preview them. With the
help of "kqueue" kernel event notifications,
the sample monitors the contents of the
Documents folder.

11. 影像輸出⼊入
(ImageIO.framework)

12. ⽂文件預覽的功能
• iOS 4 加⼊入
• 透過 ImageIO 取得影像及其所包含的資訊，如
尺⼨寸⼤大⼩小、DIP、EXIF 等
• 重要類別
• CGImageSource：影像輸出⼊入和取得資訊
• CGImageDestination：影像的輸出輸出的輸出
和輸出呈現⽅方式
• CGImageProperties：各種屬性資訊說明

13. 範例觀摩
ImageIOSample01 ImageIOSample02
(讀取影像資訊) (建⽴立縮圖)

14. 影⽚片播放
(MediaPlayer.framework)

15. 影⽚片處理注意事項
• 主要類別
• MPMoviePlayerController
• 可讀取內部檔案或網路取得 (需注意⼤大⼩小)
• 可處理的影⽚片格式
• H.264 (Baseline Profile Level 3.0)
• MPEG-4 Part 2 video (Simple Profile)

16. 範例觀摩：MoviePlayer
網路串流 本機檔案

17. ⾳音訊應⽤用
(AVFoundation.framework)

18. 影⾳音視訊相關

19. • MediaPlayer.framework
單純播放聲⾳音和影⽚片
(MPMoviePlayerController)
• AVFoundation.framework
進階的影⾳音處理

20. 範例觀摩
MediaSample01 (聲⾳音播放)
MediaSample02 (錄⾳音)

21. 信件與簡訊傳送
(UIMessage.framework)

22. Project QV119
MFMail.....

23. 增加 MessageUI framework

24. ViewController.h
#import <UIKit/UIKit.h>
#import <MessageUI/MessageUI.h>
@interface ViewController : UIViewController 要加上
<MFMailComposeViewControllerDelegate>
-(IBAction)show1:(id)sender;
-(IBAction)show2:(id)sender;
-(IBAction)show3:(id)sender;
@end

25. ViewController.m (1/4)
-(IBAction)show1:(id)sender
{
if([MFMailComposeViewController canSendMail])
{
MFMailComposeViewController *mailView =
[[MFMailComposeViewController alloc] init];
mailView.mailComposeDelegate = self;
// 信件標題
[mailView setSubject:@"Hello World"];
// 信件本⽂文
[mailView setMessageBody:@"Hey, this is from my app" isHTML:NO];
// 顯⽰示
[self presentViewController:mailView
animated:YES
completion:^{NSLog(@"ok");}];
}
}

26. ViewController.m (2/4)
-(IBAction)show2:(id)sender
{
if([MFMailComposeViewController canSendMail])
{
MFMailComposeViewController *mailView =
[MFMailComposeViewController alloc] init];
mailView.mailComposeDelegate = self;
// 信件標題
[mailView setSubject:@"吃飯通知"];
// 信件本⽂文使⽤用HTML碼
NSString *emailBody = @"Hey, <br/><br/> this is from my app";
[mailView setMessageBody:emailBody isHTML:YES];
// 各種收件⼈人
[mailView setToRecipients:[NSArray
arrayWithObjects:@"shinjia168@gmail.com", @"bruce@mail.com", nil]];
[mailView setCcRecipients:[NSArray
arrayWithObjects:@"candy@mail.com", @"david@mail.com", nil]];
[mailView setBccRecipients:[NSArray
arrayWithObjects:@"eric@mail.com", nil]];
// 顯⽰示
[self presentViewController:mailView animated:YES
completion:^{NSLog(@"ok");}];
}
}

27. ViewController.m (3/4)
-(IBAction)show3:(id)sende
{
if([MFMailComposeViewController canSendMail])
{
MFMailComposeViewController *mailView =
[[MFMailComposeViewController alloc] init];
mailView.mailComposeDelegate = self;
****** 省略部分程式 ******
//加⼊入圖⽚片
UIImage *theImage = [UIImage imageNamed:@"Cat.png"];
NSData *imageData = UIImagePNGRepresentation(theImage);
[mailView addAttachmentData:imageData mimeType:@"image/png"
fileName:@"image"];
// 顯⽰示
[self presentViewController:mailView animated:YES
completion:^{NSLog(@"ok");}];
}
}

28. ViewController.m (4/4)
-(void)mailComposeController:(MFMailComposeViewController *)controller
didFinishWithResult:(MFMailComposeResult)result error:(NSError *)error
{
[self dismissViewControllerAnimated:YES completion:nil];
}

29. 補充說明
無法在模擬器發出郵件
實機需先設定好具 mail 之功能
附件的處理......
是否能夠強制⽴立即送出？

30. 通訊錄
(AddressBook.framework)
(AddressBookUI.framework)

31. 範例觀摩：QuickContacts
QuickContacts demonstrates
how to use the Address Book
UI controllers and various
properties such as
displayedProperties,
allowsAddingToAddressBook,
and displayPerson. It shows
how to browse a list of
Address Book contacts,
display and edit a contact
record, create a new contact
record, and update a partial
contact record.

32. 地圖⼯工具
(MapKit.framework)

33. 範例
• MapSample01：顯⽰示地圖及⼤大頭釘
• MapSample02：MKCircle
• MapSample03：應標轉換地址
• MapSample04：Polyline
• MapSample05：Polygon

34. iAD ⾏行動廣告平台
(iAD.framework)

35. 運作原理
• 在程式內預留⼀一塊空間給 ADBannerView
• 點選廣告後即會開始廣告⾴頁⾯面

36. Banner View

37. Full-Screen (iPad only)

38. 申請 iAD 服務
• 由 iTunes connect 中設定
• Contacts
• Banking
• Tax
• 開發者可收取廣告獲益 70%

42. Project QV171
iAD 廣告

43. 加⼊入 iAD.framework

44. ViewController.h
#import <UIKit/UIKit.h>
#import <iAd/iAD.h>
@interface ViewController : UIViewController <ADBannerViewDelegate>
{
}
@end
加⼊入代理協定

45. ViewController.m (1/2)
#import <iAD/iAD.h>
@implementation ViewController
- (void)viewDidLoad
{
[super viewDidLoad];
/* 最簡單的⽅方式
ADBannerView *adView = [[ADBannerView alloc] initWithFrame:CGRectZero];
adView.currentContentSizeIdentifier = ADBannerContentSizeIdentifierPortrait;
[self.view addSubview:adView];
*/
// 完整的廣告處理
ADBannerView *adView = [[ADBannerView alloc] initWithFrame:CGRectZero];
adView.currentContentSizeIdentifier = ADBannerContentSizeIdentifierPortrait;
adView.delegate = self;
[self.view addSubview:adView];
}

46. 加⼊入完整的代理程式 ViewController.m (2/2)
- (void) bannerViewWillLoadAd:(ADBannerView *)banner
{
// 當使⽤用者按下廣告的時候
}
- (void) bannerViewDidLoadAd:(ADBannerView *)banner
{
// 當廣告 banner 被載⼊入完成之後
}
- (BOOL) bannerViewActionShouldBegin:(ADBannerView *)banner
willLeaveApplication:(BOOL)willLeave
{
// 廣告旦否要被開啟或要被關閉
return YES;
}
- (void) bannerViewActionDidFinish:(ADBannerView *)banner
{
// 當廣告被關閉之後
}
- (void) bannerView:(ADBannerView *)banner didFailToReceiveAdWithError:
(NSError *)error
{
// 當廣告載⼊入錯誤的時候
}

47. 補充參考
ADBannerView 的基本使⽤用⽅方法
(http://furnacedigital.blogspot.tw/2011/09/adbannerview.html)

48. 其他功能
• AirPrint (無線列印；UIKit)
• Game Center (遊戲社群平台)
• ......

49. ⾮非官⽅方 Framework
• iOS 好⽤用 framework 分享
(http://taiwanwolf.blogspot.tw/2012/02/ios-framework.html)

50. Resource ...

51. http://cocoacontrols.com/

52. http://cocoaobjects.com/

53. http://iosframeworks.com/

54. 適合網⾴頁設計者的
框架⼯工具
• 參考：10⼤大優秀的移動 Web 應⽤用程序開
發框架推薦
(http://www.hksilicon.com/kb/articles/53695/10Web?mobi=true)

55. 不同的開發⽅方式
Objective-C iOS App
iOS SDK NimbleKit...
HTML/CSS/
Javascript
⼀一般網⾴頁
HTML5/CSS3/
⼿手機網⾴頁
Android SDK Javascript
Jave Android App

56. Nimblekit
http://nimblekit.com

57. 直接將網⾴頁轉為 iOS App

58. jQuery Mobile
HTML5+jQuery
的⼿手機網⾴頁 http://jquerymobile.com/

59. PhoneGap
將 HTML 網⾴頁包裝成
http://phonegap.com/
各平台的專案

60. Appcelerator (Titanium)
開發者寫 Javascript
去呼叫 Titanium API http://www.appcelerator.com/

61. 程式完成前注意事項

62. 完善你的程式
• 應⽤用程式的設定 info.plist
• 圖像與啟動圖⽚片
• 多國語系
• 使⽤用 Instruments 檢測

63. 圖像 icon
• Application icon
• 存放在 Application Bundle 的第⼀一層⺫⽬目錄
• iPhone: 57x57; 114x114 (檔案結尾@2x)
• iPad: 72x72
• Setting icon: iPhone(29x29)；iPad(58x58)
• Search icon: iPhone(29x29, 58x58)；
iPad(50x50)

64. ICON
Source: http://www.vickiwenderlich.com/2012/09/app-icon-size-reference-chart/

65. more icon
Source: http://www.vickiwenderlich.com/2012/09/app-icon-size-reference-chart/

66. • Icon.png (57x57)
Icon@2x.png (114x114)
• Icon-72.png (72x72)
• Icon-Small.png (29x29)
Ion-Small@2x.png (58x58)
• Icon-Small-50.png (50x50)

67. 啟動圖⽚片
• 圖檔尺⼨寸 • 圖檔名
• iPhone:
320x480
• Default-PortraitUpsideDown.png
640x960 (@2x) • Default-LandscapeLeft.png
(不⽀支援橫向)
• Default-LandscapeRight.png
• iPad:
• Default-Portrait.png
768x1024
(橫向為 1024x768) • Default-Landscape.png

68. 多國語⾔言
(Localization)

69. Project QV172
多國語⾔言

70. 在專案設定中增加
使⽤用的語⾔言 (zh-Hant)

71. 會增加不同語系
下的檔案

72. 必要時檢查其檔案編碼為 utf-8

73. InfoPlist.strings 檔
案內定義字串
(兩個檔案都要)

74. ViewController.xib (English)
xib 檔案內設計畫⾯面
(兩個檔案都要)
注意：和類別裡的
關聯設定也是
兩個檔案都要拉線

75. ViewController.h
@interface ViewController : UIViewController
{
IBOutlet UILabel *display;
}
ViewController.m
- (void)viewDidLoad
{
[super viewDidLoad];
display.text =
NSLocalizedStringFromTable(@"LabelString", @"InfoPlist", nil);
}

76. 測試時，可在⼿手機的 setup
(設定) 裡更改語系後，重新執⾏行

77. xcode

78. Instrument

79. Instruments

80. 上架⽅方式
• 申請帳號 iPhone Developer Program
• 建⽴立應⽤用程序 profile....等相關程序
• 上傳 Binary (在 xcode4 內的 Organizer 發佈)
• 建⽴立 .ipa 檔案 (供測試之⽤用，ad hoc 認證)

81. 管理應⽤用程式
• iTunes Connect
• Sales and Trends
• Manage Your Applicatons
• Contacts, Tax, and Banking
• Payments and Financial Reports
• Manage Users

82. ............