I 基础知识 (CALayer)

每一个UIView内部都默认关联着一个CALayer, UIView有frame、bounds和center三个属性,CALayer也有类似的属性,分别为frame、bounds、position、anchorPoint。

1.1 anchorPoint

anchorPoint就相当于白纸上的图钉,它主要的作用就是用来作为变换的支点,旋转就是一种变换,类似的还有平移、缩放。

在iOS中,anchorPoint点的值是用一种相对bounds的比例值来确定的,在白纸的左上角、右下角,anchorPoint分为为(0,0), (1, 1),也就是说anchorPoint是在单元坐标空间(同时也是左手坐标系)中定义的。类似地,可以得出在白纸的中心点、左下角和右上角的anchorPoint为(0.5,0.5), (0,1), (1,0)。

CGAffineTransformMakeScale & setAnchorPoint 的使用例子

(0,0) 为左上角,(0,1) 为左下角, (1, 0)右上, (1,1) 右下 CGRect oldFrame = self .frame ; [ self .layer setAnchorPoint: CGPointMake ( 1.0 f, 0.0 f) ]; self .frame = oldFrame; [ UIView animateWithDuration: 0.3 animations:^{ // self.alpha = 0.f; // self.tableView.transform = CGAffineTransformMakeScale(0.001f, 0.001f); self .transform = CGAffineTransformMakeScale ( 0.001 f, 0.001 f); // self.tableView.alpha = 0.f; self .cover.hidden = YES ; } completion:^( BOOL finished) { self .hidden = YES ; self .transform = CGAffineTransformIdentity ;

1.2 position

The layer’s position in its superlayer’s coordinate space。

position是layer中的anchorPoint点在superLayer中的位置坐标。

position点是相对suerLayer的,anchorPoint点是相对layer的,两者是相对不同的坐标空间的一个重合点。

  • anchorPoint的默认值为(0.5,0.5),也就是anchorPoint默认在layer的中心点。
  • frame.origin由position和anchorPoint共同决定。
  • 修改anchorPoint,但又不想要移动layer也就是不想修改frame.origin,那么根据前面的公式,就需要position做相应地修改。简单地推导,可以得到下面的公式:

    positionNew.x = positionOld.x + (anchorPointNew.x - anchorPointOld.x)  * bounds.size.width  
    positionNew.y = positionOld.y + (anchorPointNew.y - anchorPointOld.y)  * bounds.size.height
    

    修改anchorPoint而不想移动layer,在修改anchorPoint后再重新设置一遍frame就可以达到目的,这时position就会自动进行相应的改变。

    + (void) setAnchorPoint:(CGPoint)anchorpoint forView:(UIView *)view{
        CGRect oldFrame = view.frame;
        view.layer.anchorPoint = anchorpoint;
        view.frame = oldFrame;
    

    II iOS开发中常用的动画(定点缩放弹窗)

    2.1 核心代码

    1、点击弹出按钮时,阴影alpha由0到1,弹窗的scale由0到1(这里使用CABasicAnimation) 2、 点击空白处,再让阴影alpha由1到0,弹窗的scale由1到0(同样使用CABasicAnimation),动画完成后移除阴影和弹窗 - (void)expandView{ //展示的时候,动画从右上角往左下脚延伸;隐藏的时候,动画从左下脚往右上角收回 [MemberCardMenuView setAnchorPoint:CGPointMake(0.9f, 0.0f) forView:self]; self.transform = CGAffineTransformMakeScale(0.001f, 0.001f); self.hidden = NO;// 修改为动画, MemberCardMenuView 提供一个动画的实例方法 self.cover.hidden = NO; self.cover.alpha = 0; [UIView animateWithDuration:0.3 animations:^{ self.transform = CGAffineTransformMakeScale(1.f, 1.f); self.cover.alpha = 1; } completion:^(BOOL finished) { self.transform = CGAffineTransformIdentity; [UIView animateWithDuration:0.3 animations:^{ self.transform = CGAffineTransformMakeScale(0.001f, 0.001f); self.cover.alpha = 0; } completion:^(BOOL finished) { self.hidden = YES; self.cover.hidden = YES; self.transform = CGAffineTransformIdentity;

    2.2 完整demo源码

    进入#小程序:iOS逆向搜索即可。

    see also

    iOS Horizontal Popup View 【 横向(水平方向)弹出菜单视图】例子:商品列表支持弹出菜单进行下/上架商品、打印商品价签、编辑商品信息、同步网店等操作popover

    kunnan.blog.csdn.net/article/det…

    分类:
    iOS
    标签: