【发布时间】:2013-03-06 14:17:16
【问题描述】:
我想做的是让用户触摸屏幕,当在该位置检测到触摸时,圆圈的大小会增大(并继续增大),直到用户放开为止。
我知道如何检测触摸,但我遇到的问题是尝试绘制并随着圆圈变大而重新绘制。
最好的方法是什么?
【问题讨论】:
-
您是否在为可以失效的圈子使用自定义视图?
我想做的是让用户触摸屏幕,当在该位置检测到触摸时,圆圈的大小会增大(并继续增大),直到用户放开为止。
我知道如何检测触摸,但我遇到的问题是尝试绘制并随着圆圈变大而重新绘制。
最好的方法是什么?
【问题讨论】:
我会使用UILongPressGestureRecognizer、NSTimer 和UIBezierPath 的组合来实现这一目标。
首先,设置您的 viewDidLoad 以添加和配置 CAShapeLayer,该 CAShapeLayer 将容纳您要绘制的圆圈。下面的代码最初会在屏幕上绘制一个半径为 50 点的圆,并在主视图中添加一个长按手势。当然,触摸检测可以按照您喜欢的任何方式进行。哦,你需要为此导入 Quartz。
- (void)viewDidLoad
{
[super viewDidLoad];
circleRadius = 50.0f;
circle = [CAShapeLayer layer];
[circle setAnchorPoint:CGPointMake(0.5f, 0.5f)];
[circle setFillColor:[UIColor clearColor].CGColor];
[circle setStrokeColor:[UIColor colorWithWhite:0.9f alpha:0.7f].CGColor];
[circle setLineWidth:5.0f];
[self.view.layer addSublayer:circle];
[self drawCircleWithRadius:circleRadius];
UILongPressGestureRecognizer *longPress = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(longPressDetected:)];
[longPress setMinimumPressDuration:0.1];
[longPress setAllowableMovement:15.0f];
[self.view addGestureRecognizer:longPress];
}
然后,当长按手势被识别时,检查它的状态。如果它的状态是began,则启动一个重复计时器来调用动画函数。当手势结束时,无效。
- (void)longPressDetected:(UILongPressGestureRecognizer *)sender {
if (sender.state == UIGestureRecognizerStateBegan) {
timer = [NSTimer scheduledTimerWithTimeInterval:0.1 target:self selector:@selector(animateImageView) userInfo:nil repeats:YES];
}else if (sender.state == UIGestureRecognizerStateEnded) {
[timer invalidate];
}
}
- (void)animateImageView {
circleRadius += 10.0f;
[self drawCircleWithRadius:circleRadius];
}
最后,下面的这个函数将使用 CABasicAnimation 将形状图层的路径属性设置为上面指示的值(每次 +10)。确保此动画持续时间不高于计时器重复间隔!
- (void)drawCircleWithRadius:(CGFloat)radius {
CABasicAnimation *pathAnimation = [CABasicAnimation animationWithKeyPath:@"path"];
[pathAnimation setFromValue:(id)circle.path];
[pathAnimation setToValue:(id)[UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, 2.0f * radius, 2.0f * radius) cornerRadius:radius].CGPath];
[pathAnimation setDuration:0.1];
[pathAnimation setRepeatCount:1.0f];
[pathAnimation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear]];
circle.path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, 2.0*radius, 2.0*radius) cornerRadius:radius].CGPath;
circle.position = CGPointMake(CGRectGetMidX(self.view.frame)-radius, CGRectGetMidY(self.view.frame)-radius);
[circle addAnimation:pathAnimation forKey:@"changePathAnimation"];
}
希望这会有所帮助!
【讨论】:
最好的方法是使用 Quartz 2D 并在触摸时为形状设置动画。
使用类似的东西..
CGContextRef ctxt = [[NSGraphicsContext currentContext] graphicsPort];
CGGradientRef gradient;
CGColorSpaceRef colorSpace;
CGFloat locations[] = {0.0,1.0};
CGFloat components[] = { 0.5,1.0,1.0,1.0, 0.25,0.5,0.5,1.0 };
colorSpace = CGColorSpaceCreateWithName(kCGColorSpaceGenericRGB);
gradient = CGGradientCreateWithColorComponents(colorSpace,components,locations,
sizeof(locations)/sizeof(CGFloat));
CGPoint start = {70.0,130.0}, end = {100.0,100.0};
CGFloat startRadius = 0.0, endRadius = 90.0;
CGContextDrawRadialGradient(ctxt,gradient,start,startRadius,end,endRadius,0);
CGGradientRelease(gradient);
CGColorSpaceRelease(colorSpace);
关于 Quartz2d 的动画技术,请看这里.. https://github.com/neror/CA360
【讨论】:
您必须自定义 UIView 才能在 drawRect: 方法中绘制圆。在 viewController 的视图上处理捏合效果,更新 UIView 自定义变量并使用:
[myCicleView setNeedsDisplay];
强制视图重绘自身。
【讨论】:
你可以试试这个:
触摸方法
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
myTimer = [NSTimer scheduledTimerWithTimeInterval:0.1 target:self selector:@selector(reDrawCircle) userInfo:nil repeats:YES];
}
-(void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
{
[myTimer invalidate];
myTimer = nil;
}
对于缩放图像::
-(void)reDrawCircle {
//Your Code for Circle Re-Draw.
}
当用户触摸时,它将为您的重新绘制圆圈的方法启动计时器,当用户以触摸结束时,它将使计时器无效。所以它不会调用方法进行重绘。
希望对您有所帮助。
谢谢。
【讨论】: