简体   繁体   English

iOS-更改四边形曲线的控制点?

[英]iOS - Changing control points of Quad Curve?

I have drawn a quad curve with the following code, I also drew 3 ellipses, one for left corner, one for right corner and one for control point. 我用以下代码绘制了一条四边形曲线,我还绘制了三个椭圆,一个为左角,一个为右角,一个为控制点。

- (void)drawRect:(CGRect)rect
{
CGContextRef context = UIGraphicsGetCurrentContext();

CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();

CGContextSaveGState(context);

CGMutablePathRef curve = CGPathCreateMutable();

CGPathMoveToPoint(curve, nil, 5, 40);
CGPathAddQuadCurveToPoint(curve, nil, 30, 20, 55, 40);

CGContextAddPath(context, curve);
CGContextSetStrokeColorWithColor(context,[UIColor whiteColor].CGColor);
CGContextStrokePath(context);

CGContextSaveGState(context);

CGSize sz = self.frame.size;
CGPoint pt = CGPointMake(sz.width/2.0, sz.height/2.0);
CGFloat r = 5;

middleRect_ = CGRectMake(pt.x - r, pt.y - r, r * 2, r * 2);

CGContextAddEllipseInRect(context, middleRect_);
CGContextSetFillColorWithColor(context, [[UIColor whiteColor] CGColor]);
CGContextFillPath(context);

CGContextAddEllipseInRect(context, middleRect_);
CGContextSetLineWidth(context, 2);
CGContextSetStrokeColorWithColor(context, [[UIColor blackColor] CGColor]);
CGContextStrokePath(context);

//left side

sz = self.frame.size;
pt = CGPointMake(sz.width/2.0, sz.height/2.0);
r = 5;

leftRect_ = CGRectMake(pt.x - 27, pt.y + 3, r * 2, r * 2);

CGContextAddEllipseInRect(context, leftRect_);
CGContextSetFillColorWithColor(context, [[UIColor whiteColor] CGColor]);
CGContextFillPath(context);

CGContextAddEllipseInRect(context, leftRect_);
CGContextSetLineWidth(context, 2);
CGContextSetStrokeColorWithColor(context, [[UIColor blackColor] CGColor]);
CGContextStrokePath(context);

//right side
sz = self.frame.size;
pt = CGPointMake(sz.width/2.0, sz.height/2.0);
r = 5;
rightRect_ = CGRectMake(pt.x + 20, pt.y + 3, r * 2, r * 2);
CGContextAddEllipseInRect(context, rightRect_);
CGContextSetFillColorWithColor(context, [[UIColor whiteColor] CGColor]);
CGContextFillPath(context);

CGContextAddEllipseInRect(context, rightRect_);
CGContextSetLineWidth(context, 2);
CGContextSetStrokeColorWithColor(context, [[UIColor blackColor] CGColor]);
CGContextStrokePath(context);

// Cleanup Code
CGColorSpaceRelease(colorSpace);
CGContextRestoreGState(context);

}

as you can can see I am using 3 CGRects to store the positions. 如您所见,我正在使用3个CGRects存储头寸。 Now I want that whenenver I touch and drag an ellipse, it changes the curve. 现在,我希望每次触摸并拖动椭圆时,它都会改变曲线。 for example if touch the middle ellipse, it changes the control point, if I touch the leftRect, it changes left position, if I touch rightRect, it changes the right position. 例如,如果触摸中间的椭圆,则会更改控制点;如果触摸leftRect,则会更改左侧位置;如果触摸rightRect,则会更改右侧位置。 How to do that? 怎么做? I dont have the reference of these ellipses and curve, how can I do this? 我没有这些椭圆和曲线的参考,我该怎么做? Thanks 谢谢

You need track the touch events to know when the user starts dragging an ellipse. 您需要跟踪触摸事件,以了解用户何时开始拖动椭圆。 Use UIPanGestureRecognizer for that. UIPanGestureRecognizer ,请使用UIPanGestureRecognizer You also need variables to keep track of the locations of the ellipses. 您还需要变量来跟踪椭圆的位置。 Whenever user drags an ellipse, redraw everything by calling [self setNeedsDisplay] . 每当用户拖动椭圆时,都可以通过调用[self setNeedsDisplay]重绘所有内容。

Sorry for the brief answer, but it's a long way from drawing a quad curve to allowing users to control it. 抱歉,简短的答案,但是从绘制四边形曲线到允许用户控制它还有很长的路要走。 The algorithm is pretty straight forward though. 不过,该算法非常简单。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM