iOS 9應用開發教程之ios9的視圖

iOS 9應用開發教程之ios9的視圖

瞭解IOS9的視圖

在iPhone或者iPad中，用戶看到的和摸到的都是視圖。視圖是用戶界面的重要組成元素。本節將主要講解ios9視圖的添加、刪除以及位置和大小的設置等內容。

ios9視圖庫介紹

在視圖庫中存放了iOS開發中所需的全部視圖。開發者能夠在建立好iOS應用程序的項目之後，打開畫布的設計界面，這時在工具窗口的下半個窗口中，單擊Show the Object library圖標，就會顯示出視圖庫，如圖1.46所示。

圖1.46  視圖庫

在視圖庫中存放的視圖是能夠根據功能的不一樣進行分類的，如表1-3所示。

表1-3  視圖庫分類

在視圖庫的最下邊有兩個圖標，一個是用來進行顯示視圖排列方式的，一個是搜索視圖的，如圖1.47所示。

圖1.47  視圖庫

視圖始祖——UIView

在Swift中，NSObject是全部類的根類。一樣在UIKit框架（UIKit框架爲iOS應用程序提供界面對象和控制器）中，也存在一個如此神奇的類UIView。從繼承關係上看，UIView是全部視圖的根。通常稱UIView爲空白視圖。

ios9中添加視圖

在iOS中添加視圖的方式有兩種：一種是使用編輯界面添加視圖；另外一種是使用代碼添加視圖。如下是這兩個方式的詳細介紹。

1.編輯界面添加視圖

使用編輯界面添加視圖是一個至關簡單的工做，即從視圖庫中拖動視圖到主視圖中便可。

【示例1-1】如下將實現如何使用編輯界面添加一個空白視圖。具體的操做步驟以下：

（1）建立一個Single View Application模板類型的項目，命名爲UIVIew-InterfaceBuilder。

（2）打開Main.storyboard文件，單擊Show the Object library，在顯示的視圖庫中找到View視圖即空白視圖，將其拖到畫布的主視圖中，如圖1.48所示。

圖1.48  添加視圖

此時運行程序，會看到如圖1.49所示的效果。

圖1.49  運行效果

因爲使用編輯界面添加的View空白視圖默認的背景顏色爲白色，因此在模擬器上是看不出效果的。那麼該如何在模擬器上看到添加的View空白視圖呢？開發者須要回到Main.storyboard文件，選擇主視圖上添加的View空白視圖。而後，選擇在屬性檢查器面板中會打開相應的屬性設置，找到Background屬性將其設置爲Dark Gray Color，如圖1.50所示。

圖1.50  設置背景顏色

此時運行程序，會看到如圖1.51所示的效果。

圖1.51  運行效果

注意：在屬性檢查器面板中存放了一些屬性，當開發者單擊主視圖中的某一視圖後，屬性檢查器面板中就會出現對應的屬性設置，開發者能夠經過這些屬性對視圖進行美化。

2.代碼添加視圖

若是開發者想要使用代碼爲主視圖添加視圖，該怎麼辦呢。如下將爲開發者解決這一問題。要使用代碼爲主視圖添加視圖須要實現3個步驟。

（1）實例化視圖對象

每個視圖都是一個特定的類。在Swift中，常常會說，類是一個抽象的概念，而非具體的事物，因此要將類進行實例化。實例化一個視圖對象的具體語法以下：

• let/var 對象名=視圖類()

以咱們接觸的第一個視圖View爲例，它的實例化對象以下：

• let newView=UIView()

其中，UIView是空白視圖的類，newView是UIView類實例化出來的一個對象。

（2）設置視圖的位置和大小

每個視圖都是一個區域，因此須要爲此區域設置位置和大小。設置位置和大小的屬性爲frame，其語法形式以下：

• 對象名frame=CGRectMake (X ,Y ,Width,Height)

其中，X和Y表示視圖在主視圖中的位置，Width和Height表示視圖的大小。如下爲實例化的對象newView設置位置和大小：

• newView.frame=CGRectMake(67, 264, 240, 128)

其中，67和264表示此視圖的主視圖中的位置，240和128表示此視圖的大小。

注意：步驟1和步驟2也能夠進行合併。例如，如下的代碼是將UIView類的實例化對象和設置位置大小進行了合併：

• let newView=UIView(frame: CGRectMake(67, 264, 240, 128))

（3）將視圖添加到當前的視圖中

最後，也是最爲關鍵的一步，就是將實例化的對象添加到主視圖中。這樣才能夠進行顯示。此時須要使用到AddSubview()方法，其語法形式以下：

• this.view.addSubview (視圖對象名)

如下將實例化的對象newView添加到當前的主視圖中，代碼以下：

• self.view.addSubview(newView)

【示例1-2】如下將使用代碼爲主視圖添加一個View空白視圖。代碼以下：

• import UIKit

• class ViewController: UIViewController {

•     override func viewDidLoad() {

•         super.viewDidLoad()

•         // Do any additional setup after loading the view, typically from a nib.

•         let newView=UIView(frame: CGRectMake(67, 264, 240, 128))

•         self.view.addSubview(newView)

•     }

• ……

• }

此時運行程序，會看到如圖1.52所示的效果。在此運行效果中也是看不到添加的視圖的。這是由於添加的視圖默認是白色的背景，若是想要看到視圖，須要設置它的背景。例如如下的代碼，將背景顏色設置爲了灰色：

• newView.backgroundColor=UIColor.grayColor()

此時運行程序，會看到如圖1.53所示的效果。

圖1.52  運行效果                                   圖1.53  運行效果

ios9視圖的位置和大小

當一個視圖使用拖動的方式添加到主視圖後，它的位置和大小可使用拖動的方式進行設置，也可使用尺寸檢查器面板中的內容進行設置，如圖1.54所示。

圖1.54  位置尺寸設置                                         圖1.55  座標

注意：在默認的狀況下，座標系統的原點位於左上角，並向底部和右側延伸，如圖1.55所示。

ios9中刪除空白視圖

當開發者再也不須要主視圖的某一視圖時，能夠將該視圖刪除。實現此功能須要使用到removeFromSuperview()方法，其語法形式以下：

• 要刪除的視圖對象名.removeFromSuperview()

【示例1-3】如下代碼將在主視圖中添加兩個視圖，而後再使用removeFromSuperview()方法刪除其中一個視圖。代碼以下：

• import UIKit

• class ViewController: UIViewController {

•     override func viewDidLoad() {

•         super.viewDidLoad()

•         // Do any additional setup after loading the view, typically from a nib.

•         //添加空白視圖newView1

•         let newView1=UIView(frame: CGRectMake(0, 75, 375, 232))

•         newView1.backgroundColor=UIColor.cyanColor()

•         self.view.addSubview(newView1)

•         //添加空白視圖newView2

•         let newView2=UIView(frame: CGRectMake(0, 352, 375, 232))

•         newView2.backgroundColor=UIColor.orangeColor()

•         self.view.addSubview(newView2)

•     }

• ……

• }

此時運行程序，會看到如圖1.56所示的效果。若是想要刪除視圖對象newView1的話，須要使用removeFromSuperview()方法，代碼以下：

• newView1.removeFromSuperview()                                                               //刪除視圖對象newView1

運行效果如圖1.57所示。

圖1.56  運行效果                            圖1.57  運行效果

本文選自：iOS 9應用開發基礎教程大學霸內部資料，轉載請註明出處，尊重技術尊重IT人！