iOS Core Animation - 图层几何学

本文详细解析了iOS开发中frame、bounds、center、position和anchorPoint的概念及作用,通过时钟界面实例展示了如何利用这些属性实现精确的UI布局与动画效果。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

一  布局

  frame:代表了图层的外部坐标(相对于父视图);

  bounds:内部坐标相对于自己;

  center,positinon:都代表了相对不父图层锚点的位置。

发生旋转的时候frame会改变bounds,center,positinon,不会改变

二  锚点

anchorPoint:锚点用来移动图层的把柄,默认位于图层的中心。锚点可以被移动,frame也会相对移动

通过一个钟表小示例演示下锚点作用。

xib布局UI界面,时分秒针重合了,

- (void)viewDidLoad {
    [super viewDidLoad];
    self.panVIew.layer.cornerRadius = 150;
   // self.panVIew.layer.anchorPoint = CGPointMake(0, 0);改变锚点frame会变;
    [self tick];
    self.timer = [NSTimer scheduledTimerWithTimeInterval:1.0 target:self selector:@selector(tick) userInfo:nil repeats:YES];
    
    
    
}
-(void)tick{
    NSCalendar *calender = [[NSCalendar alloc] initWithCalendarIdentifier:NSCalendarIdentifierGregorian];
    NSCalendarUnit units = NSCalendarUnitHour | NSCalendarUnitMinute | NSCalendarUnitSecond;
    NSDateComponents *compents = [calender components:units fromDate:[NSDate date]];
    self.time.text = [NSString stringWithFormat:@"%ld:%ld:%ld",(long)compents.hour,(long)compents.minute,(long)compents.second];
    
    CGFloat hourAngle = (compents.hour/12.0)*M_PI*2.0;
    CGFloat minuteAngle = (compents.minute/60.0)*M_PI*2.0;
    CGFloat secondAngle = (compents.second/60.0)*M_PI*2.0;
    self.hourView.transform = CGAffineTransformMakeRotation(hourAngle);
    self.minuteView.transform = CGAffineTransformMakeRotation(minuteAngle);
    self.secondView.transform = CGAffineTransformMakeRotation(secondAngle);
    
    
}

效果:

很明显指针是围绕着中心旋转的,需要改变旋转的锚点,可以加到viewDidLoad里面

    self.hourView.layer.anchorPoint = CGPointMake(0.5f, 0.9f);
    self.minuteView.layer.anchorPoint = CGPointMake(0.5f, 0.9f);
    self.secondView.layer.anchorPoint = CGPointMake(0.5f, 0.9f);

看下改变后的效果:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值