How to add movable UIView as subview with dynamic size at runtime in objective C? - objective-c

I need to add a UIView as subview of a UIView where a UIImageview is displayed. What I need to implement is that when the image is loaded in my UIIMageview, at the same time I am showing the UIView call it as newView. In the beginning,I am showing it with static size say 190X170 and alpha as 0.5. Once i tap my finger on that view,it should move on the whole UIImageview. Once it is moved at the last,that coordinated I am taking and cropping my image with the same points. Now I am done with the moving part using the code below.
- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [[event allTouches] anyObject];
CGPoint touchLocation = [touch locationInView:self.view];
if (CGRectContainsPoint(newView.frame, touchLocation))
{
dragging = YES;
oldX = touchLocation.x;
oldY = touchLocation.y;
}
if (dragging)
{
newView.layer.borderColor = [UIColor clearColor].CGColor;
newView.layer.borderWidth = 1.0f;
CGRect frame = newView.frame;
frame.origin.x = newView.frame.origin.x + touchLocation.x - oldX;
x = frame.origin.x;
NSLog(#"x value : %d",x);
frame.origin.y = newView.frame.origin.y + touchLocation.y - oldY;
y = frame.origin.y;
NSLog(#"y value : %d",y);
newView.frame = frame;
}
oldX = touchLocation.x;
oldY = touchLocation.y;
}
What I need to implement is to resize the UIView on taping two fingers like that of UIScrollview. I tried to implement the UIScrollview but it is not giving me good effect. I tried to implement
NSUInteger resizingMask = NSViewHeightSizable | NSViewWidthSizable;
[self.view setAutoresizesSubviews:YES];
[newView setAutoresizingMask:resizingMask];
but in vain. Nothing is taking place.
Can anybody show me a path for the same. Thanks in advance.

To provide the zoom in zoom out feature you can use the UIPinchGuestureRecognizer. If you are using iOS 5 then it will be pretty easy for you.
here is the very cool tutorial for that hope it will help for you.
http://www.raywenderlich.com/6567/uigesturerecognizer-tutorial-in-ios-5-pinches-pans-and-more

Related

How to add images while moving finger across UIView?

I am having issues adding an image across a view while moving finger across the screen.
Currently it is adding the image multiple times but squeezing them too close together and not really following my touch.
EDIT:
What I want:
After taking or choosing an image, the user can then select another image from a list. I want the user to touch and move their finger across the view and the selected image will appear where they drag their finger, without overlapping, in each location.
This works:
-(void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];
currentTouch = [touch locationInView:self.view];
CGRect myImageRect = CGRectMake(currentTouch.x, currentTouch.y, 80.0f, 80.0f);
myImage = [[UIImageView alloc] initWithFrame:myImageRect];
[myImage setImage:[UIImage imageNamed:#"dot.png"]];
[self.view addSubview:myImage];
[myImage release];
}
New Question: How do I add spaces in this so that the image isn't so snug when drawing it on the view?
You might want to explain your question more, what exactly are you trying to achieve! If you dont want the images to overlap than you can try this!
UITouch * touch = [touches anyObject];
touchPoint = [touch locationInView:imageView];
prev_touchPoint = [touch previousLocationInView:imageView];
if (ABS(touchPoint.x - prev_touchPoint.x) > 80
|| ABS(touchPoint.y - prev_touchPoint.y) > 80) {
_aImageView = [[UIImageView alloc] initWithImage:aImage];
_aImageView.multipleTouchEnabled = YES;
_aImageView.userInteractionEnabled = YES;
[_aImageView setFrame:CGRectMake(touchPoint.x, touchPoint.y, 80.0, 80.0)];
[imageView addSubview:_aImageView];
[_aImageView release];
}
I'm sorry because I'm in company and I can't post too big data(the code). The squeezing is because you have not checked the touch point's distance with last touch point. Check a point whether it's in a view:bool CGRectContainsPoint (CGRect rect,CGPoint point);I mean remember a touch point in touchesBegan:. Update it if the new touches in touchesMomved: is bigger than image's width or left. And put the add image view in a method and call it use - (void)performSelectorInBackground:(SEL)aSelector withObject:(id)arg.
you can also use UISwipeGestureRecognizer as below instead of touchesMoved method,while swiping across the screen.in viewDidload:method,
UISwipeGestureRecognizer *swipeup = [[UISwipeGestureRecognizer alloc]initWithTarget:self action:#selector(swipedone:)];
swipeup.direction = UISwipeGestureRecognizerDirectionUp;
swipeup.numberOfTouchesRequired=1;
[self.view addGestureRecognizer:swipeup];
method definition:
-(IBAction)swipedone:(UISwipeGestureRecognizer*)recognizer
{
NSLog(#"swiped");
UIImageView* _aImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"1.png"]];
_aImageView.frame = CGRectMake(10, 10, 100, 100);
_aImageView.multipleTouchEnabled = YES;
_aImageView.userInteractionEnabled = YES;
CGPoint point = [recognizer locationInView:recognizer.view];
[_aImageView setFrame:CGRectMake(point.x, point.y, 80.0, 80.0)];
[self.view addSubview:_aImageView];
[_aImageView release];
}
currently i am using this code for swipe up.i think it will works fine.once try it.

How can I make a UIImageView follow a certain path? [duplicate]

I am developing a simple animation where an UIImageView moves along a UIBezierPath, now I want to provide user interation to the moving UIImageView so that user can guide the UIImageView by touching the UIImageView and drag the UIImageview around the screen.
Change the frame of the position of the image view in touchesMoved:withEvent:.
Edit: Some code
- (void)touchesBegan:(NSSet*)touches withEvent:(UIEvent*)event {
UITouch *touch = [[event allTouches] anyObject];
if ([touch.view isEqual: self.view] || touch.view == nil) {
return;
}
lastLocation = [touch locationInView: self.view];
}
- (void)touchesMoved:(NSSet*)touches withEvent:(UIEvent*)event {
UITouch *touch = [[event allTouches] anyObject];
if ([touch.view isEqual: self.view]) {
return;
}
CGPoint location = [touch locationInView: self.view];
CGFloat xDisplacement = location.x - lastLocation.x;
CGFloat yDisplacement = location.y - lastLocation.y;
CGRect frame = touch.view.frame;
frame.origin.x += xDisplacement;
frame.origin.y += yDisplacement;
touch.view.frame = frame;
lastLocation=location;
}
You should also implement touchesEnded:withEvent: and touchesCanceled:withEvent:.
So you want the user to be able to touch an image in the middle of a keyframe animation along a curved path, and drag it to a different location? What do you want to happen to the animation at that point?
You have multiple challenges.
First is detecting the touch on the object while a keyframe animation is "in flight".
To do that, you want to use the parent view's layer's presentation layer's hitTest method.
A layer's presentation layer represents the state of the layer at any given instant, including animations.
Once you detect touches on your view, you will need to get the image's current location from the presentation layer, stop the animation, and take over with a touchesMoved/touchesDragged based animation.
I wrote a demo application that shows how to detect touches on an object that's being animated along a path. That would be a good starting point.
Take a look here:
Core Animation demo including detecting touches on a view while an animation is "in flight".
Easiest way would be subclassing UIImageView.
For simple dragging take a look at the code here (code borrowed from user MHC):
UIView drag (image and text)
Since you want to drag along Bezier path you'll have to modify touchesMoved:
-(void) touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
UITouch *aTouch = [touches anyObject];
//here you have location of user's finger
CGPoint location = [aTouch locationInView:self.superview];
[UIView beginAnimations:#"Dragging A DraggableView" context:nil];
//commented code would simply move the view to that point
//self.frame = CGRectMake(location.x-offset.x,location.y-offset.y,self.frame.size.width, self.frame.size.height);
//you need some kind of a function
CGPoint calculatedPosition = [self calculatePositonForPoint: location];
self.frame = CGRectMake(calculatedPosition.x,calculatedPosition.y,self.frame.size.width, self.frame.size.height);
[UIView commitAnimations];
}
What exactly you would like to do in -(CGPoint) calculatePositionForPoint:(CGPoint)location
is up to you. You could for example calculate point in Bezier path that is the closest to location. For simple test you can do:
-(CGPoint) calculatePositionForPoint:(CGPoint)location {
return location;
}
Along the way you're gonna have to decide what happens if user wonders off to far from your
precalculated Bezier path.

detecting touch in UIImageView animation

i have a circle image that circles round the screen using a path animation. And i want to detect when the user touches the moving circle. However even though the image is moving round in a continuous circle its frame is still in the top left hand corner not moving, how can i update this so that i can detect a touch on the moving image? Here is the code...
Set Up Animation in ViewDidLoad:
//set up animation
CAKeyframeAnimation *pathAnimation = [CAKeyframeAnimation animationWithKeyPath:#"position"];
pathAnimation.calculationMode = kCAAnimationPaced;
pathAnimation.fillMode = kCAFillModeForwards;
pathAnimation.removedOnCompletion = NO;
pathAnimation.duration = 10.0;
pathAnimation.repeatCount = 1000;
CGMutablePathRef curvedPath = CGPathCreateMutable();
//path as a circle
CGRect bounds = CGRectMake(60,170,200,200);
CGPathAddEllipseInRect(curvedPath, NULL, bounds);
//tell animation to use this path
pathAnimation.path = curvedPath;
CGPathRelease(curvedPath);
//add subview
circleView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"ball.png"]];
[testView addSubview:circleView];
//animate
[circleView.layer addAnimation:pathAnimation forKey:#"moveTheSquare"];
Touches Method:
- (void) touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
//detect touch
UITouch *theTouch = [touches anyObject];
//locate and assign touch location
CGPoint startPoint = [theTouch locationInView:self.view];
CGFloat x = startPoint.x;
CGFloat y = startPoint.y;
//create touch point
CGPoint touchPoint = CGPointMake(x, y);
//check to see if the touch is in the rect
if (CGRectContainsPoint(circleView.bounds, touchPoint)) {
NSLog(#"yes");
}
//check image view position
NSLog(#"frame x - %f, y - %f", circleView.frame.origin.x, circleView.frame.origin.y);
NSLog(#"center x - %f, y - %f", circleView.center.x, circleView.center.y);
NSLog(#"bounds x - %f, y - %f", circleView.bounds.origin.x, circleView.bounds.origin.y);
}
the imageview just seems to stay at the top left hand corner. I cant seem to figure out how to recognise if a touch gesture has been made on the moving ball.
any help would be appreciated,
Chris
You need to query the presentation layer of the view not it's frame. Only the presentation will be updated during the course of an animation...
[myImageView.layer presentationLayer]
Access the properties of this layer (origin, size etc) and determine if your touch point is within the bounds.

how to resize UIView with corner handles - similar to 'Pages', 'Keynote'

I need to add handles (to the corners) of view, so user can resize this view with them. Something similar to edit graphic in Apples 'pages' or 'keynote' apps. (or in any other graphic app).
I did try to add handles subviews to a given view, but those views received touches only in place where both overlapping, inside given view bounds. I need to be able to drag any of the corners handles which will change frame or bounds of that given view. (this part I have already working).
any suggestions, tutorials, links will be appreciated :)
I'm new, so I can't :( post images, so
please take a look at link
I would make a UIGripView that inherits from UIView that is on top of the view you want.
It would:
Be given a view to manipulate and size itself accordingly (a little larger, but with the same center)
Draw itself (the grips and borders) -- implement -(void) drawRect:(CGRect)rect
Register gesture recognizers
When a grip is moved, resize the underlying view and yourself accordingly
When the center is moved, move the center of the underlying view and yourself.
It might make it easier to deal with gestures if you make each grip a UIView as well, but it's not hard to make some zones in your view and check which one the touch is in.
(Remember to make the touch zones big enough)
- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{
UITouch *touch = [[event allTouches] anyObject];
touchStart = [[touches anyObject] locationInView:self];
isResizingLR = (self.bounds.size.width - touchStart.x < kResizeThumbSize && self.bounds.size.height - touchStart.y < kResizeThumbSize);
isResizingUL = (touchStart.x <kResizeThumbSize && touchStart.y <kResizeThumbSize);
isResizingUR = (self.bounds.size.width-touchStart.x < kResizeThumbSize && touchStart.y<kResizeThumbSize);
isResizingLL = (touchStart.x <kResizeThumbSize && self.bounds.size.height -touchStart.y <kResizeThumbSize);
}
- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event{
CGPoint touchPoint = [[touches anyObject] locationInView:self];
CGPoint previous=[[touches anyObject]previousLocationInView:self];
float deltaWidth = touchPoint.x-previous.x;
float deltaHeight = touchPoint.y-previous.y;
if (isResizingLR) {
self.frame = CGRectMake(self.frame.origin.x, self.frame.origin.y,touchPoint.x + deltaWidth, touchPoint.y + deltaWidth);
}
if (isResizingUL) {
self.frame = CGRectMake(self.frame.origin.x + deltaWidth, self.frame.origin.y + deltaHeight, self.frame.size.width - deltaWidth, self.frame.size.height - deltaHeight);
}
if (isResizingUR) {
self.frame = CGRectMake(self.frame.origin.x ,self.frame.origin.y + deltaHeight, self.frame.size.width + deltaWidth, self.frame.size.height - deltaHeight);
}
if (isResizingLL) {
self.frame = CGRectMake(self.frame.origin.x + deltaWidth ,self.frame.origin.y , self.frame.size.width - deltaWidth, self.frame.size.height + deltaHeight);
}
if (!isResizingUL && !isResizingLR && !isResizingUR && !isResizingLL) {
self.center = CGPointMake(self.center.x + touchPoint.x - touchStart.x,self.center.y + touchPoint.y - touchStart.y);
}
}

Identify specific image view from multiple imageviews

I have a single image view, and I set other image views on it and put them in different locations. I want to apply FLIP ANIMATION on mage view. How can do it? when if(i==1) then my imageview is flipped. img1 is my image view and I want to identify it. I allocate 52 images in `imagearr
My code:
-(void)setCards
{
int k=0;
CGFloat dx = self.view.frame.size.width/2;
CGFloat dy = self.view.frame.size.height/2;
int cnt = [imagearr count];
for (int j=1; j<3; j++) // Number of cards
{
for (int i=1; i<5; i++) // Number of players
{
int rnd = (arc4random() % cnt)-1;
UIImage *img = [imagearr objectAtIndex:rnd];
UIImageView *img1 = [[UIImageView alloc] initWithImage:img];
CGRect frame = img1.frame;
frame.size.width = frameX;
frame.size.height = frameY;
[img1 setFrame:frame];
[img1 setTag:k+i];
[UIView beginAnimations:#"Move" context:nil];
[UIView setAnimationDuration:0.50];
if (i==1)
{
[img1 setCenter:CGPointMake(dx+100, dy+(j*15))];
}
if (i==2)
{
[img1 setCenter:CGPointMake(dx+(j*15), dy+60)];
}
if (i==3)
{
[img1 setCenter:CGPointMake(dx-130, dy-(j*15))];
}
if (i==4)
{
[img1 setCenter:CGPointMake(dx-(j*20), dy-95)];
}
[self.view addSubview:img1];
[UIView commitAnimations];
[img1 release];
}
k=k+10;
}
}
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [[event allTouches] anyObject];
int t = [touch view].tag;
}
I still can't identify a specific imageview. Please help me to solve this problem.
Setting tag for individual imageView is the best approach. Using tag you could even detect multiples images placed inside tableview cells and set action for selection of individual tag as well.
I think you should take a look at the Apple sample project GeekGameBoard. It implements a solitaire game and you will be able to learn how to select CALayers* representing cards, drag them around, and have them interact with each other.
*Which will be both easier and probably better from a performance perspective than using views.
Associate a unique tag values with each UIImageView instances.
Code for reference.
myImageView1.tag = 1;
myImageView1.tag = 2;
myImageView1.tag = 3;
Apple Link For the code:
Detect imageview from multiple imageview
Stack Link As Well
Here is the discussion for to detect the images from the multiple images
Good Luck
There will be different images in different imageView so each imageView will be on different position.
in your touch method do you have to check the bounds of the touch and then you have to match which imageView lies under your touch region.According to that you can proceed your functionality.
You can probably place a invisible UIbutton over your imageviews and capture touch event. The effect is the same and its much more cleaner and simpler. Let me know if you need more info. Would be happy to edit my answer here.
you could try something similar to this
-(void)touchesBegan:(NSSet*)touches withEvent:(UIEvent*)event //here enable the touch
{
// get touch event
UITouch *touch = [[event allTouches] anyObject];
int t = [touch view].tag;
UIImageView *imageView = (UIImageView *) [self.view viewWithTag:t];
//your logic here
}