如何在iOS中用一条线连接两个按钮（点）？

Question

我想做一个项目，在该项目中我需要点击一个点并将其与另一个点连接，然后再连接到另一个点。当我连接一个点和另一个点时，它们之间会出现一条线。

实际上，当我点击/触摸一个点时，线条将显示；当我触摸第二个点时，两个点之间的线条将创建。

我还不能做到这一点，我正在尝试并在网上搜索，但仍未找到解决方案。

我需要像这样的东西：https://play.google.com/store/apps/details?id=zok.android.dots&hl=en 我认为这是通过UIGesture Recogniser完成的？还是其他什么东西？我该如何实现这个功能？

欢迎来自专家的任何想法或建议。

- Nisha Singh

---

尝试这个：https://dev59.com/c13Va4cB1Zd3GeqPAnSU - Deepesh Gairola

Answer 1

根据您的需求修改此代码。

CGContextRef context = UIGraphicsGetCurrentContext();
UIColor *currentColor = [UIColor blackColor];
CGContextSetStrokeColorWithColor(context, currentColor.CGColor);
CGContextSetLineWidth(context, 2.0);
CGContextBeginPath(context);
CGContextMoveToPoint(context, touchStart.x, touchStart.y);
CGContextAddLineToPoint(context, touchEnd.x, touchEnd.y);
CGContextStrokePath(context);

@Nisha:

将 CGPoint 的全局实例 touchStart 和 touchEnd 创建并按照以下方式获取：

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{
touchEnd = CGPointZero;
touchStart = CGPointZero;
UITouch *touch = [touches anyObject];
CGPoint point = [touch locationInView:self];
NSLog(@"start point >> %@",NSStringFromCGPoint(point));
    touchStart = point;
}

}

- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
    UITouch *touch = [touches anyObject];
    CGPoint point = [touch locationInView:self];
    touchEnd = point; 
    [self setNeedsDisplay];

}

- Divyu

---

touchStart是什么，touchEnd是int类型吗？ - Nisha Singh

@Nisha Singh...我已经编辑了我的答案，请检查一下。 - Divyu

Answer 2

请尝试以下步骤。

创建一个UIView的子类。在其中添加UIButtons。

实现Touches代理，例如touchesBegan、moved、end。

在touchesBegan中检查是否触摸到了myButton1，如果是，则将标志设置为true。

编辑：

UITouch *touch = [[UITouch alloc] init];
touch = [touches anyObject];
CGPoint point = [touch locationInView:self];

if(CGRectContainsPoint(myButton1.frame, point))
    NSLog(@"Inside myButton1");

另一种测试子视图是否被触摸的方法是

CGPoint pt = [[touches anyObject] locationInView:self.view];
UIView *touchedView = [self.view hitTest:pt withEvent:event];

在内部触摸移动时检查标志是否为true，然后调用drawline()函数...并继续检查触摸是否在insideview:myButton2中。调用setNeedsDisplay函数。

现在您将获得多种方法和示例代码以在UIView中绘制线条。只需应用上述逻辑即可。

- BhushanVU

---

先生，我现在能够画线了，但是我无法做到您说的那样。我在UIView上添加了按钮，但无法完成您的第3、4步骤。 - Nisha Singh

我将我的按钮放在viewDidLoad中，添加到self.view上，然后执行第三步。当我触摸屏幕时，线会显示出来，但是当我触摸按钮时，线与按钮相交而不是触摸按钮。如果(CGRectContainsPoint(btn1.frame, point))，则无法调用此行。 - Nisha Singh

@NishaSingh：这可能非常有帮助，正是你想要的。我以前用过它……下载这个源代码并检查他们如何识别触摸按钮和绘制线条……这是易于使用的示例代码。https://www.cocoacontrols.com/controls/android-pattern-lock-on-iphone - BhushanVU

看看他们的代码。你可以使用通用的线条绘制代码，只需参考该示例以检测触摸并了解如何处理UIButtons上的交集即可。此外，直到您清除上下文或从绘制线条的superview中删除视图之前，该线条都不会被移除... - BhushanVU

他们在touchesMoved代理中使用CGPoint pt = [[touches anyObject] locationInView:self.view]; UIView *touched = [self.view hitTest:pt withEvent:event];来检查哪个视图被点击...你可以在我的回答中看到它... - BhushanVU

Answer 3

如果可能的话，请使用UI触摸方法获取两个按钮的坐标。你可以通过touchedEnded方法在两个不同的CGPoint中找到触摸位置。要查找触摸位置的文档在这里。

在视图上获取UIButtons位置后，你可以使用以下方法之一绘制它们之间的直线-

- (void)drawRect:(CGRect)rect
{
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSaveGState(context);
    CGContextSetStrokeColorWithColor(context, [[UIColor blackColor]CGColor]);
    CGContextSetLineWidth(context, 1.0);
    CGContextMoveToPoint(context, startPoint.x, startPoint.y);
    CGContextAddLineToPoint(context, endPoint.x, endPoint.y);
    CGContextStrokePath(context);
    CGContextRestoreGState(context); 
}

希望这可以帮到您。

- iEinstein

---

touchStart是什么，touchEnd是int类型吗？ - Nisha Singh

那些是按钮的坐标，它们是由两个值x和y组成的结构体，它们是浮点数值。希望现在清楚了。 - iEinstein

先生，不是很清楚，我是 iPhone 新手。先生，请问这里如何使用 UIButton？ - Nisha Singh

在哪里？我无法理解。你想要在它们之间绘制线的按钮在屏幕上总是有一些坐标。使用这些坐标来在它们之间绘制线。 - iEinstein

你解决了你的问题吗？ - iEinstein

Answer 4

你可以使用touchedEnded方法将触摸的位置存储在两个不同的CGPoint中。

然后，当你有了两个点，你可以添加一个新的UIView作为子视图，它知道这两个CGPoint并在其drawRect方法中绘制一条线。或者在当前视图中执行此操作，通过调用[view setNeedsDisplay]来触发其自身的drawRect方法。

请查看此链接。

- pankaj asudani