iOS上創(chuàng)建矢量圖形的要求

　　矢量圖形的一個巨大優(yōu)勢就是它可以被渲染在任意分辨率的屏幕上，同時保持絕對的平滑的且不失真。這就是為什么Post和TrueType字體在任意放大倍數下都如此清晰的原因。因為智能手機和電腦顯示屏幕一般是光柵排列，所以在合適的分辨率下，矢量圖形必須作為光柵圖形才能在屏幕渲染。而這些底層圖形庫已經封裝了上述實現，程序員并不需要了解。

　　1.什么時候使用矢量圖形

　　讓我們來考慮一下使用矢量圖形的一些場景。

　　App和按鈕圖標，用戶界面元素

　　幾年前（iOS7），蘋果公司在自己的app和iOS平臺自身的用戶界面中拋棄了擬物設計風格（skeuomorphism），而采用更扁平的精細設計?？梢詤⒖枷翪amera和Photo app引用的圖標。

　　十有八九，這些元素是由矢量圖形工具設計的。為了符合這些設計規(guī)則，開發(fā)者不得不跟隨扁平化風格，這導致大部分流行的（非游戲類）app完全改變了風格。

　　游戲

　　簡單圖像（Asteroids）或幾何主題（Super Hexagon）的游戲，能使用游戲引擎渲染矢量圖形。游戲中通過代碼編寫的部分也采用了矢量圖形。

　　圖片

　　你可以隨機的插入圖片來獲得基于相同基本圖形的多個版本的圖像。

　　2.貝塞爾曲線

　　什么是貝塞爾曲線？在不深入探討數學理論情況下，我們來討論下開發(fā)者實際用到的貝塞爾曲線特征。

　　自由度

　　貝塞爾曲線特點是它有多少的自由度。自由度越大，曲線變化越大（數學計算就越復雜）

　　一次方貝塞爾曲線就是兩點的直線線段。二次方貝塞爾曲線也稱作閉合曲線。三次方貝塞爾曲線（立方）是我們重點關注的，因為它在伸縮性和復雜性上提供了這種方案。

　　立方貝塞爾曲線不僅可以表示簡單平滑曲線，也可以表示封閉曲線和尖端曲線（兩曲線相匯與一點）。許多立方貝塞爾曲線段可以通過點對點的銜接在一起形成更復雜的形狀。

　　三維貝塞爾曲線

　　立方貝塞爾曲線的形狀是由它的兩個端點和兩個額外的描點決定它的形狀的。一般來說，n次方的貝塞爾曲線有（n-1）個描點，不用計算有幾個端點。

　　立方貝塞爾曲線有一個引人注目的特征是這些點有可視化的特性。連接端點和它最近的喵點的這條線是曲線的切線。這條切線是設計貝塞爾曲線形狀的基礎，我們會稍后深入研究這個特性。

　　幾何變化

　　基于曲線的數學特性，你可以簡單的在曲線上進行沒有任何精度損失的幾何變化，比如縮放，旋轉和平移。

　　下面的圖片展示了不同形狀的三次方貝塞爾曲線的樣本。注意綠色線就是曲線的切線。

　　3.Core Graphics和UIBezierPath類

　　在iOS和OS X平臺，矢量圖形底層是基于C語言的核心圖形庫實現的。它基于UIKit/Cocoa上層，封裝面向對象的類 。它的實現者就是UIBezierPath類（OS X是NSBezierPath類），一個貝塞爾曲線理論的實現。

　　UIBezierPath類支持一次方貝塞爾曲線（就是直線端），二次方貝塞爾曲線（封閉曲線）和三次方貝塞爾曲線（三維曲線）

　　從編程角度考慮，UIBezierPath對象可以通過添加子路徑的方式一個一個添加。為了實現這個方式，UIBezierPath對象持續(xù)關注currentPoint屬性。每次你添加一個新的子路徑段，最末端點就成為當前點，接下來的繪圖操作就從這個當前點開始。你可以手動移動這個點到你想要的位置。

　　UIBezierPath類為一些常用的形狀提供了便捷的方法，比如弧，圓和圓角矩形等。其內部的實現是多個子路徑互相連接而成。

　　貝塞爾曲線路徑形狀可以是開放或封閉的，甚至可以自包含或者同時有多個封閉曲線。

　　4.入門

　　這本指南需要讀者有一定的矢量圖形基礎。不過如果你是一位有經驗的開發(fā)者但從來沒使用過Core Graphics庫或UIBezierPath類，你可以學習下去。但如果你是新手并且不熟悉，我建議你先閱讀UIBezierPath的官方API說明（同樣參考Core Graphics官方文檔API）。在這篇教程中我們只會練習API中幾個有限的功能。

　　話不多說，我們這就開始編寫代碼。在該篇教程的剩余部分，我會展現兩個適合使用矢量圖形的場景。

　　打開Xcode工具，創(chuàng)建一個新的playground文件，設置平臺為iOS。順便說一句，Xcode的playground是使用矢量圖形工作變得有趣的另一個原因。你可以敲入代碼并立即獲得代碼的可視效果。請記住你必須使用最新版的Xcode，目前的版本是7.2。