前言
大家都知道UIView支持AutoLayout，而CALayer不可以。这是因为UIView负责事件响应、布局信息存储等，而CALayer主要负责页面内容展示。UIView和CALayer的关系，颇有一点“我负责赚钱养家，你负责貌美如花”的感觉。关于它们更全面的比较，可以参考详解CALayer 和 UIView的区别和联系
但是，有时候使用CALayer的时候，需要根据父视图、获取依赖其它视图布局。比如下图所示，根据UILabel文本的长度，动态调整放在它下面的渐变背景CAShapeLayer。那我们该如何实现呢？
JXLayerAutoLayout-1.png
实现方案
传统方法
通常的做法是在viewDidLayoutSubviews的方面里面，根据依赖的视图来调整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;
}
该方案的缺点：
- 在OC里面因为控件的使用范围已经跨方法，需要用一个属性来引用它。
- 代码分散，不好管理。
新方案一
每个UIView底层都有一个CALayer，并且UIView有一个API+ (Class)layerClass，允许我们自定义CALayer的类。那我们就可以自定义一个UILabel，重写+ (Class)layerClass方法返回CAGradientLayer。我们只需要对UILabel进行约束，就会映射到它自身的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
- 优点&缺点
优点：只要封装好UILabel，有类似的需求，直接拿来用就是了。
缺点：就是因为使用前要自定义一个类，不可能对所有类似要求的控件子类化。有时候只是一个小需求，对一个小控件有类似需求。那么就可以采用第二个方案。
新方案二
通过block回调UIView的layoutSubviews，这样就可以很灵活的布局CALayer了。
首先新建一个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文件，就可以使用了
代码仓库
Github地址喜欢就点颗❤️
