Problems making an Image Gallery using ImageView's and touchesBegan - ios

I'm trying to create an image gallery for my iPhone app. I have laid out the imageViews and I want them to increase in size when the user clicks on them, and then return to normal when they release. The code I have made works for the first image, but the rest are totally unresponsive. Even if I remove the first one completely.
Here is the code I have been trying to use, does anyone have any ideas as to why it might not be working?
Thanks!
- (void) touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
UITouch *touch = [touches anyObject];
if ([touch view] == _imageOne)
{
CGRect newFrame = _imageOne.frame;
newFrame.size.width += 280;
newFrame.size.height += 280;
_imageOne.frame = newFrame;
}
if ([touch view] == _imageTwo)
{
CGRect newFrame2 = _imageTwo.frame;
newFrame2.size.width += 280;
newFrame2.size.height += 280;
_imageTwo.frame = newFrame2;
}
}
- (void) touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {
UITouch *touch = [touches anyObject];
if ([touch view] == _imageOne)
{
CGRect newFrame = _imageOne.frame;
newFrame.size.width -= 280;
newFrame.size.height -= 280;
_imageOne.frame = newFrame;
}
if ([touch view] == _imageTwo)
{
CGRect newFrame2 = _imageTwo.frame;
newFrame2.size.width -= 280;
newFrame2.size.height -= 280;
_imageTwo.frame = newFrame2;
}
}

Related

How to keep imageview inside UIView when moving imageview?

I have an UIView inside main view controller which contain 1 imageview.i moved imageview with this method.
- (void) touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *aTouch = [touches anyObject];
if (aTouch.view == self.sub_View) {
CGPoint location = [aTouch locationInView:self.sub_View];
CGPoint previousLocation = [aTouch previousLocationInView:self.sub_View];
self.imageView.frame = CGRectOffset(self.imageView.frame, (location.x - previousLocation.x), (location.y - previousLocation.y));
}
}
Imageview move perfect. But i have to keep imageview inside UIView when i moved. Problem with this code is when i move imageview it is also moved outside UIView. I have to keep imageview inside UIView and movable only inside UIView.
Please help me to solve this. How to set boundary for imageview so it is movable only inside UIView.
Try below code.
- (void) touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *aTouch = [touches anyObject];
if (aTouch.view == self.sub_View) {
CGPoint location = [aTouch locationInView:self.sub_View];
CGPoint previousLocation = [aTouch previousLocationInView:self.sub_View];
CGRect newFrame = CGRectOffset(self.imageView.frame, (location.x - previousLocation.x), (location.y - previousLocation.y));
if(newFrame.origin.x < 0)
newFrame.origin.x = 0;
if(newFrame.origin.y < 0)
newFrame.origin.y = 0;
if(newFrame.origin.x + newFrame.size.width > self.frame.size.width)
newFrame.origin.x = self.frame.size.width - self.imageView.frame.size.width;
if(newFrame.origin.y + newFrame.size.height > self.frame.size.height)
newFrame.origin.y = self.frame.size.height - self.imageView.frame.size.height;
self.imageView.frame = newFrame;
}
}
a) You can set the clipsToBounds property of your UIView to YES
b) You can use the fallowing code for moving your UIImageView
self.imageView.center = CGPointMake(MAX(0.0, MIN(location.x - previousLocation.x, self.sub_View.bounds.size.width)), MAX(0.0, MIN(location.y - previousLocation.y, self.sub_View.bounds.size.height)));

set up UITouch's moving range

I create a touch moving event for a label which size is (30, 50). here is the code
- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event {
UITouch *touch = [touches anyObject];
UIView *superView = self.superview;
}
But I need to make sure the label can only move inside the superview. In other word, UILabel will stop moving when it “touch” the edge of view, How to setup label's moving range?
Set the label to your touch position
Check whether the label's frame is inside of the superView
If it is outside,change the frame,and set userInteractionEnabled to NO
- (void)touchesMoved:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
self.center = [touches.anyObject locationInView:self.superview];
CGRect bounds = self.superview.bounds;
CGRect newFrame = self.frame;
if (newFrame.origin.x < 0) {
newFrame.origin.x = 0;
self.userInteractionEnabled = NO;
}
if (newFrame.origin.y<0) {
newFrame.origin.y = 0;
self.userInteractionEnabled = NO;
}
if (newFrame.origin.x + newFrame.size.width > bounds.size.width) {
newFrame.origin.x = bounds.size.width - newFrame.size.width;
self.userInteractionEnabled = NO;
}
if (newFrame.origin.y + newFrame.size.height > bounds.size.height) {
newFrame.origin.y = bounds.size.height - newFrame.size.height;
self.userInteractionEnabled = NO;
}
self.frame = newFrame;
}

Using collision on bounds of UIView

I have an ImageView that moves around the UIView, is it possible to detect collision of the ImageView and the view its self? For example the ImageView hits the side of the view I want it to run an action. -(void)restart {}
If this is possible can you detect which side it has collided with?
You can create a custom UIImageVIew and implement the methods touchBegan and touchMoved (don't forget to add [self setUserInteractionEnabled:YES] in your init method). Then set the rect you want to interact with :
customImageView.interactRect = myView.frame;
And in your customImageView you can add something like:
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{
UITouch *touch = [[event allTouches] anyObject];
lastPosition = [touch locationInView: self.superview];
}
- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event{
UITouch *touch = [[event allTouches] anyObject];
CGPoint position = [touch locationInView:self.superview];
CGRect currentFrame = self.frame;
currentFrame.origin = CGPointMake(currentFrame.origin.x + position.x - lastPosition.x, currentFrame.origin.y + position.y - lastPosition.y);
if (CGRectIntersectsRect(currentFrame, interactRect) && !CGRectIntersectsRect(self.frame, interactRect))
{
NSLog(#"I'm in for the first time");
if(self.frame.origin.x + self.frame.size.width <= interactRect.origin.x && currentFrame.origin.x + currentFrame.size.width > interactRect.origin.x)
{
NSLog(#"Coming from the left");
}
if(self.frame.origin.x >= interactRect.origin.x + interactRect.size.width && currentFrame.origin.x < interactRect.origin.x + interactRect.size.width)
{
NSLog(#"Coming from the right");
}
}
self.frame = currentFrame;
lastPosition = position;
}

Programmatically added subview doesn't interact with other views, but xib-added view worked fine

harlanhaskins wrote:
I have a view called userSlider programmaticaly added in viewDidLoad:
self.userSlider = [[UserSliderView alloc] initWithFrame:CGRectMake(0, -120, 320, 155)];
[self.userSlider setUser:user];
[self.userSlider configureView];
[self.view addSubview:self.userSlider];
And a tableview called gameTableView.
I originally had added the userSlider into the xib as a custom view (because UserSlider has its own xib), and when I implemented these touch methods:
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
UITouch *touch = (UITouch*)[touches anyObject];
start = [touch locationInView:self.view].y;
}
-(void) touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
if(start < 0)
{
return;
}
UITouch *touch = (UITouch *)[touches anyObject];
CGFloat now = [touch locationInView:self.view].y;
CGFloat diff = now - start;
sliderDirectionIsUp = diff < 0; //sliderDirectionIsUp is a BOOL
if ((self.userSlider.frame.origin.y == 0) && ((now < 120) || (now > 155))) {
return;
}
float newCenterY = self.userSlider.center.y + diff;
if (newCenterY < roundf(self.userSlider.frame.size.height / 2)) {
self.userSlider.center = CGPointMake(self.userSlider.center.x, newCenterY);
CGRect tableViewFrame = self.gameTableView.frame;
tableViewFrame.origin.y += diff;
tableViewFrame.size.height -= diff;
[self.gameTableView setFrame:tableViewFrame];
}
start = now;
}
-(void) touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
{
CGRect tableViewFrame = self.gameTableView.frame;
if (sliderDirectionIsUp)
{
tableViewFrame.origin.y = 28;
tableViewFrame.size.height = (self.view.frame.size.height - tableViewFrame.origin.y);
//animate userSlider out of visible area
[UIView animateWithDuration:.3 animations:^{
self.userSlider.center = CGPointMake(self.userSlider.center.x, -roundf(self.userSlider.bounds.size.height/2.) + 35);
[self.gameTableView setFrame:tableViewFrame];
}];
}
else if(start >= 0)
{
tableViewFrame.origin.y = (self.userSlider.frame.size.height - 7);
tableViewFrame.size.height = (self.view.frame.size.height - tableViewFrame.origin.y);
//animate userSlider with top to mainviews top
[UIView animateWithDuration:.3 animations:^{
self.userSlider.center = CGPointMake(self.userSlider.center.x, roundf(self.userSlider.bounds.size.height/2.) - 0.5);
[self.gameTableView setFrame:tableViewFrame];
}];
}
}
then both views would move how I wanted them to.
But now when I add it programmatically, suddenly the tableView doesn't change unless I tap inside the area after moving it. It's really weird.
Any ideas?
If your userSlider`s frame is
CGRectMake(0, -120, 320, 155)
I doubt whether your userSlider can receive the sender event .Because if a UIControl`s frame be out of the superView , it may not receive the sender event(the outside part) . You can set the frame
CGRectMake(0, 0, 320, 155)
to have a try .

Boundary for draggable image ios

I'm trying to create a draggable image, but i'm trying to confine it's dragging to within a small square rather than the full screen. Could someone tell me where i'm going wrong?. I've placed the code that I have so far below:
-(void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event{
UITouch *touch = [[event allTouches] anyObject];
if([touch view] == dot) {
CGPoint location = [touch locationInView:self.view];
dot.center = location;
if (location.x >10) {
location.x =10;
} else if (location.x <10) {
location.x = 10;
}
if (location.y >20) {
location.y =20;
} else if (location.y < 20) {
location.y = 20;
}
}
}
You are assigning location before you are making changes to it.
Apply your limits to location first then assign it to dot.
Also, your limits you are showing would lock your position to 10,20 since you are not allowing it to be more than 10 or less than 10. Likewise with 20.
-(void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event{
UITouch *touch = [[event allTouches] anyObject];
if([touch view] == dot) {
CGPoint location = [touch locationInView:self.view];
location.x = MIN(MAX(location.x, 0),10);
location.y = MIN(MAX(location.y, 0),20);
dot.center = location;
}
}
I have implemented an image dragging function recently like this. I use the PAN Gesture to move the image which results in two CGFloats "endPointX and endPointY". In the code below between the comments "Stay on Screen Check" and "End Stay on Screen check", I check if these are on the screen. If not I adjust them to prevent the image moving off the screen.
I hope that helps. If you want to move the image within a small part of the total screen then I would add the image to a holder subview and then check the holder view .bounds.size.width/height above instead.
CGFloat endPointX = translatedPoint.x + (.35*[(UIPanGestureRecognizer*)sender
velocityInView:self.view].x);
CGFloat endPointY = translatedPoint.y + (.35*[(UIPanGestureRecognizer*)sender velocityInView:self.view].y);
// Stay on the screen check
if(endPointX < 0) {
endPointX = 0;
} else if(endPointX > self.view.bounds.size.width) {
endPointX = self.view.bounds.size.width;
}
if(endPointY < 0) {
endPointY = 0;
} else if(endPointY > self.view.bounds.size.height) {
endPointY = self.view.bounds.size.height;
}
// End of the Stay on Screen check
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:.35];
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
[[sender view] setCenter:CGPointMake(endPointX, endPointY)];
[UIView commitAnimations];

Resources