How to move array of UIImageViews smoothly? - ios

Am working on kind of seating arrangement application. Where the app allows the admin to arrange the seatings by click and move the each seat and then save the seating arrangement with frame sizes of each seat. I tried by loading 5 UIImageView on custom view and move the imageview but, only one imageview is getting moved. Rest of the imageviews not getting moved. Can you please help me on this?
- (void) addSeatsToTheView {
for (int i=0; i<5; i++) {
self.hotelImage = [[UIImageView alloc] initWithFrame:CGRectMake(5, 5, 50, 50)];
self.hotelImage.image = [UIImage imageNamed:#"DiningIcon"];
self.hotelImage.userInteractionEnabled = YES;
[self.hotelImage setUserInteractionEnabled:YES];
self.hotelImage.tag = i;
[self.hotelView addSubview:self.hotelImage];
}
}
- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
UITouch *touch = [touches anyObject];
if (touch.view == self.hotelImage) {
CGPoint location = [touch locationInView:self.hotelView];
NSLog(#"Begen Touch Location: %#", NSStringFromCGPoint(location));
self.hotelImage.frame=CGRectMake(location.x, location.y, 50, 50);
}
}
- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
UITouch *touch = [touches anyObject];
if (touch.view == self.hotelImage) {
CGPoint location = [touch locationInView:self.hotelView];
NSLog(#"Begen Touch Location: %#", NSStringFromCGPoint(location));
self.hotelImage.frame=CGRectMake(location.x, location.y, 50, 50);
}
}
- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {
UITouch *touch = [touches anyObject];
if (touch.view == self.hotelImage) {
CGPoint location = [touch locationInView:self.hotelView];
NSLog(#"Begen Touch Location: %#", NSStringFromCGPoint(location));
self.hotelImage.frame=CGRectMake(location.x, location.y, 50, 50);
}
}
Once the admin arranged the seatings we have to save all the visible uiimageview framesizes. Thanks.
Edited:
I tried the using UIPanGestureRecognizer but, only one imageview getting moved. Don't know where am doing wrong? Can you please help me? Thanks.
- (void) addSeatsToTheView {
for (int i=0; i<5; i++) {
self.hotelImage = [[UIImageView alloc] initWithFrame:CGRectMake(5, 5, 50, 50)];
self.hotelImage.image = [UIImage imageNamed:#"DiningIcon"];
self.hotelImage.userInteractionEnabled = YES;
[self.hotelImage setUserInteractionEnabled:YES];
self.hotelImage.tag = i;
UIPanGestureRecognizer *panGestureRecognizer = [[UIPanGestureRecognizer alloc] initWithTarget:self action:#selector(gestureRecognizerMethod:)];
[self.hotelImage addGestureRecognizer:panGestureRecognizer];
[self.hotelView addSubview:self.hotelImage];
}
}
- (void)gestureRecognizerMethod:(UIPanGestureRecognizer *)recogniser
{
if (recogniser.state == UIGestureRecognizerStateBegan || recogniser.state == UIGestureRecognizerStateChanged)
{
CGPoint touchLocation = [recogniser locationInView:self.hotelView];
self.hotelImage.frame = CGRectMake(touchLocation.x, touchLocation.y, 50, 50);
}
}

Don't use touches methods for this; you'll go insane. Make each image view user-interactive and give it a UIPanGestureRecognizer. There is standard code for the pan gesture recognizer's action handler for following a finger, i.e. making the view draggable.
Once you've done that, everything stems from your misuse of self.hotelImage. Get rid of it entirely. In your for loop, just use a local variable, UIImageView* hotelImage = .... In the gesture recognizer method, use [recogniser view] to refer to the image view to which this gesture recognizer is attached. Everything will sort itself out after that!

Related

iOS - How To Draw Point On A Line In Which The User Touches When Dragging

I have a rectangular view which contains vertical thin lines in which I drew programatically.
This is the code I used to draw the lines:
- (void)drawLines
{
CGFloat spacing = _bgView.frame.size.width / 11.0f;
for(int i = 1; i < 11; i++)
{
UIView *line = [[UIView alloc] initWithFrame:CGRectMake((CGFloat)(i * spacing), 0, 1, _bgView.frame.size.height)];
line.backgroundColor = [UIColor whiteColor];
line.tag = i;
[_bgView addSubview:line];
}
}
The lines are separated by equally distributed spaces calculated from the width of the rectangular view(_bgView).
Here's an overview of what it looks like:
When the user performs a drag in the rectangular view, and when his/her finger passes through or touches a line, a dot will be drawn on that specific point.
Here's the code that detects the point of touch of the user on the line, and draws a dot on that point.
- (IBAction)drawDots:(id)sender
{
UIPanGestureRecognizer *pan = (UIPanGestureRecognizer *)sender;
CGPoint pannedPoint = [pan locationInView:_bgView];
for (UIView *subview in _bgView.subviews)
{
if (CGRectContainsPoint(subview.frame, pannedPoint) && subview.tag > 0)
{
NSLog(#"Point x:%.2f y:%.2f TAG:%i", pannedPoint.x, pannedPoint.y, subview.tag);
UIView *point = [[UIView alloc] initWithFrame:CGRectMake(pannedPoint.x - 2.5, pannedPoint.y - 2.5, 5, 5)];
point.backgroundColor = [UIColor redColor];
[_bgView addSubview:point];
}
}
}
Now, if the user pans really fast, this will be the result:
As can be seen, only some points are drawn, that's why there are a lot of missing dots on the other lines.
This should be expected result:
But, this happens only when the user pans super slow.
How can I draw the points in the lines intercepted by the touch of the user even if his finger moved really fast?
Thanks!
Instead of pan gestures you should use UIResponder methods to detect user touches:
- touchesBegan:withEvent:
- touchesMoved:withEvent:
- touchesEnded:withEvent:
- touchesCancelled:withEvent:
The second method - touchesMoved:withEvent: calls when user keeps moving its finger through the screen, so you can get its finger location:
UITouch *touch = [[event allTouches] anyObject];
CGPoint touchLocation = [touch locationInView:touch.view];
Then just add your detection logic.
Check the docs for more details:
https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIResponder_Class/
please refer this code
for your requirement
- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
// NSLog(#"DEBUG: Touches moved" );
[super touchesMoved:touches withEvent:event];
if ([[event allTouches] count] > 1) {
} else {
UITouch *touch = [[event allTouches] anyObject];
UIView *view = touch.view;
NSLog(#"DEBUG: Touches Moved");
CGPoint location = [touch locationInView:self.bgView];
for (UIView *subview in _bgView.subviews)
{
if (CGRectContainsPoint(subview.frame, location) && subview.tag > 0) {
NSLog(#"Point x:%.2f y:%.2f TAG:%i", location.x, location.y, subview.tag);
UIView *point = [[UIView alloc] initWithFrame:CGRectMake(location.x - 2.5, location.y - 2.5, 5, 5)];
point.backgroundColor = [UIColor redColor];
[_bgView addSubview:point];
}
}
}
}
Will help you

Trying to move UIImageView, moving whole Screen View

I want my UIViewImages to be movable with touch. I'm trying to use code implemented in my ViewController:
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
}
-(void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
if ([touches count]==1) {
UITouch *touch = [touches anyObject];
CGPoint p0 = [touch previousLocationInView:self.view];
CGPoint p1 = [touch locationInView:self.view];
CGPoint center = self.view.center;
center.x += p1.x - p0.x;
center.y += p1.y - p0.y;
self.view.center = center;
}
}
When I try to drag an UIImageView, I'm dragging whole screen, which is incorrect.
Need help!
Karol
You create a gesture recognizer and add it to a view like this:
UIPanGestureRecognizer *panGestureRecognizer = [[UIPanGestureRecognizer alloc] initWithTarget:self action:#selector(gestureRecognizerMethod:)];
[self.imageView addGestureRecognizer:panGestureRecognizer];
you can adjust the position of the image view
- (void)gestureRecognizerMethod:(UIPanGestureRecognizer *)recogniser
{
if (recognizer.state == UIGestureRecognizerStateBegan || recognizer.state == UIGestureRecognizerStateChanged)
{
CGPoint touchLocation = [recognizer locationInView:self.view];
self.imageView.center = touchLocation;
}
}
read this article.
If I read your code right self.view actually IS the whole screen.
Maybe you mean self.yourImageView instead?

How to fix the position of an image after moving it?

I am using - (void) touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event to move an image.How I can fix its position after moving it.I mean I would like when I choose the right position,the image should not move no more.
Add PanGesture to the imageView containing the image.
UIPanGestureRecognizer *panRecognizer = [[UIPanGestureRecognizer alloc] initWithTarget:self action:#selector(panDetected:)];
[imageView addGestureRecognizer:panRecognizer];
//method to move imageView whereever you want in the view,you can also write conditions to restrict the imageView not to go beyond bounds.
- (void)panDetected:(UIPanGestureRecognizer *)panRecognizer
{
CGPoint translation = [panRecognizer translationInView:self.view];
CGPoint imageViewPosition = imageView.center;
imageViewPosition.x += translation.x;
imageViewPosition.y += translation.y;
imageView.center = imageViewPosition;
[panRecognizer setTranslation:CGPointZero inView:self.view];
//you can use if(panRecognizer.state==UIGestureRecognizerStateEnded){} condition to fix the position of the imageView.
}
you can do like this:
-(void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];
UIImageView *view1 =moveImageView;
CGPoint point = [touch locationInView:self.view];
//the right position
if(point.x==?&&point.y==?){
rightPosition = YES;
moveImageView.frame = CGRectMake(point.x, point.y, 50, 50);
}else{
//the UIImageView you want to move
if(!rightPosition){
moveImageView.frame = CGRectMake(point.x, point.y, 50, 50);
}
}
}

how to drag dynamically created UIImageview in obj c (xcode)

i have gone through the many tutorials to drag an image on screen using touchesmoved method
but most of them are not for dynamically created imageviews
in my project i created 5 UIImageview programatically,
now i want that user can drag them on screen>> i also follow this answer
Question but all in vain , no success so far>
the code for creating the dynamically imageview is
for (int i = 0; i < index ; i++)
{
UIImageView *imageView1 = [[UIImageView alloc] initWithImage:
[UIImageimageNamed:image_name]];
self.imageView1.userInteractionEnabled = YES;
imageView1.frame = CGRectMake(xvalue, yvalue, 80.0f, 80.0f);
self.view.userInteractionEnabled = YES;
[self.view addSubview:imageView1];
}
Thanks in advance for good replies
I'm a little confused with how you are creating UIImageViews because you are using a for-loop but a static name. So you might have 15 UIImageViews with the name "imageView1".
But anyways, this shouldn't matter at all if you are using the code in the question you linked to. Perhaps you put the lines in out of order... this is the proper order. (If it doesn't work let me know, along with the errors you get)
//-(void)ViewDidLoad? {???? is this your function??
int xvalue = 0;//?? not sure where you declared these
int yvalue = 0;//?? not sure where you declared these
for (int i = 0; i < index ; i++) {
UIImageView *imageView1 = [[UIImageView alloc] initWithImage:
[UIImageimageNamed:image_name]];
self.imageView1.userInteractionEnabled = YES;
imageView1.frame = CGRectMake(xvalue, yvalue, 80.0f, 80.0f);
self.view.userInteractionEnabled = YES;
[self.view addSubview:imageView1];
}
self.elements=[myElements getElements];
imagesElements = [[NSMutableArray alloc]init];
for(ElemetsList *item in self.elements) {
UIImageView *oneelement = [[UIImageView alloc] initWithImage:[UIImage imageNamed:item.imgElement]];
oneelement.frame = CGRectMake(item.positionX, item.positionY, item.width, item.height);
oneelement.userInteractionEnabled=YES;
[imagesElements addObject:oneelement];
}
for(UIImageView *img in imagesElements) {
[self.view addSubview:img];
}
//}? End Function, whatever it may be...?
-(void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [[event allTouches] anyObject];
for(UIImageView *img in imagesElements)
{
if([self view] == img)
{
CGPoint location = [touch locationInView:self.view];
img.center=location;
}
}
}
If you just want to hard-code in the moving for one image try this:
-(void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
UITouch *touch = [[event allTouches] anyObject];
imageView1.center=[touch locationInView:self.view];
}
There are plenty of ways to address this issue. You can add UIPanGestureRecognizer to each UIImageView at the time its creation, or you can use touchesBegan:, touchesMoved: on self (assuming it's a UIViewController) and traverse each UIImageView to see if its frame contains the point of the touch.

Detect objects, touchesmoved and UITouch

I have a UIView on where i add balls with a ID. When i touch the ball with the ID 1 i draw a dashed line follows my finger.
The problem if when i move the finger to the other balls, i don't know how to detect these balls and check the ID they have. The what i need to happen is when i touch the next ball with the ID 2, the line finish draw and stay from ball 1 to ball 2, and create new one from 2 to finger, next.. 3 etc...
The code:
#import "DrawView.h"
#implementation DrawView
- (id)init
{
self = [super initWithFrame:CGRectMake(0, 0, 1024, 768)];
if (self) {
self.backgroundColor = [UIColor clearColor];
self.opaque = YES;
checkPointCircle = [[CheckPointCircle alloc] initWithPosX:315 posY:138 andNumber:1];
checkPointCircle.userInteractionEnabled = YES;
[self addSubview:checkPointCircle];
checkPointCircle = [[CheckPointCircle alloc] initWithPosX:706 posY:138 andNumber:2];
checkPointCircle.userInteractionEnabled = YES;
[self addSubview:checkPointCircle];
checkPointCircle = [[CheckPointCircle alloc] initWithPosX:315 posY:526 andNumber:3];
checkPointCircle.userInteractionEnabled = YES;
[self addSubview:checkPointCircle];
checkPointCircle = [[CheckPointCircle alloc] initWithPosX:706 posY:526 andNumber:4];
checkPointCircle.userInteractionEnabled = YES;
[self addSubview:checkPointCircle];
}
return self;
}
- (Line *)drawLine {
return drawLine;
}
- (void)setDrawLine:(Line *)line
{
drawLine = line;
}
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];
CheckPointCircle * checkTouch = (CheckPointCircle *)touch.view;
if (touch.view.class == checkPointCircle.class) {
if ([checkTouch getObjectID] == 1) {
startTouchPoint = CGPointMake([checkTouch center].x, [checkTouch center].y);
endTouchPoint = [touch locationInView:self];
}
}
self.drawLine = [[Line alloc] initWithPoint:[touch locationInView:self]];
[self setNeedsDisplay];
}
-(void)touchesCancelled:(NSSet *)touches withEvent:(UIEvent *)event
{
NSLog(#"Cancelado");
}
-(void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];
UITouch *secondaryTouch = (UITouch *)[[[event touchesForView:checkPointCircle] allObjects] objectAtIndex: 0];
NSLog(#"Que toco: %# ", secondaryTouch.view);
if (touch.view.class == checkPointCircle.class) {
CheckPointCircle * checkTouch = (CheckPointCircle *)touch.view;
if ([checkTouch getObjectID] == 1) {
endTouchPoint = [touch locationInView:self];
}
}
[self setNeedsDisplay];
}
-(void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];
CheckPointCircle * checkTouch = (CheckPointCircle *)touch.view;
if (touch.view.class == checkPointCircle.class) {
if ([checkTouch getObjectID] == 1) {
endTouchPoint = [touch locationInView:self];
}
}
[self setNeedsDisplay];
}
- (void)drawRect:(CGRect)rect
{
[drawLine drawLineFrom:startTouchPoint to:endTouchPoint];
}
#end
How to detect the other balls to get the ID.
Can anybody help me?
Thanks!
The Apple documentation of class UIView (https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIView_Class/UIView/UIView.html#//apple_ref/occ/instm/UIView/hitTest:withEvent:) lists two methods which will determine which view contains a hit/point:
– hitTest:withEvent:
– pointInside:withEvent:
Probably hitTest will help most: Its description reads "Returns the farthest descendant of the receiver in the view hierarchy (including itself) that contains a specified point.", so it even converts coordinates as needed.
If you check [self hitTest: [touch.locationInView self] withEvent: event] (or similar, no code completion here ;-)= in your touchesMoved: method, you should be able to detect when the finger is over any of the other circles.
Hope this helps, nobi

Resources