Question

我目前有两个UIImageViews，可以拖动它们在屏幕上移动它们：

- (void)panWasRecognized:(UIPanGestureRecognizer *)panner {
    UIView *draggedView = panner.view;
    CGPoint offset = [panner translationInView:draggedView.superview];
    CGPoint center = draggedView.center;
    draggedView.center = CGPointMake(center.x + offset.x, center.y + offset.y);
    [panner setTranslation:CGPointZero inView:draggedView.superview];
}

- (void)panWasRecognized2:(UIPanGestureRecognizer *)panner2 {
    UIView *draggedView = panner2.view;
    CGPoint offset = [panner2 translationInView:draggedView.superview];
    CGPoint center = draggedView.center;
    draggedView.center = CGPointMake(center.x + offset.x, center.y + offset.y);
    [panner2 setTranslation:CGPointZero inView:draggedView.superview];
}

然而，我不确定如何进行下一步，即在用户移动图像时不断更新UIImageViews的两个中心之间的界线。我大致知道如何从一个点到另一个点绘制一条简单的线，但是有人能够建议如何继续更新该线与两个图像的移动同步吗？在此先感谢：）

Answer 1

您可以通过继承父UIView来轻松完成此操作。只需创建一个类并复制粘贴

的代码即可

<强> DrawView.h

#import <UIKit/UIKit.h>

@interface DrawView : UIView
-(void)refreshWithPointA:(CGPoint)pointA andPointB:(CGPoint)pointB;
@end

<强> DrawView.m

#import "DrawView.h"

@interface DrawView()
@property(nonatomic, strong) UIBezierPath *linePath;
@end

@implementation DrawView

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        // Initialization code
    }
    return self;
}



-(void)refreshWithPointA:(CGPoint)pointA andPointB:(CGPoint)pointB{
    _linePath = [UIBezierPath bezierPath];
    [_linePath setLineWidth:2.0];
    [_linePath moveToPoint:pointA];
    [_linePath addLineToPoint:pointB];
    [self setNeedsDisplay];
}


// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect
{

    // Drawing code
    [[UIColor blackColor] setStroke];
    [_linePath stroke];
}


@end

现在只需更改已添加UIImageView的父UIView类。并将标记1和2分配给两个图像视图。并在pangesture selectors

中使用以下方法

-(void)refreshLine{
    CGPoint centreA=[self.view viewWithTag:1].center;
    CGPoint centreB=[self.view viewWithTag:2].center;
    [self.drawView refreshWithPointA:centreA andPointB:centreB];
}

将方法放在手势识别器的最后一行，如下所示

- (void)panWasRecognized:(UIPanGestureRecognizer *)panner {
     //YOUR OLD CODE

     [self refreshLine];
}

- (void)panWasRecognized2:(UIPanGestureRecognizer *)panner {

     //YOUR OLD CODE

     [self refreshLine];
}

以及你添加UIImageViews的地方，它会立即绘制线条。在分配了新课程的情况下，也可以IBOutlet创建UIView。

多数民众赞成。

干杯。

Answer 2

例如，您可以通过继承UIView并覆盖drawRect方法来完成此操作示例代码，在子类UIView中你可以做类似下面的事情

#import "MyView.h"

@implementation MyView

- (id)initWithFrame:(CGRect)frame
 {
    self = [super initWithFrame:frame];
    if (self) {
     // Initialization code
     UIImageView *imgViewOne = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 100, 100)];
     imgViewOne.backgroundColor = [UIColor greenColor]; //imageview 1

     UIImageView *imgViewTwo = [[UIImageView alloc]initWithFrame:CGRectMake(200, 0, 100, 100)];
     imgViewTwo.backgroundColor = [UIColor redColor]; //imageview 2

     UIPanGestureRecognizer *panGesture = [[UIPanGestureRecognizer alloc]initWithTarget:self action:@selector(panWasRecognized:)];
     [imgViewOne addGestureRecognizer:panGesture];

     UIPanGestureRecognizer *panGesture2 = [[UIPanGestureRecognizer alloc]initWithTarget:self action:@selector(panWasRecognized2:)];
     [imgViewTwo addGestureRecognizer:panGesture2];

     imgViewOne.tag = 100;
     imgViewTwo.tag = 200;

     imgViewTwo.userInteractionEnabled = YES;
     imgViewOne.userInteractionEnabled = YES;

     [self addSubview:imgViewOne];
     [self addSubview:imgViewTwo];

  }
  return self;
}


- (void)panWasRecognized:(UIPanGestureRecognizer *)panner
{
   UIView *draggedView = panner.view;
   CGPoint offset = [panner translationInView:draggedView.superview];
   CGPoint center = draggedView.center;
   draggedView.center = CGPointMake(center.x + offset.x, center.y + offset.y);
   [panner setTranslation:CGPointZero inView:draggedView.superview];
   [self setNeedsDisplay];//update the drawing
}

- (void)panWasRecognized2:(UIPanGestureRecognizer *)panner2
{
   UIView *draggedView = panner2.view;
   CGPoint offset = [panner2 translationInView:draggedView.superview];
   CGPoint center = draggedView.center;
   draggedView.center = CGPointMake(center.x + offset.x, center.y + offset.y);
   [panner2 setTranslation:CGPointZero inView:draggedView.superview];
   [self setNeedsDisplay]; //update the drawing

}

// Only override drawRect: if you perform custom drawing.  
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect
 {
   CGContextRef context = UIGraphicsGetCurrentContext();
   CGContextClearRect(context, self.bounds);//clear drawing

   UIImageView *imgView1 = (UIImageView *)[self viewWithTag:100];
   UIImageView *imgView2 = (UIImageView *)[self viewWithTag:200];

   CGPoint center1 = imgView1.center;
   CGPoint center2 = imgView2.center;

   CGContextSetFillColorWithColor(context,[UIColor whiteColor].CGColor);//set background white color
   CGContextFillRect(context, self.bounds);


   CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor); //set the color of the line
   CGContextSetLineWidth(context, 0.5); //set width of line

   CGContextMoveToPoint(context, center1.x,center1.y); //start at this point
   CGContextAddLineToPoint(context, center2.x,center2.y); //draw to this point

   CGContextClosePath(context);
   CGContextStrokePath(context);
 }


 @end

在视图控制器中添加此视图

 #import "MyView.h" //import this custom view


 - (void)viewDidLoad
   {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    MyView *view = [[MyView alloc]initWithFrame:self.view.bounds];
    [self.view addSubview:view]; //add it to view controller's view
   }

绘制和更新两个图像之间的线

2 个答案: