UIView 遮罩透明。

Posted

技术标签:

【中文标题】UIView 遮罩透明。【英文标题】:UIView mask transparent. 【发布时间】:2014-03-20 21:06:08 【问题描述】:

我使用 CAShapeLayer 来创建实心圆(图片 #1)。

现在我想用另一个更小的圆圈来掩盖那个圆圈,所以它看起来像图像 #2。

稍后我将通过减小蒙版的比例来动画填充(图 3)圆圈。

我怎样才能做到这一点?

【问题讨论】:

请上传您引用的图片:] 也许看看***.com/questions/2910770/…? 【参考方案1】:

我不确定以下方法的正确性如何正确;直接使用CALayers 可能会更好...

但是,如果您正在使用的视图/图层非常简单,那么以下代码可能足以满足您的需要。

它基于使用内部/较小圆圈的子视图 - 然后为 UIView 上的 transform 属性设置动画。

以防万一,这里有一个指向 Apple 文档Animating Views 的链接。

代码如下:

@implementation ViewController

    UIView* _innerCircleView;


- (void)viewDidLoad

    [super viewDidLoad];

    UIView* outerCircleView = [[UIView alloc] initWithFrame:CGRectMake(50, 50, 200, 200)];

    UIBezierPath* bigCircle = [UIBezierPath bezierPathWithArcCenter:CGPointMake(100, 100) radius:100 startAngle:0 endAngle:(M_PI * 2) clockwise:YES];
    [bigCircle closePath];
    CAShapeLayer* bigCircleLayer = [CAShapeLayer new];
    [bigCircleLayer setPath:bigCircle.CGPath];
    bigCircleLayer.fillColor = [UIColor blackColor].CGColor;
    [outerCircleView.layer addSublayer:bigCircleLayer];

    _innerCircleView = [[UIView alloc] initWithFrame:CGRectMake(50, 50, 100, 100)];
    UIBezierPath* smallerCircle = [UIBezierPath bezierPathWithArcCenter:CGPointMake(50, 50) radius:50 startAngle:0 endAngle:(M_PI * 2) clockwise:YES];
    [smallerCircle closePath];
    CAShapeLayer* smallCircleLayer = [CAShapeLayer new];
    [smallCircleLayer setPath:smallerCircle.CGPath];
    smallCircleLayer.fillColor = [UIColor whiteColor].CGColor;
    [_innerCircleView.layer addSublayer:smallCircleLayer];

    [outerCircleView addSubview:_innerCircleView];
    [self.view addSubview:outerCircleView];

    UIButton* animateButton = [[UIButton alloc] initWithFrame:CGRectMake(100, 300, 100, 50)];
    animateButton.backgroundColor = [UIColor blueColor];
    [animateButton setTitle:@"Animate" forState:UIControlStateNormal];
    [animateButton addTarget:self action:@selector(animateTap:) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:animateButton];


- (void)animateTap:(id)s

    [UIView animateWithDuration:3.0f animations:^()
        _innerCircleView.transform = CGAffineTransformScale(_innerCircleView.transform, 0.5, 0.5);
    ];

还有来自模拟器的快速之前之后

【讨论】:

以上是关于UIView 遮罩透明。的主要内容,如果未能解决你的问题,请参考以下文章

如何用css实现半透明遮罩层效果

CSS 半透明遮罩层

只需用矩形遮罩 UIView

如何用css实现半透明遮罩层效果

如何实现动态UIView遮罩?

pr颜色遮罩怎么用