在開發前我們需要知道，在 iOS 中，我們可以採取 Storyboard、XIBs 或是純 Code 的方式來開發 APP，有些人選擇從純 Code 方式起手，且隨著SwiftUI 的興起，使用SwiftUI 手寫代碼也將會越來越常見

參考文件：iOS開發，做UI時，用StoryBoard還是純代碼編寫？、說說 Storyboard vs XIBs vs Code

這邊先介紹最基礎的元件 UIView，至於其他的UIKit 元件都是以一樣的方式做處理，只是有屬性功能上的延伸而已

UIView

所有 UIKit 的元件（像是按鈕UIButton、文字UITextView等等）都是繼承自 UIView，它有著每個元件都需要的、最基礎的屬性、佈局及方法。

而要將元件放進畫面（即視圖View）中，需要了解有三個條件：原點、尺寸以及要疊加上去的父視圖。

iPhone 的原點是以左上角為(0,0)開始向右(x 軸) 跟向下(y 軸)

用法相同於以後要用到的其他的UIKit 元件，比如UILabel（顯示文字）、UIImageView（顯示圖片）、UIButton（按鈕）等都是類似的，只是各元件有更多個別的屬性而已

範例：

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

				let purpleView = UIView()
        // 將 UIView 的背景設置為紫色
        purpleView.backgroundColor = UIColor.purple
	      // 設置視圖的大小和位置
        purpleView.frame = CGRect(x: 0, y: 100, width: 150, height: 150) 
        // 使用addSubview()方法來將purpleView 加入至此頁(ViewController)
        view.addSubview(purpleView) 
    }
}

介紹一個工具：UIScreen，這主要用來取得螢幕的資訊，通常是用來取得整個螢幕的尺寸，如下：

// 取得螢幕的尺寸
let fullScreenSize = UIScreen.main.bounds.size

UIScreen.main表示的是設備的內部螢幕，其內有一個屬性為bounds，bounds又包含了兩個主要屬性：origin及size，分別是主畫面的原點及尺寸

• origin：有兩個屬性x及y，也就是原點。通常會使用CGPoint(x:,y:)來設置一個點
• size：有兩個屬性width及height，也就是尺寸，通常會使用CGSize(width:,height:)來設置一個尺寸

在獲得了螢幕的尺寸以後，我們來將前面定義的 UIView 設置一個新的位置：

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        let purpleView = UIView()
        purpleView.backgroundColor = UIColor.purple
        purpleView.frame = CGRect(x: 0, y: 100, width: 150, height: 150)
        view.addSubview(purpleView)
        
      	// 取得螢幕的尺寸
        let fullScreenSize = UIScreen.main.bounds.size
        // 設置 UIView 的中心位置點到由取得的螢幕長與寬的一半數值設置的點，這樣UIView 便會被放置在畫面的正中央
        purpleView.center = CGPoint(
          x: fullScreenSize.width * 0.5,
          y: fullScreenSize.height * 0.5)
    }
}