所以就想來自己實現以下
不試不知道，這個動畫還真不是看上去那麼簡單，我自己想了半天愣是沒做出來，最後還是看了作者的代碼，才知道怎麼實現。 不過也從作者哪兒學了一招，就是layer.mask的用法。 自己實現的效果如圖： 
demo在這裏：https://github.com/Phelthas/LXMRevealDemo
（前面的畫圓的動畫，這是一個CAShaperLayer修改其strokeEnd的動畫，比較簡單，就沒有再寫了） 這個動畫說難也不難，其關鍵就在於對layer.mask的特性的運用，如果你不知道layer.mask的特性，那實現起來就相當困難了；相反，如果知道，那思路就豁然開朗了。 關鍵就是這個： /*
A layer whose alpha channel is used as a mask to select between the *
layer's background and the result of compositing the layer's* contents with its filtered background. Defaults to nil. When used as
* a mask the layer's `compositingFilter' and `backgroundFilters'
* properties are ignored. When setting the mask to a new layer, the
* new layer must have a nil superlayer, otherwise the behavior is
* undefined. Nested masks (mask layers with their own masks) are * unsupported. */@property(strong) CALayer *mask; mask屬性，可以實現很多形狀的遮罩，其基本效果是： 比如layerA是layerB的mask，即layerB.mask = layerA； 那麼layerA上透明的部分，會被繪製成白色擋住layerB（貌似都是白色，不知道能不能弄成其他顏色）； layerA上不透明的部分，會被繪製成透明，顯示出layerB的內容。 注意：作爲mask的layer不能有superLayer或者subLayer！ 知道了這個，動畫的思路就有了： imageView上有個遮罩，遮罩透明的部分逐漸變大，向外向內同時擴展，使遮罩後面的圖片爆料出來。 這裏首先需要一個圓形的CAShapeLayer，還需要兩個動畫，使這個layer同時向內向外擴展。 那麼問題來了，只有一個layer，還不能有subLayer，怎麼讓它同時又變大又變小呢？ 答案是：換個方式。 注意CAShapeLayer是線畫出來，線也有顏色，還有寬度是 lineWidth，而且這些屬性也是可以動畫的。 所以最終的方案是：設置圓的線的顏色爲透明，圓的填充色爲不透明，園外的顏色不透明（這裏的設置指的是看到的效果），讓圓逐漸變大到可以顯示出整個view，同時讓圓的lineWidth逐漸變寬到圓的半徑那麼大。 看到的效果就是圖片像上面的效果一樣逐漸顯露出來了。 核心動畫代碼如下： - (void)reveal {
self.backgroundColor = [UIColor clearColor];
[self.circleLayer removeFromSuperlayer];//理論上作爲mask的layer不能有父layer，所以要remove掉
self.superview.layer.mask = self.circleLayer;
//讓圓的變大的動畫
CABasicAnimation *pathAnimation = [CABasicAnimation animationWithKeyPath:@"path"];
UIBezierPath *toPath = [self pathWithDiameter:self.bigDiameter];
// UIBezierPath *toPath = [self pathWithDiameter:0];//縮小當前path的動畫
pathAnimation.toValue = (id)toPath.CGPath;
pathAnimation.duration = 1.0;
//讓圓的線的寬度變大的動畫，效果是內圓變小
CABasicAnimation *lineWidthAnimation = [CABasicAnimation animationWithKeyPath:NSStringFromSelector(@selector(lineWidth))];
lineWidthAnimation.toValue = @(self.bigDiameter);
lineWidthAnimation.duration = 1.0;
CAAnimationGroup *group = [CAAnimationGroup animation];
group.animations = @[pathAnimation, lineWidthAnimation];
group.duration = 1.0;
group.removedOnCompletion = NO;//這兩句的效果是讓動畫結束後不會回到原處，必須加
group.fillMode = kCAFillModeForwards;//這兩句的效果是讓動畫結束後不會回到原處，必須加
group.delegate = self;
[self.circleLayer addAnimation:group forKey:@"revealAnimation"]; } /**
* 根據直徑生成圓的path，注意圓點是self的中心點，所以（x，y）不是（0，0）
*/
- (UIBezierPath *)pathWithDiameter:(CGFloat)diameter {
return [UIBezierPath bezierPathWithOvalInRect:CGRectMake((CGRectGetWidth(self.bounds) - diameter) / 2, (CGRectGetHeight(self.bounds) - diameter) / 2, diameter, diameter)];
}
#pragma mark - CAAnimationDelegate
- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag {
self.superview.layer.mask = nil;
[self removeFromSuperview];
}
#pragma mark - property
- (CAShapeLayer *)circleLayer {
if (!_circleLayer) {
_circleLayer = [CAShapeLayer layer];
_circleLayer.fillColor = [UIColor clearColor].CGColor;//這個必須透明，因爲這樣內圓纔是不透明的
_circleLayer.strokeColor = [UIColor yellowColor].CGColor;//注意這個必須不能透明，因爲實際上是這個顯示出後面的圖片了
_circleLayer.path = [self pathWithDiameter:self.smallDiameter].CGPath;
}
return _circleLayer; } 完整代碼見github：https://github.com/Phelthas/LXMRevealDemo 有什麼錯誤歡迎批評指正