Drag and Drop uimageview restrict drop area

Question

I want to implement the drag and drop functionality in my application.This is my requirement, I have 5 small images and one big image in my view controller.I need to place the small images on the big image.The big image is in particular size.

When the small image dragged and it does not place over on the big image it backs to its original place.

When small image placed over the big image it cannot be back to its original place but it can be draggable into big image space.

Can anyone help me?I can found lot of tutorials but none is satisfied.

I want the image to be dropped only in the big image space.But not outside of that the imageview.

Please anyone help me!

Thank you!

You need to be more specific. What do you have and what particular bits don't work? — Wain, Mar 10 '14 at 14:37
Yes, but that requirement is too broad for a question on SO, hence you need to be more specific... — Wain, Mar 10 '14 at 14:43

score 1 · Answer 1 · answered Mar 10 '14 at 17:32

As others have said, you're question is too broad.

I would however suggest subclassing UIView and using a UIPanGestureRecognizer to detect a grab, then move the views.

When the view is released call a function to check that objects location with respect to the other views and swap views accordingly with animations. If the view is within a certain range of it's origin it simply snaps back with an animation.

Your UIView subclass could look something like this:

@interface DraggableView () <UIGestureRecognizerDelegate>

@property (nonatomic) float originX;

@end

@implementation DraggableView

-(id)initWithFrame:(CGRect)frame {
    self = [self initWithFrame:frame];

    UIPanGestureRecognizer *pan = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(Touched:)];
    [pan setMinimumNumberOfTouches:1];[pan setMaximumNumberOfTouches:1];
    [pan setDelegate:self];
    [self addGestureRecognizer:pan];


    return self;
}

- (void) Touched:(id)sender {

    CGPoint translatedPoint = [(UIPanGestureRecognizer*)sender translationInView:self.superview];

    if([(UIPanGestureRecognizer*)sender state] == UIGestureRecognizerStateBegan) {

        self.originX = [[sender view] center].x;

    }
    else {

        translatedPoint = CGPointMake(self.originX+translatedPoint.x, self.center.y);        
        [[sender view] setCenter:translatedPoint];

    }

    if([(UIPanGestureRecognizer*)sender state] == UIGestureRecognizerStateEnded)
    {

        // Check if view should swap or bounce back

    }

}

Drag and Drop uimageview restrict drop area

1 Answers1