2015年1月26日 星期一

iOS App應用程式生命週期(上)

App的組成可視為撰寫程式碼(Custom Code)系統架構(System Frameworks)的互動,系統架構提供基本的運作模式,我們撰寫程式碼(Custom Code)讓App依照我們想要的方式去運作。若要寫好一個App,我們就要深入瞭解系統架構(System Frameworks)。

Main Function

每個C應用程式都會一個main function的進入點,iOS app也是一樣;不一樣的是iOS app的main function不用自行撰寫。XCode會在建立專案時自動產生main function,下面是main function示意程式碼。

import UIKit
func  main(argc:Int, argv:[String]) -> String
{
     return UIApplicationMain(argc, argv, nil, NSStringFromClass(new AppDelegate()));
}
main function主要會呼叫UIApplicationMain函式,UIApplicationMain函式主要會建立App的核心物件、從storyboard載入使用者介面、呼叫自行撰寫的程式碼,有機會做初始化及捕捉使用者的動作。開發者主要提供的是storyboard檔案及初始化程式碼。

App的結構

應用程式啟動時UIApplicationMain函式會建立關鍵物件並讓App執行;對每個iOS App最關鍵的物件是UIApplication,它主要的工作是協調系統與App中的物件之間的互動。下圖顯示每個App會出現的關鍵物件,以及它們之間的互動,而下表列出了每個物件的主要角色。
首先需要注意的是是iOS Apps使用Model-View-Controller架構;這個模式將應用程式資料及商業邏輯從使用者介面中分離;這樣設計很重要的好處是可讓Apps能在不同機裝置及不同螢幕畫面上執行。


物件
描述
UIApplication物件管理事件迴圈及其它高階應用程式行為,它也會反應用程式關鍵的轉換及特殊事件(例如push notifications)給在應用程式中自訂的物件來處理。每個iOS App只會有一個UIApplication物件。
App delegate物件
UIApplication物件是掌握iOS App的核心物件,而App delegate則是撰寫自訂程式碼的核心物件,App delegate與UIApplication物件一同合作,處理應用程式啟始、應用程式狀態轉換及其它App事件。App delegate一定會在每個App中出現,所以常用它來初始化App需要的資料結構。
Documents and data model objects
資料模型物件(Data model objects)用來儲存App專屬資料,舉例來說銀行App會儲存財務交易記錄、繪畫App會儲存使用者筆畫及順序資料。App可以使用document objects來管理資料模型物件,這是提供個方便的方法來管理,但並不是必要性的,開發者也可用自己的方式來管理。詳細可以參考Document-Based App Programming Guide for iOS
View controller objects
View controller 物件管理螢幕上呈現的App內容,一個View Controller管理單一View及它的子集合。實際呈現內容時View Controller會讓View狀態成為可見的,在App的視窗呈現。

UIViewController類別是所有View Controller物件的基礎類別,它提供了基本的功能包括載入Views、顯示它們,根據裝置旋轉而旋轉螢幕畫面,以及其他標準系統行為。

UIKit及其他Framework會定義其他的View Controller類別去實作其他的介面包括Image Picker、Tab Bar Interface及Navigation Interface。
若需要更多的資訊如何使用View Controllers,可參考 View Controller Programming Guide for iOS
UIWindowobject
UIWindow件用來代表視窗,協調一到多個View在主畫面中呈現,大部份的Apps只會有一個視窗。要改變App的內容,使用View Controller來改變顯示的View,並在對應的Windows上呈現;我們不會改變Windows本身。

除了代管Views外,UIWindow也與UIApplication合作將事件傳遞給Views及View controlls。
View objects,control objects, and layer objects
Views及Controls是實際顯示App內容的元素,Views物件用來在特定區域內顯示繪畫內容,並且會對於該區內的事件反應;Controls則是對於特定的使用者動作進行回應,像是Buttons、Text Fields…等。

UIKit Framework提供了許多標準的Views用來顯示內容,您也可以定義繼承自UIView用來定義自己的Views。

2015年1月19日 星期一

iOS App組成元素

本文分享iOS App在開發時期所組成的專案元素,當開發一個App時要逐步考慮到這些項目,例如是否同時在iPad/iPhone上執行、App有哪些讓使用者自行設定的選項、要開發哪些國家的版本…等。

The App Bundle

當用XCode建立專案時,XCode會幫我們產生專案需要的檔案,這些檔案的組合稱之為App Bundle,App Bundle包含了App執行檔案,及專案所需相關資源,包括了App Icons、影像檔及地區化內容…等,以下分別做介紹。

App Bundle.png

App executable

App executable是編譯過後的執行檔,執行檔名稱與XCode專案名稱通常是一樣的。

Information Property List File

用XCode建立專案時會自動建立info.plist檔案,裡面描述了對於App的metadata資訊,原始是XML檔案。info.plist檔案除了可在Supporting Files檔案夾看到外,還可在專案的Info頁面進行修改。對於info.list的詳細說明參考Information Property List Key Reference

每個App需要描述在什麼樣的硬體環境及條件下才可執行;App Store會根據此資訊來決定是否在使用者的裝置顯示此App。可以在info.list設定此資訊,詳細可參考UIRequiredDeviceCapabilities

InfoPropertyList.png

App Icons

App Icons用在顯示Home畫面的圖示,好的App Icon可以快速的吸引使用者;有分大圖及小圖,小圖是2x,大圖是3x

AppIcon.png

Launch Images

Launch Images有三種規格「Default.png、Default-Portrait.png、Default-Landscape.png」;當應用程式啟動,但沒有完全載入使用者介面時,會顯示暫時的畫面即是Launch image,App最少需提供一個Launch image。

LaunchImage.png

Storyboard files

Storyboards包含了Views及View Controllers;Views是顯示畫面,而View Controlls則控制了View上的資料如何顯示、與使用者的互動。Storyboards也確認了View之間如何進行轉換。

建立專案時,會自動建立main.storybaord,此為預設的storyboard,若要修改,除了改檔名外,也需在info.plist檔案中指定UIMainStoryboardFile鍵值,將修改後的檔名設為預設的storyboard。
StoryBoard.png

Nonlocalized resources

Nonlocalized resources包含了要在應用程式中使用的影片、聲音、電影及自訂資料;這些資料放在應用程式的最上層目錄。

Settings bundle

若要開放App有使用者偏好設定,那就要包含Settings Bundle;Settings Bundle包含了屬性列表及資源檔案用來定義App使用者偏好。詳細參考Preferences and Settings Programming Guide
Settings.png

Subdirectories for localized resources

地區化資源必須要放在語言專屬的目錄下,其中目錄名稱必須要符合ISO 639-1語言簡稱規範,後面加上.lproj副檔名,舉例而言en.lproj是英文(English)地區化目錄、fr.lproj是法文(French)地區化目錄、es.lproj則是西班牙文地區化目錄。

在地區化目錄可以放地區化App Icon Launch Images…等,更多資訊可以參考Internationalization and Localization Guide

App Structure.png

2014年12月24日 星期三

XCode Project Template

XCode Project Templae

在XCode中新增Project,可以選擇多種的iOS Application,本文對於這些類型分享;之後在選擇開發的專案類型會較有概念。

螢幕快照 2014-12-25 12.17.54.png
螢幕快照 2014-12-25 12.16.22.png

Mater-Detail Application

Mater-Detail Application提供了兩種檢視(View),一種是List View,包含了項目列表,而Detial View則是在點選了List View中的項目後會出現其中的內容;在iPhone上會以兩個畫面來呈現,而在iPad上則會以分割畫面來呈現。範例是Mail App。
  • iPhone
IMG_0106.PNG IMG_0105.PNG
  • iPad
IMG_2109.PNG

Page-Based Application

Page-Based Application提供了以頁面為基礎的檢視,開始可以看到所有頁面列表,點入後可以看到頁面內容,並且可以左右滑動看到其他頁面。範例是Weather App。





Single-View Application

Single-View Application是最單純的模式,只有單一畫面;範例是Calculator App。




Tabled Application

Tabled Application與Single View Application很接近,可視為多個Single View的組合,可在下方切換;範例是Clock App。





Game

若要開始遊戲程式,需要使用Game Application;範例是Angry Birds

IMG_0104.PNG

2014年12月9日 星期二

Xcode Workspace Window簡介

工欲善其事,必先利其器,本文介紹Xcode Workspace Window,我們主要的開發工作在其中進行,當我們開啟一個Xcode Project時會將其載入至Workspace Window中。

Toolbar



Toolbar提供了對於專案最常用的功能,簡介如下。
  • Run Button用來執行專案、Stop Button用來停止專案。
  • Scheme menu左方是用來管理專案Scheme,Scheme中可以設定專案如何被建置、執行、除錯…等選項,右方是可選取執行的模擬器(iPhone iPad...等)選項。
  • Activity viewer用來顯示建置、執行及其他關於專案的資訊。
  • Editor configuration buttons用來顯示編輯器選項。
    • XC_O_editor_buttons_standard_2x.png:顯示Standard Editor(標準編輯器)
    • XC_O_editor_buttons_assistant_2x.png:顯示Assistant Editor(輔助編輯器),當開啟時Standard Editor也會同時存在。
    • XC_O_editor_buttons_version_2x.png:顯示Version Editor(版本編輯器)
  • Workspace configuration buttons
    • XC_O_area_button_navigator_2x.png:顯示Navigator Area
    • XC_O_area_button_debug_2x.png:顯示Debug Area
    • XC_O_area_button_utilities_2x.png:顯示Utilities Area

Nagivation Area


使用Nagivation Area來存取專案不同面向的元素,例如專案檔案、除錯點、專案測試案例…等;Nagivation Area分為Nagivator bar用來選取專案不同面向、Content Area則是其中內容、Filter bar則是用來篩選Content Area中的內容。


  • Project navigator (../Art/XC_O_navigator_project_button_2x.png): 用來選取專案檔案,當選取檔案時,右方的Editor Area會出現對應的檔案內容;也可以新增、刪除及分類專案檔案。
  • Symbol navigator (../Art/XC_O_navigator_symbol_button_2x.png): 瀏覽專案中的Symbol定義,Symbol包括了Classes、Protocol、Function、Struct、Union、Enum、Type、Global Variable。
  • Search navigator (../Art/XC_O_navigator_find_button_2x.png): 用來搜尋及取代專案中的程式碼。
  • Issue navigator (../Art/XC_O_navigator_issue_button_2x.png): 當開啟或建置專案時,顯示警告或錯誤信息。
  • Test navigator (../Art/XC_O_navigator_test_button_2x.png): 建立、管理及執行測試案例,並且檢視他們的狀態。
  • Debug navigator (../Art/XC_O_navigator_debug_button_2x.png): 用來檢視執行緒的狀態,及使用的CPU、Memory、Disk、Network狀態。
  • Breakpoint navigator (../Art/XC_O_navigator_breakpoint_button_2x.png): 新增、刪除及檢視中斷點的狀況。
  • Log navigator (../Art/XC_O_navigator_report_button_2x.png): 檢視建置、執行、除錯及原始碼控制的歷程。

Debug Area


Debug Area用來檢視除錯相關資料,包括程式變數、Console輸出,並與Debugger互動。

  • Debug Bar:用來控制程式執行,可以暫停/執行程式或是逐步偵錯。
  • Content Panel:左方是Variables View,用來檢視程式變數;右方是Console,主要用來檢視除錯輸出資訊。
  • View Buttons:用來顯示或隱藏Variables View或Console。
debug_area-c_debugging_2x.png

Utilities Area


Utilities Area包含了Inspector Pane及Library Pane。
  • Inspector Pane主要用來檢視檔案及介面物件屬性,例如TextField(文字方塊)的內容、大小、位置都可在此調整
  • Library Pane可用來快速新增專案資源,最常用的是新增Storyboard上的介面物件,例如TextField、Label…等,另外也可新增專案檔案(Playground、Swift File)及程式碼片段(Code Snippet)。

XC_O_Util_area_2x.png

File Inspector及Quick Help一定會出現在Inspector Bar上,而其他的會依選取的Editor而定,最常見的是Interface Builder。
  • File inspector (../Art/XC_O_inspector_file_button_2x.png): 用來查看及管理檔案的資訊,例如檔案名稱、檔案路徑 …等。
  • Quick Help (../Art/XC_O_inspector_quick_help_button_2x.png):用來查看選取Symbol的說明。
  • Identity inspector (../Art/XC_O_inspector_identity_button_2x.png): 用來檢視及管理物件的資訊,包括類別名稱、執行時期屬性…等。
  • Attributes inspector (../Art/XC_O_inspector_attributes_button_2x.png): 用來設定選取物件的屬性,例如TextField包括文字的對齊、顏色…等。
  • Size inspector (../Art/XC_O_inspector_size_button_2x.png): 指定物件的初始位置及長寬。
  • Connections inspector (../Art/XC_O_inspector_connections_button_2x.png): 檢視物件的outlets及actions,建立或移除現有連結。
使用Library pane去存取可馬上用於專案的資源。
  • File templates (../Art/XC_O_library_file_templates_button_2x.png): 新增常用的檔案,直接拖到project navigator。
  • Code snippets (../Art/XC_O_library_code_templates_button_2x.png): 新增程式碼片段,直接拖到程式碼中即可。
  • Objects (../Art/XC_O_library_objects_button_2x.png):新增介面物件,直接拖到Interface Builder編輯視窗。
  • Media files (../Art/XC_O_library_media_button_2x.png): 圖形及聲音檔案,直接拖到Interface Builder編輯視窗。
在下方的text field可以搜尋選取library中的內容。

Reference