CALayer家族
1. CAShaperLayer
实现如图效果
代码
UIBezierPath *path = [[UIBezierPath alloc] init];
[path moveToPoint:CGPointMake(175, 100)];
//绘制一个弧形图形
[path addArcWithCenter:CGPointMake(150, 100) radius:25 startAngle:0 endAngle:2*M_PI clockwise:YES];
[path moveToPoint:CGPointMake(150, 125)];
[path addLineToPoint:CGPointMake(150, 175)];
[path addLineToPoint:CGPointMake(125, 225)];
[path moveToPoint:CGPointMake(150, 175)];
[path addLineToPoint:CGPointMake(175, 225)];
[path moveToPoint:CGPointMake(100, 150)];
[path addLineToPoint:CGPointMake(200, 150)];
//define path parameters
CGRect rect = CGRectMake(50, 50, 100, 100);
CGSize radii = CGSizeMake(20, 20);
UIRectCorner corners1 = UIRectCornerBottomRight | UIRectCornerBottomLeft;
UIRectCorner corners2 = UIRectCornerTopLeft | UIRectCornerTopRight;
//create path
UIBezierPath *path2 = [UIBezierPath bezierPathWithRoundedRect:rect byRoundingCorners:corners2 cornerRadii:radii];
//create shape layer
CAShapeLayer *shapeLayer = [CAShapeLayer layer];
//stroke color 笔画颜色
shapeLayer.strokeColor = [UIColor redColor].CGColor;
//fill color 填充颜色
shapeLayer.fillColor = [UIColor blueColor].CGColor;
//line width 线段宽度
shapeLayer.lineWidth = 5;
//形状路径连线样式
shapeLayer.lineJoin = kCALineJoinRound;
//形状路径线帽样式
shapeLayer.lineCap = kCALineCapRound;
//shaperLayer 绘制图形路径
shapeLayer.path = path2.CGPath;
//add it to our view
[self.view.layer addSublayer:shapeLayer];
2. CATextLayer就可以实现自定义label,
代码如下 : 显示文案的
CATextLayer *textLayer = [CATextLayer layer];
textLayer.frame = CGRectMake(10,100 , self.view.frame.size.width -20, 200);
[self.view.layer addSublayer:textLayer];
//set text attributes(设置text的属性)
//字体颜色
textLayer.foregroundColor = [UIColor blackColor].CGColor;
//对齐方式
textLayer.alignmentMode = kCAAlignmentJustified;
//环绕在边界范围内
textLayer.wrapped = YES;
//choose a font (选择字体)
UIFont *font = [UIFont systemFontOfSize:15];
//set layer font (设置图层字体)
CFStringRef fontName = (__bridge CFStringRef)font.fontName;
CGFontRef fontRef = CGFontCreateWithFontName(fontName);
textLayer.font = fontRef;
textLayer.fontSize = font.pointSize;
//设置Retina渲染
textLayer.contentsScale = [UIScreen mainScreen].scale;
CGFontRelease(fontRef);
//choose some text 文字信息
NSString *text = @"大家好,我是CC.希望大家能够坚持的积累技术.积累和学习也许是目前最短改变自身现状的唯一捷径";
//set layer text 设置layer的文字信息
textLayer.string = text;
/// 自定义label
self.LLabel.text = @"Hello I'm LayerLabel";
self.LLabel.font = font;
self.LLabel.textColor = [UIColor blackColor];
使用CATextLayer就可以实现自定义封装一个label,重写label 代码如下
@interface LayerLabel : UIView
@property (strong, nonatomic) NSString *text;
@property (strong, nonatomic) UIColor *textColor;
@property (strong, nonatomic) UIFont *font;
@end
#import "LayerLabel.h"
@implementation LayerLabel
+ (Class)layerClass{
//this makes our label create a CATextLayer //instead of a regular CALayer for its backing layer
return [CATextLayer class];
}
- (CATextLayer *)textLayer{
return (CATextLayer *)self.layer;
}
- (void)setUp{
[self textLayer].alignmentMode = kCAAlignmentJustified;
[self textLayer].wrapped = YES;
[self.layer display];
}
- (id)initWithFrame:(CGRect)frame{
//called when creating label programmatically
if (self = [super initWithFrame:frame]) {
[self setUp];
}
return self;
}
- (void)awakeFromNib{
[self setUp];
[super awakeFromNib];
}
- (void)setText:(NSString *)text
{
[self textLayer].string = text;
}
- (void)setTextColor:(UIColor *)textColor
{
[self textLayer].foregroundColor = textColor.CGColor;
}
- (void)setFont:(UIFont *)font
{
CFStringRef fontName = (__bridge CFStringRef)font.fontName;
CGFontRef fontRef = CGFontCreateWithFontName(fontName);
[self textLayer].font = fontRef;
[self textLayer].fontSize = font.pointSize;
CGFontRelease(fontRef);
}
3. CATransformLayer
CATransformLayer是一个专门用来创建三维视图的一个layer 扩散思维： 是不是就可以做个摇筛子的功能 代码
@interface ViewController ()
@property (weak, nonatomic) IBOutlet UIView *containerView;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
self.view.backgroundColor = [UIColor blackColor];
//set up the perspective transform(设置投影矩阵)
CATransform3D pt = CATransform3DIdentity;
pt.m34 = -1.0 / 500.0;
self.containerView.layer.sublayerTransform = pt;
//set up the transform for cube 1 and add it
CATransform3D c1t = CATransform3DIdentity;
c1t = CATransform3DTranslate(c1t, -100, 0, 0);
CALayer *cube1 = [self cubeWithTransform:c1t];
[self.containerView.layer addSublayer:cube1];
//set up the transform for cube 2 and add it
CATransform3D c2t = CATransform3DIdentity;
c2t = CATransform3DTranslate(c2t, 100, 0, 0);
c2t = CATransform3DRotate(c2t, -M_PI_4, 1, 0, 0);
c2t = CATransform3DRotate(c2t, -M_PI_4, 0, 1, 0);
CALayer *cube2 = [self cubeWithTransform:c2t];
[self.containerView.layer addSublayer:cube2];
}
- (CALayer *)faceWithTransform:(CATransform3D)transform
{
//create cube face layer
CALayer *face = [CALayer layer];
face.frame = CGRectMake(-50, -50, 100, 100);
//apply a random color
CGFloat red = (rand() / (double)INT_MAX);
CGFloat green = (rand() / (double)INT_MAX);
CGFloat blue = (rand() / (double)INT_MAX);
face.backgroundColor = [UIColor colorWithRed:red green:green blue:blue alpha:1.0].CGColor;
face.transform = transform;
return face;
}
- (CALayer *)cubeWithTransform:(CATransform3D)transform
{
//create cube layer
CATransformLayer *cube = [CATransformLayer layer];
//add cube face 1
CATransform3D ct = CATransform3DMakeTranslation(0, 0, 50);
[cube addSublayer:[self faceWithTransform:ct]];
//add cube face 2
ct = CATransform3DMakeTranslation(50, 0, 0);
ct = CATransform3DRotate(ct, M_PI_2, 0, 1, 0);
[cube addSublayer:[self faceWithTransform:ct]];
//add cube face 3
ct = CATransform3DMakeTranslation(0, -50, 0);
ct = CATransform3DRotate(ct, M_PI_2, 1, 0, 0);
[cube addSublayer:[self faceWithTransform:ct]];
//add cube face 4
ct = CATransform3DMakeTranslation(0, 50, 0);
ct = CATransform3DRotate(ct, -M_PI_2, 1, 0, 0);
[cube addSublayer:[self faceWithTransform:ct]];
//add cube face 5
ct = CATransform3DMakeTranslation(-50, 0, 0);
ct = CATransform3DRotate(ct, -M_PI_2, 0, 1, 0);
[cube addSublayer:[self faceWithTransform:ct]];
//add cube face 6
ct = CATransform3DMakeTranslation(0, 0, -50);
ct = CATransform3DRotate(ct, M_PI, 0, 1, 0);
[cube addSublayer:[self faceWithTransform:ct]];
//center the cube layer within the container(将立方体层至于容器中心)
CGSize containerSize = self.containerView.bounds.size;
cube.position = CGPointMake(containerSize.width / 2.0, containerSize.height / 2.0);
//apply the transform and return
cube.transform = transform;
return cube;
}
效果
4. CAGradientLayer
颜色渐变的layer
代码
CAGradientLayer *gradientLayer = [CAGradientLayer layer];
gradientLayer.frame = CGRectMake(10, 50, self.view.frame.size.width - 20, 100);
gradientLayer.locations = @[@0.25,@0.5,@0.25];
gradientLayer.colors = @[(__bridge id)[UIColor redColor].CGColor,(__bridge id)[UIColor blueColor].CGColor,(__bridge id)[UIColor purpleColor].CGColor];
//左上角的位置
gradientLayer.startPoint = CGPointMake(0, 0);
//右下角的位置
gradientLayer.endPoint = CGPointMake(1, 1);
[self.view.layer addSublayer:gradientLayer];
5. CAReplicatorLayer
镜面layer： 是不是就可以实现倒影效果
@implementation ReflectionView
+ (Class)layerClass
{
return [CAReplicatorLayer class];
}
- (instancetype)initWithFrame:(CGRect)frame
{
if (self = [super initWithFrame:frame]) {
[self setUp];
}
return self;
}
- (void)awakeFromNib
{
[self setUp];
}
-(void)setUp
{
CAReplicatorLayer *layer = (CAReplicatorLayer *)self.layer;
layer.instanceCount = 2;
CATransform3D transform = CATransform3DIdentity;
//间隔
CGFloat veticalOffset = self.bounds.size.height + 10;
transform = CATransform3DTranslate(transform, 0, veticalOffset, 0);
transform = CATransform3DScale(transform, 1, -1, 0);
layer.instanceTransform = transform;
//K-0.7= 0.3 透明度
layer.instanceAlphaOffset = -0.7;
}
