Geek Answers Handbook

IPhone: How to drag or move UIImage / UIButton as shown below?

I do not know How to get the following type of functionality in my application.

enter image description here

As shown in the figure above, the user can move (drag and drop) different parts of the image, and the user can collect the image.

Can someone tell me what kind of control this is? Or any tutorial for this?

+5
source share
7 answers

Check out the MoveMe sample application. It will show you how to allow the movement of subzones by touching and dragging.

You can then create imageViews for each of your puzzle pieces that can be moved.

, , , , , , , .

http://developer.apple.com/library/ios/#samplecode/MoveMe/Introduction/Intro.html

+7

, . UIImageView, UIbutton .. UIIMageView , UIGestureRecognizer .

+1

, , :

- (void) touchesBegan:(NSSet*)touches withEvent:(UIEvent*)event 
- (void) touchesMoved:(NSSet*)touches withEvent:(UIEvent*)event
- (void) touchesEnded:(NSSet*)touches withEvent:(UIEvent*)event

UIImageViews . CGRectContainsRect CGRectContainsPoint, , .

+1

UIKit, UIImageView .

0

. . Apple . , .

0

:

(1) UIImageView .

(2) UIImageView, UIPanGestureRecognizer. - :

self.panRecognizer = 
  [[UIPanGestureRecognizer alloc] 
    initWithTarget: self 
    action: @selector(handlePan:)];
[self addGestureRecognizer: 
  self.panRecognizer];

(3) In the action method associated with the pan gesture recognizer, update the location of the object based on the messages from the tin plate recognizer. Something like the following should work:

-(void) handlePan: 
  (UIGestureRecognizer *)sender
{
  UIPanGestureRecognizer *panRecognizer = 
    (UIPanGestureRecognizer *)sender;
  if (panRecognizer.state == 
        UIGestureRecognizerStateBegan ||
      panRecognizer.state == 
        UIGestureRecognizerStateChanged)
  {
    CGPoint currentPoint = 
      self.center;
    CGPoint translation = 
      [panRecognizer translationInView: 
        self.superView];
    self.center = CGPointMake
      (currentPoint.x + translation.x, 
        currentPoint.y + translation.y);
    [panRecognizer setTranslation: CGPointZero 
      inView: self.superView];
  }
}
0
source

Here is the code how to move imgTest, which is a UIImageView. Tested, work like a charm.

[[self imgTest]setUserInteractionEnabled:YES];

//Save the first touch point
CGPoint firstTouchPoint;

//xd,yd destance between imge center and my touch center
float xd;
float yd;

-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
    UITouch* bTouch = [touches anyObject];
    if ([bTouch.view isEqual:[self imgTest]]) {
        firstTouchPoint = [bTouch locationInView:[self view]];
        xd = firstTouchPoint.x - [[bTouch view]center].x;
        yd = firstTouchPoint.y - [[bTouch view]center].y;
    }
}

{
    UITouch* mTouch = [touches anyObject];
    if (mTouch.view == [self imgTest]) {
        CGPoint cp = [mTouch locationInView:[self view]];
        [[mTouch view]setCenter:CGPointMake(cp.x-xd, cp.y-yd)];
    }
}

source

0
source

More articles:


All Articles