从调整线路端点 [英] Resize line from endpoints
问题描述
我在视图上绘制注释。该生产线标注导致问题;
I am drawing annotations on a view. The line annotation is causing a problem;
我有一个父类形状（从UIView的扩展）的。所有注解形状的子类。在每一个注释类，我有重写drawRect方法。 DrawingCanvas类（UIView的距离延长，是我的viewController的父视图的子视图）处理平移手势。这里是一块code的
I have a parent class of Shape (extended from UIView). All the annotations are subclass of shape. In each annotation class i have override the drawRect method. DrawingCanvas class (extended from UIView and is a subview of my viewController's parent view) handles the pan gesture. Here is a piece of code
-(void) panGestureRecognizer: (UIPanGestureRecognizer *) panGesture {
static CGPoint initialPoint;
CGPoint translation = [panGesture translationInView:panGesture.view];
static Shape *shape;
if(panGesture.state == UIGestureRecognizerStateBegan) {
initialPoint = [panGesture locationInView:panGesture.view];
if(selectedShape == nil) {
if([selectedOption isEqualToString:@"line"]) {
shape = [[Line alloc] initWithFrame:CGRectMake(initialPoint.x, initialPoint.y, 10, 10) isArrowLine:NO];
((Line *)shape).pointStart = [panGesture.view convertPoint:initialPoint toView:shape];
}
[panGesture.view addSubview:shape];
}
[shape setNeedsDisplay];
}
else if(panGesture.state == UIGestureRecognizerStateChanged) {
if([shape isKindOfClass:[Line class]]) {
CGRect newRect = shape.frame;
if (translation.x < 0) {
newRect.origin.x = initialPoint.x + translation.x - LINE_RECT_OFFSET;
newRect.size.width = fabsf(translation.x) + LINE_RECT_OFFSET * 2;
}
else {
newRect.size.width = translation.x + LINE_RECT_OFFSET * 2;
}
if (translation.y < 0) {
newRect.origin.y = initialPoint.y + translation.y - LINE_RECT_OFFSET;
newRect.size.height = fabsf(translation.y) + LINE_RECT_OFFSET * 2;
}
else {
newRect.size.height = translation.y + LINE_RECT_OFFSET * 2;
}
shape.frame = newRect;
CGPoint endPoint = CGPointMake(initialPoint.x + translation.x, initialPoint.y + translation.y);
((Line *)shape).pointStart = [panGesture.view convertPoint:initialPoint toView:shape];
((Line *)shape).pointEnd = [panGesture.view convertPoint:endPoint toView:shape];
[shape setNeedsDisplay];
}
}
}
行的drawRect包含
Line drawRect contains
-(void)drawRect:(CGRect)rect {
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextClearRect(context, rect);
CGContextSetStrokeColorWithColor(context, self.color.CGColor);
CGContextSetFillColorWithColor(context, self.color.CGColor);
CGContextMoveToPoint(context, pointStart.x, pointStart.y);
CGContextAddLineToPoint(context, pointEnd.x, pointEnd.y);
CGContextSetLineWidth(context, 2.f);
CGContextStrokePath(context);
}
有关移动和调整大小我是处理touchEvents
对于移动注释我在touchesMoved这样
For moving and resizing i am handling touchEvents For moving the annotation i am doing this in touchesMoved
UITouch *touch = [[event allTouches] anyObject];
CGPoint newPoint = [touch locationInView:self];
CGPoint previousPoint = [touch previousLocationInView:self];
CGRect rect = self.frame;
rect.origin.x += newPoint.x - previousPoint.x;
rect.origin.y += newPoint.y - previousPoint.y;
self.frame = rect;
[self setNeedsDisplay];
这一切都很好，直到这里，但现在通过拖动它的端点调整的行创建的混乱给我。我已经放置imageViews在终点处。在接触开始我正在检测终点这样
It's all good till here, but now for resizing the line by dragging the endpoints of it creates the confusion to me. I have placed to imageViews at the end point. On touches began i am detecting the end point like this
UITouch *touch = [[event allTouches] anyObject];
CGPoint touchPoint = [touch locationInView:self];
if(CGRectContainsPoint(imageView1.frame, touchPoint) || CGRectContainsPoint(imageView2.frame, touchPoint)) {
isEndPoint = YES;
}
如果isEndPoint是YES，那么我不得不调整线路。我需要知道哪个方向我是拖着。如何更新点（我已经采取措施来CGPoint的类变量; pointStart，pointEnd）和帧
if isEndPoint is YES then i have to resize the line. I need to know on which direction am i dragging. how to update the points (i have taken to class variables of CGPoint; pointStart, pointEnd) and the frame.
请建议调整大小伎俩更新点和框架。
Kindly suggest the resizing trick to update the points and the frame.
推荐答案
有关确定线路的方向：
你可以做到以下几点：
For determining the line's direction:
You can do the following:
行从起点出发：
A）大于起点的X 行正朝着右侧
接近'X'
B）少'X'比开始点的X 线接近左侧。
C）大Y''比起点的'Y'行会向下。
D）比起点的'Y'线路是走上坡路。
Line starting from Start Point:
a) Greater 'X' than the Start Point's X Line is approaching towards right side
b) Less 'X' than the Start Point's X line is approaching to the left side.
c) Greater Y'' than the Start point's 'Y' Line is going downwards.
d) Less 'Y' than the Start point's 'Y' Line is going Upwards.
行从终点出发：的
A）大于结束点的X 行正朝着右侧
接近'X'
B）少'X'不是终点的X 线接近左侧。
C）大Y''不是终点的'Y'行会向下。
D）少'Y'不是终点的'Y'线路是走上坡路。
Line starting from End Point:
a) Greater 'X' than the End Point's X Line is approaching towards right side
b) Less 'X' than the End Point's X line is approaching to the left side.
c) Greater Y'' than the End point's 'Y' Line is going downwards.
d) Less 'Y' than the End point's 'Y' Line is going Upwards.
如果该行正在从终点绘制然后继续开始点不变，否则，如果该线从起点出发，保持开始点不变。
If the line is being drawn from the End point then keep the Start Point unchanged, else if the line is starting from Start Point, keep the Start Point unchanged.
画线后，你只需要更新该行的矩形。
对于需要2个 CGPoint 属性添加到线的类。
1.初始点，2。最后一点。
初步确定了相当于初始点到起点，最初设定的最后等价点到终点。
随后在每一块行添加到当前行，只更新这些2处比较合适的起点和终点。我给你正确的比较一个提示：
例如：
比较所有4个点也就是初始点，最后点，起点和终点。
更新初始点和最后一个点：的
将初始点的'X'和'Y'相当于最低所有这4个点中'X'和最小'Y'。
设置上一个点的'X'和'Y'相当于最大这4个点中的X和最大的'Y'。
根据这2点线的矩形使初始点和最后点。
我希望这能解决你的问题。
After drawing the line, you just need to update the Rect of the Line.
For that you need to add 2 more CGPoint properties to the Line's Class.
1. Initial point, 2. Last Point.
Initially set the initial point equivalent to the Start Point and initially set the Last Point equivalent to the End Point.
Afterwards on every piece of line added to the Current Line, just update these 2 properties with proper comparison to the Start and End Points. I am giving you a hint of proper comparisons:
For example:
Compare all the 4 points that is Initial Point, Last Point , Start Point and End Point.
Updating Initial Point and Last Point:
Set the Initial Point's 'X' and 'Y' equivalent to the Minimum 'X' and Minimum 'Y' among all these 4 points.
Set the Last Point's 'X' and 'Y' equivalent to the Maximum 'X' and Maximum 'Y' among these 4 points.
Make the Line's Rect according to these 2 points Initial Point and Last Point.
I hope this solves your problem.
这篇关于从调整线路端点的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
