如何绘制 UIBezierPath 并与之交互 [英] How to draw and interact with UIBezierPath

问题描述

我想在我的应用程序中实现和设计建筑楼层的地图.在开始之前，我想提一些建议.

I would like to implement and design a map for a building floor in my application. Before starting, I would like to have some advices.

我打算使用 UIBezierPath 来绘制形状.每个 UIBezierPath 将代表我地图上的一家商店.这是一个插图(map_with_UIBezierPath)

I'm planning to use UIBezierPath to draw the shapes. Each UIBezierPath will represent a shop on my map. Here is an illustration (map_with_UIBezierPath)

我的代码结构如下:我有一个 UIViewController 和一个 UiView.在 UIViewController "viewDidLoad" 方法中，我实例化了 UIView，在 UIView "drawRect" 方法中，我绘制了如下形状(UIBezierPathExtension 从 UIBezierPath 继承):

My code structure is the following: I have a UIViewController And a UiView. In the UIViewController "viewDidLoad" method, I instantiate the UIView and in the UIView "drawRect" method, I draw the shapes like following (UIBezierPathExtension inherit from UIBezierPath):

- (void)drawRect:(CGRect)rect {

context = UIGraphicsGetCurrentContext();

[[UIColor grayColor] setFill]; 
    [[UIColor greenColor] setStroke];

UIBezierPathExtension *aPath = [[UIBezierPathExtension alloc] init]; 
aPath.pathId = 1;
    [aPath moveToPoint:CGPointMake(227,34.25)];
[aPath addLineToPoint:CGPointMake(298.25,34.75)];
[aPath addLineToPoint:CGPointMake(298.5,82.5)];
[aPath addLineToPoint:CGPointMake(251,83)];
[aPath addLineToPoint:CGPointMake(251,67.5)];
[aPath addLineToPoint:CGPointMake(227.25,66.75)];   
    [aPath closePath]; 
aPath.lineWidth = 2;
[aPath fill]; 
[aPath stroke];
[paths addObject:aPath];

UIBezierPathExtension* aPath2 = [[UIBezierPathExtension alloc] init];
aPath2.pathId = 2;
[aPath2 moveToPoint:CGPointMake(251.25,90.5)];
[aPath2 addLineToPoint:CGPointMake(250.75,83.25)];
[aPath2 addLineToPoint:CGPointMake(298.5,83)];
[aPath2 addLineToPoint:CGPointMake(298.5,90.25)];
[aPath2 closePath];
aPath2.lineWidth = 2;
[aPath2 fill]; 
[aPath2 stroke];
[paths addObject:aPath2];   

    ...
}

我还在 UIViewController 中实现了平移和捏合手势.

I have also implemented the pan and pinch gesture in the UIViewController.

现在，我问我如何与每个形状进行交互.我想检测一次点击，改变他的颜色并显示一个菜单，比如 那个 在选定的形状上.

Now, I'm asking me how I can interact with every single shapes. I would like to detect a single tap on it, change his color and display a menu like that on the selected shape.

有人能告诉我正确的方向吗?

Can someone tell me the right direction to take?

提前谢谢

推荐答案

您需要在视图中查找触摸事件(TouchesBegan、TouchesMoved、TouchesEnded、TouchesCancelled).当您触摸时，您可以询问它在您的视图中的位置.您可以使用此位置来测试该点是否在您的任何路径内，如果是，请执行您的酷操作.

You need to look for touch events (TouchesBegan, TouchesMoved, TouchesEnded, TouchesCancelled) in your view. When you get a touch, you can ask it for its location in your view. You can use this location to test whether that point is inside any of your paths, if it is, do your cool stuff.

使用您的示例代码，这里可能是一个粗略的 TouchesBegan...

Using your example code, here might be a rough TouchesBegan...

- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
    for (UITouch *touch in touches) {
        CGPoint pointTouched = [touch locationInView:self];
        for (UIBezierPath *path in paths) {
            if ([path containsPoint:point]) {
                // do something cool with your path
                // or more likely, set a flag to do the cool thing when drawing
            }
        }
    }
}

不要忘记你应该处理所有的触摸事件，并对每个事件做一些合理的处理.此外，上面的代码支持多点触控，但您可能只想允许单点触控，在这种情况下，有一些方法可以消除触摸"循环.

Don't forget that you should handle all the touch events and do something sensible with each. Also, the above code is multitouch capable, but you may want to only allow a single touch, in which case there are ways to eliminiate the "touches" loop.

这篇关于如何绘制 UIBezierPath 并与之交互的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！