Question

I’ve been working at this for two days and have not had much luck. I have a little, tile image that I’m able to drag and drop anywhere on the screen with a touche’s coordinates. My first question is: how can I set the tile images coordinates so that it starts off inside of the green CGRect instead of the top corner screen? In other words, I want to make the green CGRect the image’s default location with affecting the users toch coordinates. My next question is how can I code it to where the only other location on the screen that I can drag and drop the image to, is inside the red CGRect? And if more then half of the image is inside the red CGRect, how can I make it snap to the inside of the Red CGRect if someone lets go of it. If more then half of the image is OUTSIDE of the CGRect, I want to animate it back to it’s default location. If your going to answer please explain your answer in detail because I’m new to objective-c. Here’s a screen shoot of my GUI.

Here is my code so far:

DADViewController.h

#import <UIKit/UIKit.h>
#import "DADView.h"
@interface DADViewController : UIViewController
@property(nonatomic, weak)IBOutlet DADView *dadView;
@end

DADViewController.m

#import "DADViewController.h"
@implementation DADViewController
@synthesize dadView = _dadView;
-(void)setDadView:(DADView *)dadView
{
    _dadView = dadView;
    [self.dadView setNeedsDisplay];
}
-(void) touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
    UITouch *touch = [[event allTouches] anyObject];
    CGPoint location = [touch locationInView:touch.view];
    location.x -= 40;
    location.y -= 40;
    self.dadView.thePoint = location;
    [self.dadView setNeedsDisplay];

}
-(void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
    [self touchesBegan:touches withEvent:event];
}

DADView.h

@interface DADView : UIView
@property(nonatomic) CGPoint thePoint;
@end

DADView.m

#import "DADView.h"
@implementation DADView
@synthesize thePoint = _thePoint;

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        // Initialization code
    }
    return self;
}
- (void)drawRect:(CGRect)rect
{
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    CGContextSetLineWidth(ctx, 2.0);
    CGContextSetStrokeColorWithColor(ctx, [UIColor redColor].CGColor);
    CGRect rectangle = CGRectMake(120, 70, 70, 70);
    CGContextAddRect(ctx, rectangle);
    CGContextStrokePath(ctx);

    CGContextSetLineWidth(ctx, 2.0);
    CGContextSetStrokeColorWithColor(ctx, [UIColor greenColor].CGColor);
    CGRect rectangle2 = CGRectMake(120, 290, 70, 70);
    CGContextAddRect(ctx, rectangle2);
    CGContextStrokePath(ctx);

    UIImage* pngWord = [UIImage imageNamed:@"wordbutton_01.png"];
    [pngWord drawAtPoint:self.thePoint];
}
@end

Answer 1

To set the view at the beginning:

CGRect viewFrame = view.frame;
viewFrame.origin = startingRect.origin;
view.frame = viewFrame;

view is your image, and startingRect is the rect where you want your image to start, and this code in the awakFromNib or in or when you set the image

To check if the image is inside of a frame when being dragged:

-(void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {
    CGFloat middleX = CGRectGetMidX(imageView.frame);
    CGFloat middleY = CGRectGetMidY(imageView.frame);
    if(middleX > rectangle2.origin.x && middleX < CGRectGetMaxX(rectangle2) && middleY > rectangle.origin.y && middleY < CGRectGetMaxY(ractangle2)) {
   // if the imageView is inside of the box
   }
else imageView.frame = defaultFrame;

imageView is the image that is being moved and rectangle 2 is the frame that you want the imageView in, while default frame is where the image’s frame should be set to if it doesn’t end in the box