當前位置：首頁 > 编程语言 > c/c++ >内容正文

c/c++

【iOS 开发】iOS 开发简介 (IOS项目文件 | MVC 模式 | 事件响应机制 | Storyboard 控制界面 | 代码控制界面 | Retina 屏幕图片适配)

發布時間：2025/6/17 c/c++ 19 豆豆

一. iOS 項目簡介

1. iOS 文件簡介

創建一個 HelloWorld 項目, 在這個 IOS 項目中有四個目錄 : 如下圖;

-- HelloWorldTests 目錄 : 單元測試相關的類和資源;

(1) HelloWorld 目錄

HelloWorld 目錄介紹 :?

-- 命名規則 : 該目錄名稱與 IOS 項目名稱相同, 是主目錄;

-- 存放內容 : IOS 項目的源碼文件, 界面設計文件, 資源文件都存放在該目錄下;

-- 源文件 : Objective C 的 .m 和 .h 后綴的文件;

-- 界面設計文件 : Main.storyboard 是界面設計文件, 原來使用的是 nib 界面設計文件, storyboard 是新版本使用的;

-- Supporting Files : 支持庫, 一般保存 不是 Objective-C 的源代碼 和 資源文件;

Supporting Files 目錄簡介 :?

-- HelloWorld-info.plist 文件 : 文件名格式為項目名-info.plist, 屬性列表文件, 保存 IOS 項目的各種信息;

-- InfoPlist.strings 文件 : 該文件保存字符串, 主要為程序提供國際化支持;

-- main.m 文件 : main() 函數程序入口文件;

-- HelloWorld-Prefix.pch 文件 : 項目中用到的來自外部框架的頭文件在這里面注明, Xcode 會預編譯這些文件內容;

(2) Frameworks 目錄

Frameworks 目錄簡介 :?

-- 包含文件 : 包含項目所依賴的框架或者庫, 還有聲音圖像等資源文件也可以放在該文件中;

-- 自動鏈接 : 框架和庫一旦被添加到該目錄后, 會自動鏈接到應用中, IOS 應用可以調用這些資源和庫中的類和函數;

-- 系統默認框架 : Foundation.framework, CoreGraphics.framwork, UIKit.framework, CoreData.framework, XCTest.framework 五個默認框架;

(3) Products 目錄

Products 目錄 :?

-- 包含內容 : 包含該項目所生成的應用程序, 其中 HelloWorld.app 就是安裝文件;

-- 紅色顯示 : 由于還沒有編譯程序, 該文件顯示紅色, 這說明該文件目前不存在;

(4) 目錄對應

Xcode 與文件系統 :?

-- Xcode 邏輯分組 :?

-- 真實文件系統 :?

-- 不對應 : Xcode 導航面板中的目錄文件與真實文件系統中的目錄文件不是對應的;

-- 邏輯分組 : Xcode 將真實文件進行了邏輯分組, 并不是真實的文件結構;

-- 自定義分組 : 開發者還可以創建自定義的分組;

mac 中的 tree 命令 :?

-- tree 命令模擬 :?

find . -print | sed -e 's;[^/]*/;|____;g;s;____|; |;g'-- 模擬 tree 命令 : 之后可以調用 tree 命令了;

alias tree="find . -print | sed -e 's;[^/]*/;|____;g;s;____|; |;g'"

2. Interface Builder 簡介

(1) 刪除 Main.storyboard 文件

刪除 Main.storyboard 文件 :?

-- 刪除方法 : 選擇文件, 按 Delete 鍵, 彈出以下對話框, 選擇 Move to Trash 選項, 直接刪除;

-- Remove Reference 選項 : 在文件系統保留該文件, 但是不編譯該文件;

-- 修改配置 : 點擊項目名稱, 選擇 General 面板, 然后刪除 Main Interface 中的 Main 選項;

(2) 創建 xib 界面設計文件

創建 xib 文件流程 :?

-- 選擇文件類型 : 菜單欄選擇 File -> New -> File, 彈出下面對話框, 選擇 iOS 的 User Interface 選項卡中的 View 選項, 點擊 Next 按鈕;?

-- 創建文件 : 輸入名稱 Main.xib 自定義的, 選擇分組 HelloWorld, 選擇所輸出的 app 文件;

-- 創建成功 :?

(3) xib 界面設計文件簡介

xib 界面設計文件 :?

-- PlaceHolder 列表區 : 包括 File's Owner 和 First Responder 兩個文件;

-- Objects 列表區 : 保存界面布局文件中的 UI 控件實例;

PlaceHolder 列表區 :?

-- File's Owner 文件 : 代表加載界面設計文件對象, 即布局文件對象, 誰負責加載 Main.xib 界面設計文件, 誰就是該界面設計文件的 File's Owner;

-- First Responder 文件 : 代表正在與用戶交互的對象, 即獲取到焦點的對象, 其代表的控件會變化, 用戶點擊按鈕時, 按鈕就成為了其代表的控件;

Objects 列表區 :?

-- 主要作用 : 該列表區保存 xib 界面所用到的 UI 控件實例;

-- 工作流程 : 開發者將 UI 控件拖入 xib 文件, app 運行時會加載 xib 文件, 并為每個控件都創建對象, Objects 列表區可以看到所有的 UI 控件;

(4) xib 和 nib 文件

xib 和 nib 后綴文件 :?

-- 新舊區別 : nib 后綴是傳統格式, xib 后綴是新格式;

-- 默認模板 : Xcode 默認使用 xib 作為默認格式;

xib 與 nib 主要區別 :

-- 文件類型 : xib 是文本文件, nib 是二進制文件, Xcode 編譯項目時會將 xib 文件轉為 nib 文件;?

-- nib 文件 : Interface Builder 把窗口, 菜單欄以及各種 UI 組件都凍結在 nib 文件中, 使用 nib 界面設計文件, 這些 UI 控件對象已經被創建好, app 運行時, 只需要蘇醒這些 UI 控件即可;

-- xib 文件優點 : xib 更方便, 便于版本控制;

3. nib 文件添加控件

xib 添加控件 :?

-- 對象庫面板快捷鍵 : 使用 control + option + command + 1 快捷鍵, 即可顯示對象庫面板;

-- 添加 Label 控件到界面中 : Label 拖到中間會有水平和垂直兩條藍色引導線;

-- 邊界引導線 : 如果把控件拖到邊界, 會出現邊界引導線, 說明不能再向外拖了;

上 :?? 左 : ??右 :? ? ?

下 :?

-- 顯示 UI 控件輪廓 : Editor -> Canvas -> Show Layout Rectangles, 可以看到布局出現下面的輪廓;

4. 控件屬性修改相關面板

相關面板 :?

-- 文件檢查器面板 : 快捷鍵 option + command + 1, 文件相關信息;

-- 快速幫助檢查器面板 : 快捷鍵 option + command + 2, 顯示先關的幫助文檔;

-- 身份檢查器面板 :?快捷鍵 option + command + 3, 管理界面控件的實現類, 恢復 ID 等屬性;

-- 屬性檢查器面板 :快捷鍵 option + command + 4, 管理控件的拉伸方式, 背景色等外觀屬性;

-- 大小檢查器面板 :?快捷鍵 option + command + 5, 管理控件大小位置相關屬性;

-- 連接檢查器面板 : ?快捷鍵 option + command + 6, 管理控件與代碼之間關聯;

4. UIView 屬性

UIView 屬性?:?

(1) Mode 屬性

Mode 屬性 :

-- 主要作用 : 用于控制 UI 控件內圖片的對齊方式, 是否縮放適配控件;

-- Scale To Fit : 縮放圖片, 保證圖片適配該控件;

-- Aspect Fit : 保持縱橫比縮放圖片, 保證圖片能夠適應控件;

-- Aspect Fill : 保持縱橫比縮放圖片, 保證圖片能夠填充控件;

-- 注意 : 縮放會帶來不必要的開銷, 最好為不同屏幕尺寸創建對應的圖片;

(2) Tag 屬性

Tag 屬性 : 該屬性是控件的唯一標識, 可以根據該標識獲取該 UI 控件的引用;

(3) Interaction 屬性

Interaction 屬性 :?

-- User Interface Enable : 勾選, 表明該控件支持與用戶交互;

-- Multiple Touch : 勾選, 表明該控件支持多點觸控, 支持更復雜的手勢;

(4) Alpha 屬性

Alpha 屬性 :?

-- 作用 : 用于控制該控件的透明度, 其屬性支持 0.0 ~ 1.0 任意浮點數;

-- 注意 : 如果設置為半透明效果, 會增加額外開銷;

(5) Background 屬性

background 屬性 :?

-- 作用 : 設置控件的背景色;

(6) Drawing 屬性

Drawing 屬性 :?

-- Opaque : 設置控件是否為不透明, 如果設置為不透明, 不管該控件的透明度是否是半透明, 該控件后的其它控件將不會被繪制;

-- Hidden : 隱藏該控件, 用戶看不到本控件;

-- Clears Graphics Context : 清除該控件所覆蓋的區域, 勾選該選項后 IOS 會清除該控件覆蓋的區域, 然后繪制該控件, 會降低性能;

-- Clip Subviews : 是否裁剪子控件, 當該控件包含多個子控件, 并且這些子控件超出了父類容器, 勾選后, 超出部分就不會被繪制;

-- Autoresize Subviews : 是否自動調整子控件大小, 如果勾選, 該控件大小改變時, 其子控件也會隨之調整大小;

(7) Streching 屬性

Streching 屬性 :

-- 主要作用 : 用于控制 UIView 拉伸區域, 只有在需要調整控件大小并重繪控件時才需要定義拉伸區域;

5. UILabel 屬性

UILabel 屬性 :?

(1) Text 屬性

Text 屬性 :?

-- 屬性值 : 支持 Plain 和 Attribute 屬性, 一般設置為 Plain;

-- 文本 : 在 Text 屬性下面有一個文本框, 在這個文本框中輸入要顯示的文本內容;

(2) Color 屬性

Color 屬性 : 控制 UILabel 中的文本顏色;

(3) Font 屬性

Font 屬性 :?

-- 作用 : 控制文本字體文字大小風格等屬性;

-- System : 系統默認字體, 不能修改 Family Style Size 屬性;

-- System Bold : 系統默認的粗體字;

-- System Italic : 系統默認的斜體字;

(4) Alignment 屬性

Alignment 屬性 :?

-- 作用 : 設置對齊方式, 左對齊, 居中對齊, 右對齊;

(5) Lines 屬性

Lines 屬性 :?

-- 作用 : 控制文本行數;

(6) Behavior 屬性

Behavior 屬性 :?

-- Enabled : 控制 UILabel 是否可用, 如果沒有勾選, 該 Label 不可用, 處于淡灰色;

-- Highlighted : 控制 UILabel 是否處于高亮狀態, 勾選該控件后處于高亮狀態, 控件中的文本以高亮顯示;

(7) Line Break 屬性

Line Break 屬性 :?

-- 作用 : 該屬性對 UILabel 內的文本進行截斷, UILabel 中的字符串比較多, UILabel 無法容納這些字符串, 可以將字符串截斷, 顯示一部分;

-- Truncate Head : 顯示后半部分字符串, 前半部分使用 ... 代替;

-- Truncate Middle : 顯示前后部分, 中間使用 .. 替代;

-- Truncate Tail : 截斷后半部分, 后半部分使用 ... 替代;

(8) AutoShrink 屬性

AutoShrink 屬性 :?

-- 作用 : UILabel 中字符串較多以至于 UILabel 無法容納字符串時, AutoShrink 屬性控制文本自動收縮;

-- Fixed Font Size : 不縮放;

-- Minimum Font Scale : 設置最小的縮放倍數, 設置的值是 0.0 ~ 1.0 之間的浮點數;

-- Minimum Font Size : 設置最小的字號大小, 設置的值是字體大小;

-- Tighten Letter Spacing : 勾選該復選框會自動壓縮字符串中的空白, 保證 UILabel 能容納這些文本中的內容;

(9) Highlighted 屬性

Highlighted 屬性 :?

-- 作用 : 為 UILabel 中的文本設置高亮顯示, 前提 Behavior 屬性的 Highlighted 屬性勾選;

(10) Shadow 屬性

Shadow 屬性 :?

-- 作用 : 為文本設置陰影顏色;

(11) Shadow Offset 屬性

Shadow Offset 屬性 :?

-- 作用 : 控制陰影文本與正常文本之間的偏移量,?

-- Horizontal : 屬性值 >0 向右偏移, < 0 向左偏移;

-- Vertical : 屬性值 >0 向下偏移, <0 向上偏移;

二. IOS 中的 MVC 框架

1. 程序入口

(1) 程序入口代碼

程序入口代碼示例 :?

// // main.m // FirstApp // // Created by octopus on 15-11-4. // Copyright (c) 2015年 www.octopus.org.cn. All rights reserved. //#import <UIKit/UIKit.h>#import "OCAppDelegate.h"int main(int argc, char * argv[]) {@autoreleasepool {return UIApplicationMain(argc, argv, nil, NSStringFromClass([OCAppDelegate class]));} }

-- Main 函數執行流程 :?調用 UIApplicationMain () 函數, 創建 UIApplication 對象, 為 UIApplication 對象設置委托, 負責處理應用程序事件循環;

2. 應用程序委托

(1) 委托對象簡介

委托對象簡介 :?

-- UIApplication 本質 : UIApplication 代表了 IOS 應用程序, 每個應用中只有一個 UIApplication;

-- 實際編程對象 : 雖然 UIApplication 代表了整個應用, 但是編程時不直接操作 UIApplication, 開發者一般與 delegate 委托對象交互;

-- 全局變量 : UIApplication 委托對象全局可用, 定義全局變量即將該變量設置為 UIApplication 的委托對象;

-- 數據交換 : 獲取委托對象, 可以向其中存取數據, 可以作為 IOS 應用的通信中心, 程序組件之間通過委托對象進行數據交互;

-- 處理生命周期事件 : 應用程序委托對象還處理 IOS 應用的各種生命周期事件, 處理應用執行過程中的事件循環;

(2) AppDelegate.h 詳解

OCAppDelegate.h 詳解 :?

-- 代碼示例 :?

// // OCAppDelegate.h // FirstApp // // Created by octopus on 15-11-4. // Copyright (c) 2015年 www.octopus.org.cn. All rights reserved. //#import <UIKit/UIKit.h>@interface OCAppDelegate : UIResponder <UIApplicationDelegate>@property (strong, nonatomic) UIWindow *window;@end

-- 繼承父類 : 該 OCAppDelegate 類, 繼承了 UIResponder 類, 表明該類可以作為響應者使用;

-- 實現協議 : 實現了 UIApplicationDelegate 協議, 繼承這個協議即表明該對象是應用程序委托類;

-- UIWindow 屬性 : 代表 IOS 應用程序的窗口, 一個應用只需創建一次 UIWindow 窗口;

-- FKViewController 屬性 : 代表視圖控制器, 系統創建控制器時, 通常會加載對應的 xib 文件;

-- 應用初始界面 : 在 OCAppDelegate 中定義了 FKViewController 變量, 該變量類型對應的 xib 文件就是初始界面;

(3) AppDelegate.m 詳解

AppDelegate.m 詳解 :?

-- 代碼示例 : 書中的示例代碼;

// // FKAppDelegate.m // HelloiOS // // Created by yeeku on 13-5-16. // Copyright (c) 2013年 crazyit.org. All rights reserved. //#import "FKAppDelegate.h"#import "FKViewController.h"@implementation FKAppDelegate // 當應用程序啟動后將會調用該方法 - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {// 創建UIWindow對象，并初始化該窗口的大小與主屏幕大小相同// 程序將創建的UIWindow對象賦值給該程序委托對象的window屬性self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];// 創建FKViewController對象、并使用FKViewController界面布局文件來// 初始化該視圖控制器關聯的用戶界面self.viewController = [[FKViewController alloc] initWithNibName:@"FKViewController" bundle:nil];// 讓該程序的窗口加載、并顯示viewController視圖控制器關聯的用戶界面self.window.rootViewController = self.viewController;// 將該UIWindow對象設為主窗口、并顯示出來[self.window makeKeyAndVisible];return YES; }- (void)applicationWillResignActive:(UIApplication *)application {// 當應用程序從活動狀態轉入不活動狀態時，系統將會調用該方法。// 通常來說的，當應用程序突然被中斷（比如有電話、短信進來時），系統將會回調該方法// 另外，當用戶離開該程序，程序開始轉入后臺狀態時也會回調該方法。 }- (void)applicationDidEnterBackground:(UIApplication *)application {// 通常可通過重寫該方法來釋放共享資源、保存用戶數據，取消定時器。// 開發者還可通過該方法來保存足夠的狀態數據，// 這樣保證用戶重新啟動該應用時能正確恢復到當前狀態// 如果該應用程序支持后臺執行，當用戶退出時，系統調用調用該方法，而不是調用// applicationWillTerminate:方法 }- (void)applicationWillEnterForeground:(UIApplication *)application {// 當應用程序將要進入前臺時將會調用該方法。 }- (void)applicationDidBecomeActive:(UIApplication *)application {// 當應用程序進入前臺、并轉入活動狀態時將會調用該方法。 }- (void)applicationWillTerminate:(UIApplication *)application {// 當應用程序被終止時，系統將會調用該方法。 }@end
-- 重寫 application 方法 : 應用程序加載時會回調該方法;

application 方法流程 :?

-- 創建 UIWindow 對象 : 創建 UIWindow 對象, 該對象就是 IOS 應用程序的窗口;

self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];

-- 創建 ViewController 對象 : 該對象用于加載該對象對應的 xib 等界面設計文件;

self.viewController = [[FKViewController alloc] initWithNibName:@"FKViewController" bundle:nil];

-- 顯示界面 : 讓應用程序窗口顯示 ViewController 對象;

self.window.rootViewController = self.viewController;

-- 主窗口 : 將該程序的窗口設置為主窗口, 將主窗口顯示出來;

[self.window makeKeyAndVisible];

3. IOS 的 MVC 模式 -?M(Model 模型) V (View 視圖) C (Controller 控制器)

IOS MVC 模式 :?

-- Model 模型 : Model 一般式普通的 Objective - C 類, 這些類用于保存處理數據;

-- View 視圖 : 使用 Interface Builder 創建的視圖組件, 如 xib, storyboard 后綴的界面設計文件;

-- Controller 控制器 : 一般是 Objective - C 類, 一般都會繼承 UIViewController 基類;

4. UIViewController 控制器

UIController 方法詳解 : 主要用于處理視圖加載, 顯示等事件;

-- viewDidLoad 方法 : 視圖裝載完成后, 自動回調該方法, 重寫時注意先使用 [super viewDidLoad] 把父類方法調用了, 在其后追加自己處理的內容;

-- didReceiveMemoryWarning 方法 : 系統自動回調的, 內存緊張時會調用此方法, 在方法內釋放內存, 注意先調用 [super didReceiveMemoryWarning] 方法;

-- viewWillAppear 方法 : 視圖將要顯示時系統會自動回調該方法;

-- viewDidAppear 方法 : 視圖顯示出來后系統自動回調的方法;

-- viewWillDisappear 方法 : 視圖將要被隱藏或者關閉時, 回調該方法;

-- viewDidDisappear 方法 : 視圖被隱藏或關閉后, 回調該方法;

-- viewWillLayoutSubviews 方法 : 視圖將要排列其子視圖時, 需要回調的方法;

-- viewDidLayoutSubviews 方法 : 視圖已經排列好其子視圖后, 回調的方法;

UIViewController 代碼示例 :?

-- 頭文件 :?

// // OCViewController.h // FirstApp // // Created by octopus on 15-11-4. // Copyright (c) 2015年 www.octopus.org.cn. All rights reserved. //#import <UIKit/UIKit.h>@interface OCViewController : UIViewController@property (strong, nonatomic) IBOutlet UILabel *label1; @property (strong, nonatomic) IBOutlet UILabel *label2; @property (strong, nonatomic) IBOutlet UIButton *button; - (IBAction)button_click:(id)sender;@end

-- 實現文件 :?

// // OCViewController.m // FirstApp // // Created by octopus on 15-11-4. // Copyright (c) 2015年 www.octopus.org.cn. All rights reserved. //#import "OCViewController.h"@interface OCViewController ()@end@implementation OCViewController- (void)viewDidLoad {[super viewDidLoad];// Do any additional setup after loading the view, typically from a nib.//使用 IBOutlet 獲取 UI 控件[self.label1 setText:@"Tom"];//使用 tag 獲取 UI 控件UILabel * label_tag = (UILabel *)[self.view viewWithTag:1];[label_tag setText:@"Jerry"]; }- (void)didReceiveMemoryWarning {[super didReceiveMemoryWarning];// Dispose of any resources that can be recreated. }- (IBAction)button_click:(id)sender {//使用 IBOutlet 獲取 UI 控件[self.label1 setText:@"John"];//使用 tag 獲取 UI 控件UILabel * label_tag = (UILabel *)[self.view viewWithTag:1];[label_tag setText:@"John"]; } @end

三. IOS 中的事件機制

1. 通過 IBOutlet 連接獲取控件

(1) IBoutlet 屬性

IBOutlet 屬性 :?

-- 主要作用 : IBOutlet 屬性可以連接 Objective - C 源碼和界面設計文件 (.xib 文件或 .storyboard 文件);

-- 連接方法 : 在界面設計文件對應的 UIViewController 類中, 定義一個 IBOutlet 屬性, 該屬性與 Interface Builder 中的控件相關聯;

-- 調用方法 : 在 UIViewController 中調用控件的方法, 使用 IBOutlet 屬性即可訪問界面設計文件的組件;

(2) IBoutlet 連接步驟

IBOutlet 連接方法 :?

-- 打開輔助編輯器 :?

-- 輔助編輯器界面 : 左邊顯示界面設計文件, 右邊顯示 UIViewController 類;

-- 拖動控件到 UIViewController 中 : 按住 control 鍵, 將控件拖到 UIViewController.h 中;

-- 設置 IBOutlet 的屬性 : 控件拖到 UIViewController 中后, 彈出下面的對話框;

-- 連接控件 : 點擊上面的 Connect, 在 UIViewController 中就會出現 @property IBOutlet 屬性;

-- IBOutlet 連接標識 : 如下圖, 屬性前面有圓圈黑點, 即說明該屬性是連接 UI控件的;

(3) IBoutlet 屬性解析

IBOutlet 屬性解析 :?

-- Connection : 設置該控件的 IBOutlet 或 IBOutlet 集合, 默認 IBOutlet 屬性;

-- Name : 屬性名, 即 @property 的屬性名;

-- Type : 界面控件的類型, UILabel 等控件名稱;

-- Storage : Weak, Strong 指針的強弱存儲機制;

(4) IBoutlet 關聯查看

IBOutlet 屬性 :?

-- 不使用 @synthesize : 使用 @property 定義的屬性, 在 UIViewController.m 中不需要使用 @synthesize 設置 setter getter 方法;

-- 查看連接關系 : 使用 Xcode 的連接檢查器面板查看 IBOutlet 屬性與 UI控件間關聯, 使用 control + option + command + 6 或者右上角的 ?圖標?, 注意要在界面設計文件中先選擇 File Owner;

解析連接器面板中的 IBOutlet 元素 :?

-- Outlets : 多個 IBOutlet 屬性, 每個屬性都對應界面設計文件中的一個 UI 控件;

-- Referencing Outlets : 代表被選擇對象本身被關聯到其他對象的 IBOutlet 屬性;

-- Referencing Outlets Collections : 控件被關聯到其它對象的 IBOutlet 集合屬性;

2. 通過 Tag 屬性獲取控件

(1) Tag 獲取屬性簡介

通過 Tag 屬性獲取控件流程 :?

-- 設置 UILabel 控件的 Tag 屬性 : Command + option + 4 即可顯示屬性界面;

-- 獲取 UILabel 控件 : 通過 viewWithTag : tag標簽獲取 UI 控件的引用;?

//使用 tag 獲取 UI 控件UILabel * label_tag = (UILabel *)[self.view viewWithTag:1];[label_tag setText:@"Jerry"];

3. IBAction 綁定實現事件處理

(1) IBAction 簡介

IBAction 簡介 :?

-- 主要作用 : IBAction 是 UIViewController 中的特殊方法, 這該方法是 UI 控件事件處理方法;

IBAction 事件綁定流程 :?

-- 需求 : 為UIButton 組件添加點擊方法;?

-- 創建 UI 組件 : Interface Builder 中創建 UIButton 對象;

-- 創建 IBAction 方法 : 在界面設計文件對應的 UIViewController 中定義 IBAction 方法;

-- 綁定 IBAction 方法與 UI 組件 : 將 UIViewController 中的 IBAction 方法與界面設計文件中的 UIButton 組件綁定;

-- 觸發 IBAction 方法 :?界面中的 UIButton 被點擊, 就會回調 IBAction 方法;

(2) IBAction 綁定步驟

IBAction 綁定步驟 :?

-- 選中界面設計文件, 打開輔助編輯器 :?

-- 拖動按鈕到 UIViewController.h 文件中 : 按住 control 鍵不放, 將按鈕拖動到 UIViewController 中;

-- 設置 IBAction 屬性 : 在接下來彈出的對話框中的 Connection 列表設置為 Action, 將設置 IBAction 屬性, 設置完畢后會自動生成點擊事件回調方法, 之后在實現類中實現這個方法即可;

(3) IBAction 屬性詳解

IBAction 屬性 :?

-- Connection : 選擇為 UI 控件創建 IBOutlet 還是 IBAction 屬性類型;

-- Name : IBAction 方法名;

-- Type : 觸發該事件的 UI 控件類型, 默認為 id, 如果需要更精準可以設置成具體的 UI 組件類, 如 UIButton;

-- Event : 選擇為什么樣的事件綁定 IBAction 屬性, 默認 Touch Up Inside 在 UI 控件區域按下并松開;

-- Arguments : 選擇 IBAction 方法形參列表, Sender 觸發 IBAction 方法的事件源, Sender And Event, Event 是事件本身;

4. 通過代碼設置事件處理方法

(1) 注冊刪除事件響應方法

注冊刪除事件響應方法 :?

-- 注冊刪除事件方法來源 : IOS 中與用戶交互的控件都繼承了 UIControl 類, 注冊刪除控件響應方法是該 UIControl 基類提供的;

-- 添加事件響應方法 : "addTarget : action : forControlEvents :" , 為當前控件的指定事件設置處理方法;

--?移除事件響應方法 : "removeTarget : action : forControlEvent : " , 刪除 UIControl 指定的事件處理方法.

(2) 注冊刪除事件響應方法參數解析

添加移除事件方法參數解析 :?

-- addTarget / removeTarget 參數 : 指定事件響應方法所在的對象;

-- action 參數 : 接受一個 SEL 參數, 該參數代表的方法作為事件處理方法;

-- forControlEvents 參數 : UIControlEvent 枚舉值參數, 用于指定事件類型.

(3) 代碼示例

代碼示例 :?

-- OCViewController.h 頭文件 : 聲明 IBOutlet 指定 UI 控件引用;

@property (strong, nonatomic) IBOutlet UIButton *UIControl_button;
-- OCViewController.m 文件 : 為 UI 控件添加事件監聽;

//注意 selector 中的方法, 如果后面有參數則需要帶上冒號 ":"[self.UIControl_button addTarget: self action:@selector(button_click2:) forControlEvents: UIControlEventTouchUpInside];
-- 添加的方法 :?

- (void) button_click2:(id)sender{[self.label1 setText:@"octopus"];[self.label2 setText:@"octopus"];}

四. StoryBoard 介紹

1. StoryBoard 簡介

StoryBoard 簡介 :?

-- 使用版本 : IOS 5 之后默認使用 storyboard 作為界面設計文件, 而之前是 xib 作為默認的界面設計文件;

-- 與 xib 界面設計文件的共同點 : 項目中主要包含應用委托類, 界面設計文件, 界面控制類, 如下圖 :?

-- 不同點 : UIViewController 與界面設計文件的名稱不再相同, 界面設計文件名稱是 Main.storyboard, 該界面設計文件包含所有的界面;

-- 界面設計文件與界面控制類對應關系 : 一個 storyboard 界面設計文件對應多個界面控制類;

2. StoryBoard 與 xib 區別詳解

(1) Scence 概念

Scene 場景簡介 :?

-- Scene 組成 : Scene 由整個視圖, 視圖控制器, 第一響應者組成;

-- 場景與界面 : 一個場景對應一個窗口界面;?

-- 層次關系 : View Controller 在 Scene 中, UI 控件在 View Controller 中, 如下圖 :?

(2) 灰色箭頭

灰色箭頭作用 :?

-- 作用 : 箭頭表示 UI 控制器之間的切換關系, 箭頭指向需要加載的視圖控制器;

-- 移動箭頭 : 視圖中只有一個 UI 控制器, 移動箭頭始終指向唯一的一個 UI 控制器;

-- 好處 : 可以直觀地看到多個視圖之間的協作關系, 可以在 Interface Builder 中配置視圖之間的切換關系;

-- 圖示 :?

(3) 工具圖標

界面設計文件的工具圖標 :?

-- 縮小 : 多個視圖控制器在同一個窗口, 縮小界面可以同時查看所有的視圖控制器;

-- 恢復 : 恢復原樣查看;

-- 放大 : 放大界面設計文件;

3. AppDelegate 委托類對比

委托類代碼對比 :?

-- xib 委托類 : 加載完成方法;

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {// 創建UIWindow對象，并初始化該窗口的大小與主屏幕大小相同// 程序將創建的UIWindow對象賦值給該程序委托對象的window屬性self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];// 創建FKViewController對象、并使用FKViewController界面布局文件來// 初始化該視圖控制器關聯的用戶界面self.viewController = [[FKViewController alloc] initWithNibName:@"FKViewController" bundle:nil];// 讓該程序的窗口加載、并顯示viewController視圖控制器關聯的用戶界面self.window.rootViewController = self.viewController;// 將該UIWindow對象設為主窗口、并顯示出來[self.window makeKeyAndVisible];return YES; }

-- storyboard 委托類 : 加載完成方法;

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {// Override point for customization after application launch.return YES; }
-- 主要區別 : storyboard 不需要創建 UIViewWindow ?和 UIViewController, 不需要將 UIViewController 添加到 UIWindow 中;

-- 設置 storyboard : 點擊項目選項 , 在 General 選項卡中, 選擇左側 TARGETS, 選中對應項目, 在 Main Interface 中選擇 storyboard 界面設計文件;

五. 代碼控制 UI 界面

1. 代碼生成 UI 界面

(1) 代碼生成 UI 界面示例

基本無界面 UI 顯示代碼示例 :?

-- 創建 Empty Application :?

-- OCAppDelegate.h :?

// // OCAppDelegate.h // Empty // // Created by octopus on 15-11-19. // Copyright (c) 2015年 www.octopus.org.cn. All rights reserved. //#import <UIKit/UIKit.h>@interface OCAppDelegate : UIResponder <UIApplicationDelegate>@property (strong, nonatomic) UIWindow *window; @property (strong, nonatomic) UILabel * label;@property (readonly, strong, nonatomic) NSManagedObjectContext *managedObjectContext; @property (readonly, strong, nonatomic) NSManagedObjectModel *managedObjectModel; @property (readonly, strong, nonatomic) NSPersistentStoreCoordinator *persistentStoreCoordinator;- (void)saveContext; - (NSURL *)applicationDocumentsDirectory;@end
-- OCAppDelegate.m :?

// // OCAppDelegate.m // Empty // // Created by octopus on 15-11-19. // Copyright (c) 2015年 www.octopus.org.cn. All rights reserved. //#import "OCAppDelegate.h"@implementation OCAppDelegate@synthesize managedObjectContext = _managedObjectContext; @synthesize managedObjectModel = _managedObjectModel; @synthesize persistentStoreCoordinator = _persistentStoreCoordinator; @synthesize label;- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {// 創建 UIWindow 對象, 設置其大小與屏幕大小相同self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];// 設置背景顏色self.window.backgroundColor = [UIColor whiteColor];// 創建 UIViewController 對象UIViewController * controller = [[UIViewController alloc] init];// 窗口加載并顯示視圖控制器并關聯用戶界面self.window.rootViewController = controller;// 創建 UIView 對象UIView * rootView = [[UIView alloc] initWithFrame:[[UIScreen mainScreen] bounds]];// UIViewController 顯示 rootView 控件controller.view = rootView;// 創建圓角按鈕UIButton * button = [UIButton buttonWithType : UIButtonTypeRoundedRect];// 設置按鈕大小button.frame = CGRectMake(60, 200, 200, 40);// 為按鈕設置文本[button setTitle:@"octopus button" forState: UIControlStateNormal];// 為按鈕添加點擊事件[button addTarget:self action:@selector(button_click) forControlEvents:UIControlEventTouchUpInside];// 將按鈕添加到 View 上[rootView addSubview : button] ;// 創建 UILabel 對象label = [[UILabel alloc] initWithFrame:CGRectMake(60, 30, 200, 130)];// 設置文本內容label.text = @"octopus label";// 設置背景顏色label.backgroundColor = [UIColor grayColor];// 將 UILabel 添加到 rootView 中[rootView addSubview : label];// 顯示界面[self.window makeKeyAndVisible];return YES; }- (void) button_click {[label setText:@"button click"]; }- (void)applicationWillResignActive:(UIApplication *)application {// Sent when the application is about to move from active to inactive state. This can occur for certain types of temporary interruptions (such as an incoming phone call or SMS message) or when the user quits the application and it begins the transition to the background state.// Use this method to pause ongoing tasks, disable timers, and throttle down OpenGL ES frame rates. Games should use this method to pause the game. }- (void)applicationDidEnterBackground:(UIApplication *)application {// Use this method to release shared resources, save user data, invalidate timers, and store enough application state information to restore your application to its current state in case it is terminated later. // If your application supports background execution, this method is called instead of applicationWillTerminate: when the user quits. }- (void)applicationWillEnterForeground:(UIApplication *)application {// Called as part of the transition from the background to the inactive state; here you can undo many of the changes made on entering the background. }- (void)applicationDidBecomeActive:(UIApplication *)application {// Restart any tasks that were paused (or not yet started) while the application was inactive. If the application was previously in the background, optionally refresh the user interface. }- (void)applicationWillTerminate:(UIApplication *)application {// Saves changes in the application's managed object context before the application terminates.[self saveContext]; }- (void)saveContext {NSError *error = nil;NSManagedObjectContext *managedObjectContext = self.managedObjectContext;if (managedObjectContext != nil) {if ([managedObjectContext hasChanges] && ![managedObjectContext save:&error]) {// Replace this implementation with code to handle the error appropriately.// abort() causes the application to generate a crash log and terminate. You should not use this function in a shipping application, although it may be useful during development. NSLog(@"Unresolved error %@, %@", error, [error userInfo]);abort();} } }#pragma mark - Core Data stack// Returns the managed object context for the application. // If the context doesn't already exist, it is created and bound to the persistent store coordinator for the application. - (NSManagedObjectContext *)managedObjectContext {if (_managedObjectContext != nil) {return _managedObjectContext;}NSPersistentStoreCoordinator *coordinator = [self persistentStoreCoordinator];if (coordinator != nil) {_managedObjectContext = [[NSManagedObjectContext alloc] init];[_managedObjectContext setPersistentStoreCoordinator:coordinator];}return _managedObjectContext; }// Returns the managed object model for the application. // If the model doesn't already exist, it is created from the application's model. - (NSManagedObjectModel *)managedObjectModel {if (_managedObjectModel != nil) {return _managedObjectModel;}NSURL *modelURL = [[NSBundle mainBundle] URLForResource:@"Empty" withExtension:@"momd"];_managedObjectModel = [[NSManagedObjectModel alloc] initWithContentsOfURL:modelURL];return _managedObjectModel; }// Returns the persistent store coordinator for the application. // If the coordinator doesn't already exist, it is created and the application's store added to it. - (NSPersistentStoreCoordinator *)persistentStoreCoordinator {if (_persistentStoreCoordinator != nil) {return _persistentStoreCoordinator;}NSURL *storeURL = [[self applicationDocumentsDirectory] URLByAppendingPathComponent:@"Empty.sqlite"];NSError *error = nil;_persistentStoreCoordinator = [[NSPersistentStoreCoordinator alloc] initWithManagedObjectModel:[self managedObjectModel]];if (![_persistentStoreCoordinator addPersistentStoreWithType:NSSQLiteStoreType configuration:nil URL:storeURL options:nil error:&error]) {/*Replace this implementation with code to handle the error appropriately.abort() causes the application to generate a crash log and terminate. You should not use this function in a shipping application, although it may be useful during development. Typical reasons for an error here include:* The persistent store is not accessible;* The schema for the persistent store is incompatible with current managed object model.Check the error message to determine what the actual problem was.If the persistent store is not accessible, there is typically something wrong with the file path. Often, a file URL is pointing into the application's resources directory instead of a writeable directory.If you encounter schema incompatibility errors during development, you can reduce their frequency by:* Simply deleting the existing store:[[NSFileManager defaultManager] removeItemAtURL:storeURL error:nil]* Performing automatic lightweight migration by passing the following dictionary as the options parameter:@{NSMigratePersistentStoresAutomaticallyOption:@YES, NSInferMappingModelAutomaticallyOption:@YES}Lightweight migration will only work for a limited set of schema changes; consult "Core Data Model Versioning and Data Migration Programming Guide" for details.*/NSLog(@"Unresolved error %@, %@", error, [error userInfo]);abort();} return _persistentStoreCoordinator; }#pragma mark - Application's Documents directory// Returns the URL to the application's Documents directory. - (NSURL *)applicationDocumentsDirectory {return [[[NSFileManager defaultManager] URLsForDirectory:NSDocumentDirectory inDomains:NSUserDomainMask] lastObject]; }@end
-- 執行效果 : 點擊前;

-- 執行后 :?

-- 工程內容 : 該工程中只需要修改 OCAppDelegate.h 和 OCAppDelegate.m 兩個類;

2. 動態添加刪除組件

(1) 代碼示例

動態添加刪除組件代碼示例 :?

-- 創建文件 : 創建 Single View Application;

-- 工程文件顯示 : 只需要修改 OCViewController.m 文件即可, 其它文件原封不動;

-- OCViewController.m 代碼 :?

// // OCViewController.m // DynamicUI // // Created by octopus on 15-11-22. // Copyright (c) 2015年 www.octopus.org.cn. All rights reserved. //#import "OCViewController.h"/*類別與擴展類別 : 為現有類添加新方法, @interface 已有類 (類別名) ... 方法 ... @end, 實現類實現接口中的方法.-- 頭文件名稱 : 已有類+類別名.h;-- 實現類文件名稱 : 已有類+類別名.m, 注意該實現部分只是實現類別中定義的內容;擴展 : 擴展是匿名的類別, 擴展也要定義的已有類+任意名.h 中, 在實現類已有類.m 中需要實現已有類接口中的內容, 也需要實現擴展中定義的抽象類.*/ // OCViewController 的擴展, 在 @interface OCViewController ()@property (nonatomic, strong) NSMutableArray * labels;@end@implementation OCViewControllerint nextY = 80;- (void)viewDidLoad {[super viewDidLoad];// Do any additional setup after loading the view, typically from a nib.// 設置 View 的背景顏色self.view.backgroundColor = [UIColor grayColor];// 初始化數組self.labels = [NSMutableArray array];// 創建按鈕UIButton * button_add = [UIButton buttonWithType:UIButtonTypeRoundedRect];// 設置按鈕位置大小button_add.frame = CGRectMake(30, 30, 60, 40);// 設置按鈕平時狀態的文本, 可以設置平時狀態時的文本[button_add setTitle:@"添加 Label" forState : UIControlStateNormal];// 設置按鈕點擊事件[button_add addTarget:self action:@selector(addButton) forControlEvents:UIControlEventTouchUpInside];// 將按鈕添加到布局中[self.view addSubview:button_add];// 生成刪除按鈕UIButton * button_delete = [UIButton buttonWithType:UIButtonTypeRoundedRect];// 設置按鈕的位置大小button_delete.frame = CGRectMake(230, 30, 60, 40);// 設置按鈕文本[button_delete setTitle:@"刪除 Label" forState:UIControlStateNormal];// 設置按鈕點擊事件[button_delete addTarget:self action:@selector(deleteButton) forControlEvents:UIControlEventTouchUpInside];// 將按鈕添加到布局中[self.view addSubview:button_delete]; }// 添加控件方法 - (void) addButton {// 生成一個 UILabel 控件UILabel * label = [[UILabel alloc] initWithFrame:CGRectMake(80, nextY, 160, 30)];// 給控件設置文字label.text = @"Label 控件";// 將控件添加到集合中[self.labels addObject:label];// 將控件設置到布局中[self.view addSubview:label];// y 坐標自增nextY += 50; }// 刪除控件方法 - (void) deleteButton {// 刪除的前提是控件個數大于 0if([self.labels count] > 0){// 將集合中的最后一個 UILabel 控件從布局中刪除[[self.labels lastObject] removeFromSuperview];// 將 UILabel 控件從集合中刪除[self.labels removeLastObject];// y 坐標自減, 用于添加控件使用nextY -= 50;} }- (void)didReceiveMemoryWarning {[super didReceiveMemoryWarning];// Dispose of any resources that can be recreated. }@end
-- 演示效果 :?

3. 自定義 UI 控件

(1) 自定義組件簡介

自定義組件簡介 :?

-- UIView 基類 : 所有的 UI 控件都繼承了 UIView 基類, UI 組件在 UIView 提供的空白區域上繪制具體的細節;

-- 適用情況 : 在 IOS 系統提供的組件不滿足需求時, 就需要自定義組件;

(2) UIView 基類常用方法

UIView 基類常用方法簡介 :?

-- "initWithFrame :" 方法 : UI 控件初始化方法, 用于對 UI 控件額外初始化操作時使用;

-- "initWithCoder :" 方法 : 界面設計文件中加載完該控件后, 自動調用的方法;

-- "drawRect : " 方法 : 自行繪制控件內容, 重寫該方法, 在該方法中實現;

-- "layoutSubviews : " 方法 : 精確控制子控件布局;

-- "addAddSubviews : " 方法 : 添加完子控件后回調的方法;

-- "willRemoveSubview : " 方法 : 將要刪除子控件時, 回調該方法;

-- "didMoveToSuperview : " 方法 : 把控件添加到父控件完成時回調該方法;

-- "willMoveToSuperview : " 方法 : 在將要添加到父控件之前, 回調該方法;

-- "didMoveToWindow : " 方法 : 將控件添加到窗口完成時, 回調該方法;

-- "willMoveToWindow :?" 方法 : 將控件添加到窗口之前, 回調該方法;

-- "touchesBegan : withEvent : " 方法 : 開始觸摸控件時觸發的方法;

-- "touchesMoved : withEvent : " 方法 : 手指在控件上移動回調方法;

-- "touchesEnd : withEvent : " 方法 : 手指結束觸摸回調方法;

-- "touchesCanceled : withEvent : " 方法 : 取消觸摸回調方法;

(2) 自定義組件示例

自定義組件流程及代碼示例 :?

-- 創建 SingleViewApplication :?

-- 查看 Main.storyboard 的控件 : 點擊界面設計文件中的 UIView 根控件, 使用 command + option + 3 打開身份檢查器, 由身份檢查器上可以看到其 Custom Class 屬性為 UIView, 因此該界面的根控件時 UIView;

-- 創建自定義類 : 選擇菜單中的 File -> New File -> Cocoa Touch -> Objective-C Class;

-- OCFollowTouchView.h 代碼 :?

// // OCFollowTouchView.h // FollowTouch // // Created by octopus on 15-11-25. // Copyright (c) 2015年 www.octopus.org.cn. All rights reserved. //#import <Foundation/Foundation.h>@interface OCFollowTouchView : UIView@end

-- OCFollowTouchView.m 代碼示例 :?

// // OCFollowTouchView.m // FollowTouch // // Created by octopus on 15-11-25. // Copyright (c) 2015年 www.octopus.org.cn. All rights reserved. //#import "OCFollowTouchView.h"@implementation OCFollowTouchViewint currentX; int currentY;- (void) touchesMoved : (NSSet * ) touches withEvent:(UIEvent *)event {//獲取 UITouch 對象UITouch * touch = [touches anyObject];//獲取觸摸的位置CGPoint lastPoint = [touch locationInView:self];currentX = lastPoint.x;currentY = lastPoint.y;//重繪 UI 控件[self setNeedsDisplay]; }- (void) drawRect:(CGRect)rect {//獲取繪圖上下文對象CGContextRef ref = UIGraphicsGetCurrentContext();//設置所繪制的圖像為紅色CGContextSetFillColorWithColor(ref, [[UIColor redColor] CGColor]);//繪制圖像CGContextFillEllipseInRect(ref, CGRectMake(currentX - 10, currentY - 10, 20, 20)); }@end
-- 將自定義組件設置到 Main.storyboard 中 : 在 Custom Class 屬性中, 輸入自定義類, 然后點擊回車, 默認的 View 就會變成我們設置的自定義類;

-- 演示效果 :?

六. UI 圖片

參考文章 :?

-- IOS 圖標圖形 :?http://www.zhihu.com/question/20248971?;

-- IOS 7 官方推薦尺寸 : http://www.cnblogs.com/dyllove98/p/3233845.html?;

-- IOS 8 官方推薦尺寸 :?點擊打開鏈接?;

-- 圖標圖像大小 : http://www.cnblogs.com/dyllove98/p/3233845.html?;

1. IOS 圖片規格

(1) Retina 視網膜屏

Retina 屏幕簡介 :?

-- 像素 : 高清晰度的視網膜屏幕, 這種屏幕的分辨率是普通非 Retina 屏幕的 2 倍;

-- 市場狀況 : 目前 IOS 已經下架了所有的非 Retina 屏幕的設備, 目前在售的所有設備都是 Retina 設備, 但是之前賣出的許多設備有些不是 Retina 屏幕的;

-- 支持 Retina 屏幕的設備 : 現在在售的所有設備, iphone4 ~ 6S, ipod4, ipad 2 之后的新設備;

-- 不支持 Retina 屏幕設備 : 之前出售的低端 IOS 設備大都是非 Retina 屏幕的, ipod 1, ipod2, ipod3, iphone, iphone3G, iphone3GS, ipad1, ipad2.

-- 素材命名規范 : 非 Retina 屏幕名稱為 pictire.png, Retina 屏幕的圖片名稱是 picture@2x.png;

(3) 圓角矩形

圓角矩形圓角 :?

-- 512 px : 90 px;

-- 114 px : 20 px;

-- 72 px : 12 px;

-- 57 px : 10 px;

-- 58 px : 10 px;

-- 29 px : 9 px;

(3) 應用圖標規格

Retina 屏幕應用圖標規格 :?

-- iPhone 4S ~ 6 (Retina @2x) : 120 x 120 ;

-- iPhone6 Plus (Retina @3x) : 180 x 180;

-- iPad 和 iPad Mini (Retina @2x) : 152 x 152 ;

非 Retina 屏幕應用圖標規格 :?

-- iPad 和 iPad Mini (@1x) : 76 x 76 ;

-- iPhone 和 iPod : 57 x 57;

(4) 啟動界面像素

Retina 屏幕啟動畫面 :?

-- iPhone 5 ~ 6 : 640 x 1136;

-- iPhone 4 ~ 4S : 640 x 960;

-- iPad : 1536 x 2048 (縱向), 2048 x 1536 (橫向);;

非 Retina 屏幕啟動圖片 :?

-- iPad2 或 iPad Mini : 768 x 1024 (縱向), 1024 x 768 (橫向);

2. IOS 圖標設置

IOS 圖片設置 : 直接從文件目錄將圖片拖動到 Xcode 相應的設置中.

-- 設置圖標 : 在項目文件視圖中, 點擊 Images.xcassets, 選中左側的 AppIcon 設置應用圖標, 如下圖;

-- 設置啟動圖片 :?

總結

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。

上一篇：【Android应用开发】Android
下一篇：【iOS 开发】基本 UI 控件详解 (