iOS核心動畫高級技巧 - 8

iOS核心動畫高級技巧 - 1 

iOS核心動畫高級技巧 - 2 

iOS核心動畫高級技巧 - 3 

iOS核心動畫高級技巧 - 4 

iOS核心動畫高級技巧 - 5 

iOS核心動畫高級技巧 - 6 

iOS核心動畫高級技巧 - 7

15. 圖層性能

圖層性能

要更快性能，也要作對正確的事情。 ——Stephen R. Covey

在第14章『圖像IO』討論如何高效地載入和顯示圖像，經過視圖來避免可能引發動畫幀率降低的性能問題。在最後一章，咱們將着重圖層樹自己，以發掘最好的性能。

15.1 隱式繪製

隱式繪製

寄宿圖能夠經過Core Graphics直接繪製，也能夠直接載入一個圖片文件並賦值給contents屬性，或事先繪製一個屏幕以外的CGContext上下文。在以前的兩章中咱們討論了這些場景下的優化。可是除了常見的顯式建立寄宿圖，你也能夠經過如下三種方式建立隱式的：1，使用特性的圖層屬性。2，特定的視圖。3，特定的圖層子類。

瞭解這個狀況爲何發生什麼時候發生是很重要的，它可以讓你避免引入沒必要要的軟件繪製行爲。

文本

CATextLayer和UILabel都是直接將文本繪製在圖層的寄宿圖中。事實上這兩種方式用了徹底不一樣的渲染方式：在iOS 6及以前，UILabel用WebKit的HTML渲染引擎來繪製文本，而CATextLayer用的是Core Text.後者渲染更迅速，因此在全部須要繪製大量文本的情形下都優先使用它吧。可是這兩種方法都用了軟件的方式繪製，所以他們實際上要比硬件加速合成方式要慢。

一個開發者，有一個學習的氛圍跟一個交流圈子特別重要，這是一個個人iOS交流羣：1012951431， 分享BAT,阿里面試題、面試經驗，討論技術， 你們一塊兒交流學習成長！但願幫助開發者少走彎路。

不論如何，儘量地避免改變那些包含文本的視圖的frame，由於這樣作的話文本就須要重繪。例如，若是你想在圖層的角落裏顯示一段靜態的文本，可是這個圖層常常改動，你就應該把文本放在一個子圖層中。

光柵化

在第四章『視覺效果』中咱們提到了CALayer的shouldRasterize屬性，它能夠解決重疊透明圖層的混合失靈問題。一樣在第12章『速度的曲調』中，它也是做爲繪製複雜圖層樹結構的優化方法。

啓用shouldRasterize屬性會將圖層繪製到一個屏幕以外的圖像。而後這個圖像將會被緩存起來並繪製到實際圖層的contents和子圖層。若是有不少的子圖層或者有複雜的效果應用，這樣作就會比重繪全部事務的全部幀划得來得多。可是光柵化原始圖像須要時間，並且還會消耗額外的內存。

當咱們使用得當時，光柵化能夠提供很大的性能優點（如你在第12章所見），可是必定要避免做用在內容不斷變更的圖層上，不然它緩存方面的好處就會消失，並且會讓性能變的更糟。

爲了檢測你是否正確地使用了光柵化方式，用Instrument查看一下Color Hits Green和Misses Red項目，是否已光柵化圖像被頻繁地刷新（這樣就說明圖層並非光柵化的好選擇，或則你無心間觸發了沒必要要的改變致使了重繪行爲）。

15.2 離屏渲染

離屏渲染

當圖層屬性的混合體被指定爲在未預合成以前不能直接在屏幕中繪製時，屏幕外渲染就被喚起了。屏幕外渲染並不意味着軟件繪製，可是它意味着圖層必須在被顯示以前在一個屏幕外上下文中被渲染（不論CPU仍是GPU）。圖層的如下屬性將會觸發屏幕外繪製：

• 圓角（當和maskToBounds一塊兒使用時）

• 圖層蒙板

• 陰影

屏幕外渲染和咱們啓用光柵化時類似，除了它並無像光柵化圖層那麼消耗大，子圖層並無被影響到，並且結果也沒有被緩存，因此不會有長期的內存佔用。可是，若是太多圖層在屏幕外渲染依然會影響到性能。

有時候咱們能夠把那些須要屏幕外繪製的圖層開啓光柵化以做爲一個優化方式，前提是這些圖層並不會被頻繁地重繪。

對於那些須要動畫並且要在屏幕外渲染的圖層來講，你能夠用CAShapeLayer，contentsCenter或者shadowPath來得到一樣的表現並且較少地影響到性能。

CAShapeLayer

cornerRadius和maskToBounds獨立做用的時候都不會有太大的性能問題，可是當他倆結合在一塊兒，就觸發了屏幕外渲染。有時候你想顯示圓角並沿着圖層裁切子圖層的時候，你可能會發現你並不須要沿着圓角裁切，這個狀況下用CAShapeLayer就能夠避免這個問題了。

你想要的只是圓角且沿着矩形邊界裁切，同時還不但願引發性能問題。其實你能夠用現成的UIBezierPath的構造器+bezierPathWithRoundedRect:cornerRadius:（見清單15.1）.這樣作並不會比直接用cornerRadius更快，可是它避免了性能問題。

清單15.1 用CAShapeLayer畫一個圓角矩形

#import "ViewController.h"
#import 

@interface ViewController ()

@property (nonatomic, weak) IBOutlet UIView *layerView;

@end

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];

    //create shape layer
    CAShapeLayer *blueLayer = [CAShapeLayer layer];
    blueLayer.frame = CGRectMake(50, 50, 100, 100);
    blueLayer.fillColor = [UIColor blueColor].CGColor;
    blueLayer.path = [UIBezierPath bezierPathWithRoundedRect:
    CGRectMake(0, 0, 100, 100) cornerRadius:20].CGPath;
    
    //add it to our view
    [self.layerView.layer addSublayer:blueLayer];
}
@end

 

可伸縮圖片

另外一個建立圓角矩形的方法就是用一個圓形內容圖片並結合第二章『寄宿圖』提到的contensCenter屬性去建立一個可伸縮圖片（見清單15.2）.理論上來講，這個應該比用CAShapeLayer要快，由於一個可拉伸圖片只須要18個三角形（一個圖片是由一個3*3網格渲染而成），然而，許多都須要渲染成一個順滑的曲線。在實際應用上，兩者並無太大的區別。

清單15.2 用可伸縮圖片繪製圓角矩形

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];

    //create layer
    CALayer *blueLayer = [CALayer layer];
    blueLayer.frame = CGRectMake(50, 50, 100, 100);
    blueLayer.contentsCenter = CGRectMake(0.5, 0.5, 0.0, 0.0);
    blueLayer.contentsScale = [UIScreen mainScreen].scale;
    blueLayer.contents = (__bridge id)[UIImage imageNamed:@"Circle.png"].CGImage;
    //add it to our view
    [self.layerView.layer addSublayer:blueLayer];
}
@end

 

使用可伸縮圖片的優點在於它能夠繪製成任意邊框效果而不須要額外的性能消耗。舉個例子，可伸縮圖片甚至還能夠顯示出矩形陰影的效果。

shadowPath

在第2章咱們有提到shadowPath屬性。若是圖層是一個簡單幾何圖形如矩形或者圓角矩形（假設不包含任何透明部分或者子圖層），建立出一個對應形狀的陰影路徑就比較容易，並且Core Animation繪製這個陰影也至關簡單，避免了屏幕外的圖層部分的預排版需求。這對性能來講頗有幫助。

若是你的圖層是一個更復雜的圖形，生成正確的陰影路徑可能就比較難了，這樣子的話你能夠考慮用繪圖軟件預先生成一個陰影背景圖。

15.3 混合和過分繪製

混合和過分繪製

在第12章有提到，GPU每一幀能夠繪製的像素有一個最大限制（就是所謂的fill rate），這個狀況下能夠輕易地繪製整個屏幕的全部像素。可是若是因爲重疊圖層的關係須要不停地重繪同一區域的話，掉幀就可能發生了。

GPU會放棄繪製那些徹底被其餘圖層遮擋的像素，可是要計算出一個圖層是否被遮擋也是至關複雜而且會消耗處理器資源。一樣，合併不一樣圖層的透明重疊像素（即混合）消耗的資源也是至關客觀的。因此爲了加速處理進程，不到必須時刻不要使用透明圖層。任何狀況下，你應該這樣作：

• 給視圖的backgroundColor屬性設置一個固定的，不透明的顏色

• 設置opaque屬性爲YES

這樣作減小了混合行爲（由於編譯器知道在圖層以後的東西都不會對最終的像素顏色產生影響）而且計算獲得了加速，避免了過分繪製行爲由於Core Animation能夠捨棄全部被徹底遮蓋住的圖層，而不用每一個像素都去計算一遍。

若是用到了圖像，儘可能避免透明除非很是必要。若是圖像要顯示在一個固定的背景顏色或是固定的背景圖以前，你不必相對前景移動，你只須要預填充背景圖片就能夠避免運行時混色了。

若是是文本的話，一個白色背景的UILabel（或者其餘顏色）會比透明背景要更高效。

最後，明智地使用shouldRasterize屬性，能夠將一個固定的圖層體系摺疊成單張圖片，這樣就不須要每一幀從新合成了，也就不會有由於子圖層之間的混合和過分繪製的性能問題了。

15.4 減小圖層數量

減小圖層數量

初始化圖層，處理圖層，打包經過IPC發給渲染引擎，轉化成OpenGL幾何圖形，這些是一個圖層的大體資源開銷。事實上，一次性可以在屏幕上顯示的最大圖層數量也是有限的。

確切的限制數量取決於iOS設備，圖層類型，圖層內容和屬性等。可是總得說來能夠容納上百或上千個，下面咱們將演示即便圖層自己並無作什麼也會遇到的性能問題。

裁切

在對圖層作任何優化以前，你須要肯定你不是在建立一些不可見的圖層，圖層在如下幾種狀況下回事不可見的：

• 圖層在屏幕邊界以外，或是在父圖層邊界以外。

• 徹底在一個不透明圖層以後。

• 徹底透明

Core Animation很是擅長處理對視覺效果無心義的圖層。可是常常性地，你本身的代碼會比Core Animation更早地想知道一個圖層是不是有用的。理想情況下，在圖層對象在建立以前就想知道，以免建立和配置沒必要要圖層的額外工做。

舉個例子。清單15.3 的代碼展現了一個簡單的滾動3D圖層矩陣。這看上去很酷，尤爲是圖層在移動的時候（見圖15.1），可是繪製他們並非很麻煩，由於這些圖層就是一些簡單的矩形色塊。

清單15.3 繪製3D圖層矩陣

#import "ViewController.h"
#import 

#define WIDTH 10
#define HEIGHT 10
#define DEPTH 10
#define SIZE 100
#define SPACING 150
#define CAMERA_DISTANCE 500

@interface ViewController ()

@property (nonatomic, strong) IBOutlet UIScrollView *scrollView;

@end

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];

    //set content size
    self.scrollView.contentSize = CGSizeMake((WIDTH - 1)*SPACING, (HEIGHT - 1)*SPACING);

    //set up perspective transform
    CATransform3D transform = CATransform3DIdentity;
    transform.m34 = -1.0 / CAMERA_DISTANCE;
    self.scrollView.layer.sublayerTransform = transform;

    //create layers
    for (int z = DEPTH - 1; z >= 0; z--) {
        for (int y = 0; y < HEIGHT; y++) {
            for (int x = 0; x < WIDTH; x++) {
                //create layer
                CALayer *layer = [CALayer layer];
                layer.frame = CGRectMake(0, 0, SIZE, SIZE);
                layer.position = CGPointMake(x*SPACING, y*SPACING);
                layer.zPosition = -z*SPACING;
                //set background color
                layer.backgroundColor = [UIColor colorWithWhite:1-z*(1.0/DEPTH) alpha:1].CGColor;
                //attach to scroll view
                [self.scrollView.layer addSublayer:layer];
            }
        }
    }
    
    //log
    NSLog(@"displayed: %i", DEPTH*HEIGHT*WIDTH);
}
@end

 

15.5 總結

總結

本章學習了使用Core Animation圖層可能遇到的性能瓶頸，並討論瞭如何避免或減少壓力。你學習瞭如何管理包含上千虛擬圖層的場景（事實上只建立了幾百個）。同時也學習了一些有用的技巧，選擇性地選取光柵化或者繪製圖層內容在合適的時候從新分配給CPU和GPU。這些就是咱們要講的關於Core Animation的所有了（至少能夠等到蘋果發明什麼新的玩意兒）。