我正在尝试使用动画mask制作一个圆形蒙版图像视图,并使用不同的解决方案进行播放。下面的示例完成了工作,但是我遇到了两个问题:
1)为什么我无法使图像可轻敲?添加例如。一个UITapGestureRecognizer
不起作用。我的猜测是,遮罩会阻止触摸动作传播到视图层次结构的较低级别。
2)动画蒙版运行非常快,我无法使用UIView
块动画调整持续时间
我该如何解决?
- (void) addCircle {
// this is the encapsulating view
//
base = [[UIView alloc] init];
//
// this is the button background
//
base_bgr = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"c1_bgr.png"]];
base_bgr.center = CGPointMake(60, 140);
[base addSubview:base_bgr];
//
// icon image
//
base_icon = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"c1_ico.png"]];
base_icon.center = CGPointMake(186*0.3/2, 182*0.3/2);
base_icon.transform = CGAffineTransformMakeScale(0.3, 0.3);
[base addSubview:base_icon];
//
// the drawn circle mask layer
//
circleLayer = [CAShapeLayer layer];
// Give the layer the same bounds as your image view
[circleLayer setBounds:CGRectMake(0.0f, 0.0f, [base_icon frame].size.width,
[base_icon frame].size.height)];
// Position the circle
[circleLayer setPosition:CGPointMake(186*0.3/2-7, 182*0.3/2-10)];
// Create a circle path.
UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:
CGRectMake(0.0f, 0.0f, 70.0f, 70.0f)];
// Set the path on the layer
[circleLayer setPath:[path CGPath]];
[[base layer] setMask:circleLayer];
[self.view addSubview:base];
base.center = CGPointMake(100, 100);
base.userInteractionEnabled = YES;
base_bgr.userInteractionEnabled = YES;
base_icon.userInteractionEnabled = YES;
//
// NOT working: UITapGestureRecognizer
//
UITapGestureRecognizer *tapgesture = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapit:)];
[base_icon addGestureRecognizer:tapgesture];
//
// BAD but WORKS :) properly positioned UIButton over the masked image
//
base_btn = [UIButton buttonWithType:UIButtonTypeCustom];
base_btn.frame = CGRectMake(base.frame.origin.x, base.frame.origin.y, base_icon.frame.size.width, base_icon.frame.size.height);
[base_btn addTarget:self action:@selector(tapit:) forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:base_btn];
}
这是轻敲处理程序,这是蒙版动画。无论我在持续时间中尝试了多少数字,它的动画速度都非常快-大约0.25秒,并且我无法对其进行调整。
- (void) tapit:(id) sender {
//...
[UIView animateWithDuration:1.0
delay:0.0
options:UIViewAnimationOptionCurveEaseOut
animations:^ {
[circleLayer setTransform:CATransform3DMakeScale(10.0, 10.0, 1.0)];
}
completion:^(BOOL finished) {
// it is not necessary if I manage to make the icon image tappable
base_btn.frame = [base convertRect:base_icon.frame toView:self.view];
}];
}
}
1)触摸不会从其向下传播,base
因为它是在没有框架的情况下启动的,因此其框架将为CGRectZero。视图不会发生超出其边界的触摸事件。只需在base
包括整个点击目标的有效框架上进行设置。
2)setTransform:
在图层上调用隐式动画,该隐式动画使用Core Animation的默认持续时间0.25(您猜对了:))。最好的解决方案是使用CABasicAnimation
而不是UIView
基于动画。像这样:
CABasicAnimation *scaleAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
scaleAnimation.toValue = @(10.0f);
scaleAnimation.duration = 2;
[circleLayer addAnimation:scaleAnimation forKey:nil];
注意:默认情况下,完成CABasicAnimation
后将其自身从图层中删除,并且该图层将恢复为旧值。您可以通过例如将动画的removedOnCompletion
属性设置为NO
,然后稍后使用CALayer
的removeAnimationForKey:
方法将其删除(只设置一个键而不是传递nil
添加动画的权限)来防止它发生,但这取决于您究竟要完成此操作。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句