anchorPoint（锚点） and position

anchorPoint

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

锚点与frame bounds之间的关系.png

anchorPoint是以视图本身为参照物，anchorPoint在视图宽高中的比例

锚点的作用.png

anchorPoint在旋转、平移、缩放中的作用

position

position是layer中的anchorPoint点在superLayer中的位置坐标
position点是相对suerLayer的，anchorPoint点是相对layer的，两者是相对不同的坐标空间的一个重合点

layer.position与view.center之间的关系
layer没有center属性一说，当layer设置锚点之后，view.center = layer.position ，也就是说 严格意义上View.center属性是有争议的

实战

实现 imgView跟随手指拖动 移动，之后根据在屏幕上的位置缩放

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    [self.view addSubview:self.imgView];
    self.imgView.frame = [UIImage scaleBigFrameWithSize:self.imgView.image.size];
    //平移手势
    UIPanGestureRecognizer *interactiveTransitionRecognizer;
    interactiveTransitionRecognizer = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(interactiveTransitionRecognizerAction:)];
    interactiveTransitionRecognizer.maximumNumberOfTouches = 1;
    [self.view addGestureRecognizer:interactiveTransitionRecognizer];
    
}

- (void)interactiveTransitionRecognizerAction:(UIPanGestureRecognizer *)gestureRecognizer
{
    CGPoint velocity = [gestureRecognizer velocityInView:gestureRecognizer.view];
    NSLog(@"interactiveTransitionRecognizerActionvelocity:%@",NSStringFromCGPoint(velocity));
    
    CGPoint translation = [gestureRecognizer translationInView:gestureRecognizer.view];
    NSLog(@"interactiveTransitionRecognizerActionTranslation:%@",NSStringFromCGPoint(translation));
   
    if (gestureRecognizer.state == UIGestureRecognizerStateBegan) {
        //手势发生在哪个view上
        UIView *piece = self.imgView;
        //获得当前手势在view上的位置。
        CGPoint locationInView = [gestureRecognizer locationInView:self.imgView];
        
        piece.layer.anchorPoint =CGPointMake(locationInView.x / piece.bounds.size.width, locationInView.y / piece.bounds.size.height);
        //根据在view上的位置设置锚点。
        //防止设置完锚点过后，view的位置发生变化，相当于把view的位置重新定位到原来的位置上。
        CGPoint locationInSuperview = [gestureRecognizer locationInView:piece.superview];
        piece.layer.position = locationInSuperview;
        NSLog(@"开始center:%@",NSStringFromCGPoint(piece.layer.position));
        
    }else if (gestureRecognizer.state == UIGestureRecognizerStateChanged){
        CGFloat scale = 1 - fabs(translation.y / ScreenHeight);
        CGAffineTransform t = CGAffineTransformTranslate(CGAffineTransformIdentity, translation.x, translation.y);
        CGAffineTransform scaleTransform = CGAffineTransformScale(t, scale, scale);
        self.imgView.transform = scaleTransform;
    }else if (gestureRecognizer.state == UIGestureRecognizerStateChanged){
        //锚点复位
        CGRect frame = self.imgView.frame;
        CGPoint center = CGPointMake(frame.origin.x + frame.size.width/2 , frame.origin.y + frame.size.height/2);
        self.imgView.layer.anchorPoint = CGPointMake(0.5, 0.5);
        self.imgView.layer.position = center;
    }
}

- (UIImageView *)imgView {
    if (!_imgView) {
        _imgView = [[UIImageView alloc] init];
        _imgView.userInteractionEnabled = YES;
        //UIViewContentModeScaleAspectFill contentMode 配合 clipsToBounds 使用，才能真正实现 一边适应frame 宽，一边实现剪切的作用
        _imgView.contentMode = UIViewContentModeScaleAspectFill;
        _imgView.clipsToBounds = YES;
        _imgView.backgroundColor = [UIColor clearColor];
        _imgView.image = [UIImage imageNamed:@"IMG_0091.JPG"];
    }
    return _imgView;
}

重点理解：
1、手势开始，锚点定位到手指位置在图片中比例位置之后，图片位置发生改变之后，图片的置位过程，理解以上两个概念之后，不难理解
2、手势结束，锚点复位为0.5,0.5 图片位置保持不动，计算复位之后锚点相对于父视图的坐标即可

参考链接：
anchorPoint与position http://wonderffee.github.io/blog/2013/10/13/understand-anchorpoint-and-position/
核心动画高级技巧 https://zsisme.gitbooks.io/ios-/content/chapter3/anchor.html

心得：不了解理论的情况下，强行实战容易走火入魔！！！