iOS專案開發實戰——使用Xcode6設計自定義控制元件與圖形

       在iOS開發中，有許多控制元件都是Xcode預設提供的。使用這些控制元件是非常方便的。但是由於某些需要，需要自己設計控制元件，那麼應該怎麼做呢？在Xcode6中提供了這樣的介面，允許開發者快速開發自定義控制元件，並且可以提供實時預覽功能。具體實現步驟如下：

（1）新建一個Single View Application，Language選擇Swift。然後在系統配置主介面中點選專案名稱，選擇Add Target.

.

.

（2）然後在彈出的對話方塊中選擇Cocoa Touch Framework,輸入名字即可。我輸入的專案名稱是CustomViews。

。

（3）新建完上述的Cocoa Touch Framework後，專案目錄下多出了兩個資料夾，現在的目錄結構如下：

。

（3）在CustomViews中新建一個Cocoa Touch Class。語言選擇Swift，類名任意取，注意SubClass of要選擇UIView，點選建立即可。然後就會生成一個swift類。

。

（4）首先在Main.storyboard中拖入一個View控制元件，可以自己隨意設定一個背景顏色等。等下就要用剛才的Swift類來自定義設定這個View控制元件。注意這是個View控制元件。

。

（5）然後在這個控制元件的右側選擇Indentity Inspector中的Class中輸入剛才建立的Swift類，我輸入的是MyViews,然後系統預設會把Module也填上。

。

（6）然後我們就可以去MyViews.swift中對控制元件進行自定義設定了。寫入如下程式碼：首先要把該類宣告為@IBDesignable，表示是可被重新設計的。

import UIKit

@IBDesignable class MyViews: UIView {

    //邊框寬度；
    @IBInspectable var borderWidth:CGFloat = 0{
    
        didSet{
        
            layer.borderWidth = borderWidth
        }
    }
    
    //邊框顏色；
    @IBInspectable var borderColor:UIColor = UIColor.clearColor(){
    
        didSet{
        
            layer.borderColor = borderColor.CGColor
        }
    }
    
    //圓角半徑；
    @IBInspectable var cornerRadius:CGFloat = 0{
    
        didSet{
        
            layer.cornerRadius = cornerRadius
        }
    }
    
    //背景顏色；
    @IBInspectable var backgroundColors:UIColor = UIColor.clearColor(){
    
        didSet{
        
            layer.backgroundColor = backgroundColors.CGColor
        }
    }
    

}

（7）然後再來到Main.storyboard中，選中剛才的View控制元件，此時發現右側多了幾個設定屬性的選項，分別是設定邊框寬度，邊框顏色，圓角半徑和背景顏色，如圖：

。

通過改變屬性，可以在介面中實施檢視當前的設計結果：

。

       通過以上步驟，我們就可以隨意的設計自己喜歡的控制元件效果了。

github主頁：https://github.com/chenyufeng1991  。歡迎大家訪問！