zoukankan      html  css  js  c++  java
  • UI- Layer的使用总结(附动画)

    #pargma mark - Layer

     1. 设置当前视图的背景颜色

     self.view.backgroundColor = [UIColor lightGrayColor];

     2. 创建一个视图,并且设置frame

     UIView *myView = [[UIView alloc]initWithFrame:CGRectMake(50, 50, 100, 100)];

     3. 将创建的视图添加到当前视图

     [self.view addSubview:myView];

     4. 设置创建视图的背景颜色

     myView.backgroundColor = [UIColor blueColor];

     5. 设置视图的层属性,每个视图都关联着一个Layer

     设置 创建视图图层 的 背景颜色,即为 视图 本身 的 背景颜色 可通过Debug查看

     myView.layer.backgroundColor = [UIColor redColor].CGColor;

     // myView.backgroundColor = [UIColor yellowColor];

     设置图层的边界宽度

     myView.layer.borderWidth = 10;

     设置图层的边界颜色 ,默认为黑色

     myView.layer.borderColor = [UIColor whiteColor].CGColor;

     设置拐点的圆角半径, 可以巧妙的利用该方法画圆(将圆角半径设置为视图宽度的一般即可)

     myView.layer.cornerRadius = 50;

     添加一张图片

     myView.layer.contents = (__bridge id _Nullable)([UIImage imageNamed:@"btn_02"].CGImage);

     将图片超出圆角半径的内容裁剪掉

     myView.clipsToBounds = YES;

     //myView.layer.masksToBounds = YES;

    6.基础动画: 3种方式 --> 中心点移动/大小变化/旋转

     CABasicAnimation *basicAnimation = [CABasicAnimation animation];

     动画时间

     basicAnimation.duration = 2;

     动画重复次数

     basicAnimation.repeatCount = 3;

     basicAnimation.removedOnCompletion = YES;

     //填充模式4中 至今木有弄懂  `backwards', `forwards', `both' and `removed'

     // basicAnimation.fillMode = @"backwards";

     6.1 中心点移动动画

     basicAnimation.fromValue = [NSValue valueWithCGPoint: CGPointMake(50, 50) ];

     basicAnimation.byValue = [NSValue valueWithCGPoint:CGPointMake(200, 200)];

     basicAnimation.toValue = [NSValue valueWithCGPoint:CGPointMake(300, 300)];

     basicAnimation.keyPath = @"position";

     6.2 大小变化动画

     basicAnimation.toValue = [NSValue valueWithCGRect:CGRectMake(0, 0, 300, 400)];

     basicAnimation.keyPath = @"bounds";

     6.3 旋转

     basicAnimation.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI_4 + M_PI_2, 0, 0, 1)];

     basicAnimation.keyPath = @"transform";

     //注意:设置完动画后要添加动画

     [myLayer addAnimation:basicAnimation forKey:nil];

     7. 关键帧动画: 两种方式 --> 定义关键点/定义路径

     CAKeyframeAnimation *keyFrameAni = [CAKeyframeAnimation animation];

     keyFrameAni.duration = 2;

     keyFrameAni.repeatCount = 3;

     7.1 定义关键点

     NSValue *value1 = [NSValue valueWithCGPoint: CGPointMake(50, 50) ];

     NSValue *value2 = [NSValue valueWithCGPoint:CGPointMake(100, 200)];

     NSValue *value3 = [NSValue valueWithCGPoint:CGPointMake(300, 300)];

     keyFrameAni.keyPath = @"position";

     keyFrameAni.values = @[value1,value2,value3];

     7.2 定义路径

     CGMutablePathRef path = CGPathCreateMutable();

     //CGPathAddEllipseInRect(path, nil, CGRectMake(50, 50, 300, 400));

     CGPathAddArc(path, nil, 100, 100, 50, M_PI_2, M_PI, YES);

     keyFrameAni.path = path;

     CGPathRelease(path);

     keyFrameAni.keyPath = @"position";

     [myLayer addAnimation:keyFrameAni forKey:nil];

     8. 转换动画 --> 可有立体效果

     CATransition *transAnimaiton = [CATransition animation];

     transAnimaiton.duration = 3;

     transAnimaiton.type = @"cube";

     transAnimaiton.subtype = @"fromTop";

     [myLayer addAnimation:transAnimaiton forKey:nil];

  • 相关阅读:
    PHP xml_parser_set_option() 函数
    PHP xml_parser_get_option() 函数
    PHP xml_parser_free() 函数
    PHP xml_parser_create() 函数
    显示模式 | @media.display-mode (Media Queries)
    显示 | display (Flexible Box Layout)
    时间 | <time> (Values & Units)
    方向 | direction (Writing Modes)
    方向 | @viewport.orientation (Device Adaptation)
    文本阴影 | text-shadow (Text Decoration)
  • 原文地址:https://www.cnblogs.com/GJ-ios/p/5397807.html
Copyright © 2011-2022 走看看