前言

大家都知道UIView支持AutoLayout，而CALayer不可以。這是因?yàn)閁IView負(fù)責(zé)事件響應(yīng)、布局信息存儲(chǔ)等，而CALayer主要負(fù)責(zé)頁(yè)面內(nèi)容展示。UIView和CALayer的關(guān)系，頗有一點(diǎn)“我負(fù)責(zé)賺錢養(yǎng)家，你負(fù)責(zé)貌美如花”的感覺(jué)。關(guān)于它們更全面的比較，可以參考詳解CALayer 和 UIView的區(qū)別和聯(lián)系
但是，有時(shí)候使用CALayer的時(shí)候，需要根據(jù)父視圖、獲取依賴其它視圖布局。比如下圖所示，根據(jù)UILabel文本的長(zhǎng)度，動(dòng)態(tài)調(diào)整放在它下面的漸變背景CAShapeLayer。那我們?cè)撊绾螌?shí)現(xiàn)呢？

JXLayerAutoLayout-1.png

實(shí)現(xiàn)方案

傳統(tǒng)方法

通常的做法是在viewDidLayoutSubviews的方面里面，根據(jù)依賴的視圖來(lái)調(diào)整CALayer的frame。

- (void)viewDidLayoutSubviews {
    [super viewDidLayoutSubviews];

    [self.testLabel sizeToFit];
    self.testLabel.center = self.view.center;

    self.gradientLayer.cornerRadius = self.testLabel.frame.size.height/2;
    CGFloat margin = 10;//gradientLayer左右需要有邊距
    CGRect frame = self.testLabel.frame;
    frame.origin.x -= margin;
    frame.size.width += margin*2;
    self.gradientLayer.frame = frame;
}

該方案的缺點(diǎn)：

• 在OC里面因?yàn)榭丶氖褂梅秶呀?jīng)跨方法，需要用一個(gè)屬性來(lái)引用它。
• 代碼分散，不好管理。

新方案一

每個(gè)UIView底層都有一個(gè)CALayer，并且UIView有一個(gè)API+ (Class)layerClass，允許我們自定義CALayer的類。那我們就可以自定義一個(gè)UILabel，重寫+ (Class)layerClass方法返回CAGradientLayer。我們只需要對(duì)UILabel進(jìn)行約束，就會(huì)映射到它自身的CALayer。

@implementation CustomLabel

+ (Class)layerClass {
    return [CAGradientLayer class];
}

- (void)layoutSubviews {
    [super layoutSubviews];

    CAGradientLayer *gradientLayer = (CAGradientLayer *)self.layer;
    gradientLayer.colors = @[(id)[[UIColor alloc] initWithRed:16/255.0 green:175/255.0 blue:211/255.0 alpha:1].CGColor, (id)[[UIColor alloc] initWithRed:33/255.0 green:94/255.0 blue:147/255.0 alpha:1].CGColor];
    gradientLayer.locations = @[@(0), @(1)];
    gradientLayer.startPoint = CGPointMake(0, 0);
    gradientLayer.endPoint = CGPointMake(1, 0);

    self.layer.cornerRadius = self.bounds.size.height/2.0;
}

@end

• 優(yōu)點(diǎn)&缺點(diǎn)
  優(yōu)點(diǎn)：只要封裝好UILabel，有類似的需求，直接拿來(lái)用就是了。
  缺點(diǎn)：就是因?yàn)槭褂们耙远x一個(gè)類，不可能對(duì)所有類似要求的控件子類化。有時(shí)候只是一個(gè)小需求，對(duì)一個(gè)小控件有類似需求。那么就可以采用第二個(gè)方案。

新方案二

通過(guò)block回調(diào)UIView的layoutSubviews，這樣就可以很靈活的布局CALayer了。
首先新建一個(gè)UIView的分類：

@implementation UIView (LayoutSubviewsCallback)

+ (void)load {
    Method originalMethod = class_getInstanceMethod(self, @selector(layoutSubviews));
    Method newMethod = class_getInstanceMethod(self, @selector(jx_layoutSubviews));
    method_exchangeImplementations(originalMethod, newMethod);
}

- (void)jx_layoutSubviews {
    [self jx_layoutSubviews];

    !self.layoutSubviewsCallback ?: self.layoutSubviewsCallback(self);
}

- (void)setLayoutSubviewsCallback:(void (^)(UIView *))layoutSubviewsCallback {
    objc_setAssociatedObject(self, "layoutSubviewsCallback", layoutSubviewsCallback, OBJC_ASSOCIATION_RETAIN);
}

- (void (^)(UIView *))layoutSubviewsCallback {
    return objc_getAssociatedObject(self, "layoutSubviewsCallback");
}
@end

外部使用：

    CAGradientLayer *gradientLayer = [CAGradientLayer layer];
    gradientLayer.colors = @[(id)[[UIColor alloc] initWithRed:16/255.0 green:175/255.0 blue:211/255.0 alpha:1].CGColor, (id)[[UIColor alloc] initWithRed:33/255.0 green:94/255.0 blue:147/255.0 alpha:1].CGColor];
    gradientLayer.locations = @[@(0), @(1)];
    gradientLayer.startPoint = CGPointMake(0, 0);
    gradientLayer.endPoint = CGPointMake(1, 0);
    [self.view.layer addSublayer:gradientLayer];
    self.testLabel.layoutSubviewsCallback = ^(UIView *view) {
        gradientLayer.frame = view.frame;
        gradientLayer.cornerRadius = view.bounds.size.height/2.0;
    };

這樣就解決了，代碼分散，自定義類的麻煩了。想在哪里用，就在哪里用??
下載源碼，拖入UIView+LayoutSubviewsCallback.h文件，就可以使用了

代碼倉(cāng)庫(kù)

Github地址喜歡就點(diǎn)顆??