I'm trying to zoom and before it was working with a image in the scrollview. Now I'm trying to replace that image with a ViewController and zoom in on the object in that ViewController. It is not working.
viewDidLoad:
- (void)viewDidLoad
{
self.boardView = [[BoardViewController alloc] init];
[self.scrollView addSubview:self.boardView.view];
[self.scrollView setContentSize:(CGSizeMake(320, 320))];
UITapGestureRecognizer *doubleTapRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:#selector(scrollViewDoubleTapped:)];
doubleTapRecognizer.numberOfTapsRequired = 2;
doubleTapRecognizer.numberOfTouchesRequired = 1;
[self.scrollView addGestureRecognizer:doubleTapRecognizer];
viewForZoomingInScrollView:
- (UIView*)viewForZoomingInScrollView:(UIScrollView *)scrollView {
return [self.scrollView.subviews objectAtIndex:0];
doubleTapped method: (it is calling this when I put a log in it, it's just not zooming.
- (void)scrollViewDoubleTapped:(UITapGestureRecognizer*)recognizer {
CGPoint pointInView = [recognizer locationInView:self.boardView.view];
CGFloat newZoomScale = self.scrollView.zoomScale * 3.0f;
if (self.scrollView.zoomScale > self.scrollView.minimumZoomScale){
newZoomScale = MIN(newZoomScale, self.scrollView.minimumZoomScale);
}
else {
newZoomScale = MIN(newZoomScale, self.scrollView.maximumZoomScale);
}
CGSize scrollViewSize = self.scrollView.bounds.size;
CGFloat w = scrollViewSize.width / newZoomScale;
CGFloat h = scrollViewSize.height / newZoomScale;
CGFloat x = pointInView.x - (w / 2.0f);
CGFloat y = pointInView.y - (h / 2.0f);
CGRect rectToZoomTo = CGRectMake(x, y, w, h);
[self.scrollView zoomToRect:rectToZoomTo animated:YES];
I don't understand what's wrong with it.
Related
I am doing a project in which i need two imageviews in single Scrollview with zooming options. UIScrollView allows one view to make zoom easily. But my problem is not like that. I have two imageviews side by side in the scroll view.When I try to zoom the images its not working Is there is any option to zoom two image views at the same time.Please suggest me some idea.
Thanks in advance
Here is code for Zooming two images in single scrollview
I have added two UIImageView's in One UIView and then I have added the UIView to UIScrollView. Following is my code :
- (void)viewDidLoad {
[super viewDidLoad];
self.vwImages = [[UIView alloc]initWithFrame:CGRectMake(0, 0,100,200)];
// 1
UIImage *image = [UIImage imageNamed:#"imgBaskteBall2.jpeg"];
UIImageView *imageView1 = [[UIImageView alloc] initWithImage:image];
imageView1.frame = CGRectMake(0,0,100,100);
[self.vwImages addSubview:imageView1];
UIImage *image2 = [UIImage imageNamed:#"imgBaskteBall1.jpeg"];
UIImageView *imageView2 = [[UIImageView alloc] initWithImage:image2];
imageView2.frame = CGRectMake(0, 100, 100, 100);
[self.vwImages addSubview:imageView2];
// 2
[self.scrollView addSubview:self.vwImages];
self.scrollView.contentSize = self.vwImages.frame.size;
// 3
UITapGestureRecognizer *doubleTapRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:#selector(scrollViewDoubleTapped:)];
doubleTapRecognizer.numberOfTapsRequired = 2;
doubleTapRecognizer.numberOfTouchesRequired = 1;
[self.scrollView addGestureRecognizer:doubleTapRecognizer];
UITapGestureRecognizer *twoFingerTapRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:#selector(scrollViewTwoFingerTapped:)];
twoFingerTapRecognizer.numberOfTapsRequired = 1;
twoFingerTapRecognizer.numberOfTouchesRequired = 2;
[self.scrollView addGestureRecognizer:twoFingerTapRecognizer];
}
- (void)viewWillAppear:(BOOL)animated {
[super viewWillAppear:animated];
// 4
CGRect scrollViewFrame = self.scrollView.frame;
CGFloat scaleWidth = scrollViewFrame.size.width / self.scrollView.contentSize.width;
CGFloat scaleHeight = scrollViewFrame.size.height / self.scrollView.contentSize.height;
CGFloat minScale = MIN(scaleWidth, scaleHeight);
self.scrollView.minimumZoomScale = minScale;
// 5
self.scrollView.maximumZoomScale = 10.0f;
self.scrollView.zoomScale = minScale;
// 6
[self centerScrollViewContents];
}
- (void)centerScrollViewContents {
CGSize boundsSize = self.scrollView.bounds.size;
CGRect contentsFrame = self.vwImages.frame;
if (contentsFrame.size.width < boundsSize.width) {
contentsFrame.origin.x = (boundsSize.width - contentsFrame.size.width) / 2.0f;
} else {
contentsFrame.origin.x = 0.0f;
}
if (contentsFrame.size.height < boundsSize.height) {
contentsFrame.origin.y = (boundsSize.height - contentsFrame.size.height) / 2.0f;
} else {
contentsFrame.origin.y = 0.0f;
}
self.vwImages.frame = contentsFrame;
}
- (void)scrollViewDoubleTapped:(UITapGestureRecognizer*)recognizer {
// 1
CGPoint pointInView = [recognizer locationInView:self.imageView];
// 2
CGFloat newZoomScale = self.scrollView.zoomScale * 1.5f;
newZoomScale = MIN(newZoomScale, self.scrollView.maximumZoomScale);
// 3
CGSize scrollViewSize = self.scrollView.bounds.size;
CGFloat w = scrollViewSize.width / newZoomScale;
CGFloat h = scrollViewSize.height / newZoomScale;
CGFloat x = pointInView.x - (w / 2.0f);
CGFloat y = pointInView.y - (h / 2.0f);
CGRect rectToZoomTo = CGRectMake(x, y, w, h);
// 4
[self.scrollView zoomToRect:rectToZoomTo animated:YES];
}
- (void)scrollViewTwoFingerTapped:(UITapGestureRecognizer*)recognizer {
// Zoom out slightly, capping at the minimum zoom scale specified by the scroll view
CGFloat newZoomScale = self.scrollView.zoomScale / 1.5f;
newZoomScale = MAX(newZoomScale, self.scrollView.minimumZoomScale);
[self.scrollView setZoomScale:newZoomScale animated:YES];
}
- (UIView*)viewForZoomingInScrollView:(UIScrollView *)scrollView {
// Return the view that you want to zoom
return self.vwImages;
}
- (void)scrollViewDidZoom:(UIScrollView *)scrollView {
// The scroll view has zoomed, so you need to re-center the contents
[self centerScrollViewContents];
}
Make object of UIView as container for example viewContainer
[viewContainer addSubView:imageView1];
[viewContainer addSubView:imageView2];
[scrollView addSubView:viewContainer];
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{
return viewContainer;
}
Add
You can use this
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{
return [self.scrollView.subviews objectAtIndex:0];
}
the viewForZoomingInScrollView delegate method return the object at Index 0.
From Properly zooming a UIScrollView that contains many subviews
add both the imageView in the view and replace this method
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{
return view;
}
I have a sign up form defined as following and i like to have this form in a scrollview so that if user selects the textfields in the bottom it scrolls.
The thing is that , the sign up form does not cover the whole screen and in the background I still have the main view and I want the textfields to scroll inside the form,without changing the location of the window of the form( I dont want the form view comes up and cover the background).
- (UIView *)Form
{
if (!_Form) {
CGRect frame = CGRectMake(0.0, Height, Width, 310.0);
UIView *container = [[UIView alloc] initWithFrame:frame];
CGFloat y = 15.0;
frame = CGRectMake(15.0, y, width, height);
UITextField *field = [[UITextField alloc] initWithFrame:frame];
[
field.placeholder = #"text1*";
CGFloat spacing = 8.0;
y = frame.origin.y + kDefaultTextFieldHeight + spacing;
frame = CGRectMake(15.0, y, kDeviceWidth - 2*15.0, kDefaultTextFieldHeight);
field = [[UITextField alloc] initWithFrame:frame];
field.placeholder = #"Password*";
frame.size.height = 200.0;
y = frame.origin.y + kDefaultTextFieldHeight + spacing;
frame = CGRectMake(15.0, y, kDeviceWidth - 2*15.0, kDefaultTextFieldHeight);
field = [[UITextField alloc] initWithFrame:frame];
field.placeholder = #"Confirm Password*";
y = frame.origin.y + kDefaultTextFieldHeight + 16.0;
CGFloat w = (kDeviceWidth - 2 * 15.0) / 2;
frame = CGRectMake(15.0, y, w - 2.0, height);
field = [[UITextField alloc] initWithFrame:frame];
field.placeholder = #"First Name*";
frame = CGRectMake(15.0 + w + 2.0, y, w - 2.0, height);
field = [[UITextField alloc] initWithFrame:frame];
field.placeholder = #"Last Name*";
[container addSubview:field];
y = frame.origin.y + kDefaultTextFieldHeight + spacing;
frame = CGRectMake(15.0, y, w, kDefaultTextFieldHeight);
field = [[UITextField alloc] initWithFrame:frame];
field.placeholder = #"Birthday";
y = frame.origin.y + kDefaultTextFieldHeight + 20.0;
frame = CGRectMake((container.frame.size.width - 192.0) / 2, y, 192.0, 34.0);
y = frame.origin.y + kDefaultTextFieldHeight + 8.0;
frame = CGRectMake((container.frame.size.width - 192.0) / 2, y, 192.0, 34.0);
_Form = container;
}
return _Form;
}
Thanks!
Try and change below code according to fulfill your requirements:
static const CGFloat KEYBOARD_ANIMATION_DURATION = 0.3;
static const CGFloat MINIMUM_SCROLL_FRACTION = 0.2;
static const CGFloat MAXIMUM_SCROLL_FRACTION = 0.8;
static const CGFloat PORTRAIT_KEYBOARD_HEIGHT = 216;
static const CGFloat LANDSCAPE_KEYBOARD_HEIGHT = 162;
- (void)textFieldDidBeginEditing:(UITextField *)textField
{
CGRect textFieldRect =
[self.view.window convertRect:textField.bounds fromView:textField];
CGRect viewRect =
[self.view.window convertRect:self.view.bounds fromView:self.view];
CGFloat midline = textFieldRect.origin.y + 0.5 * textFieldRect.size.height;
CGFloat numerator =
midline - viewRect.origin.y
- MINIMUM_SCROLL_FRACTION * viewRect.size.height;
CGFloat denominator =
(MAXIMUM_SCROLL_FRACTION - MINIMUM_SCROLL_FRACTION)
* viewRect.size.height;
CGFloat heightFraction = numerator / denominator;
if (heightFraction < 0.0)
{
heightFraction = 0.0;
}
else if (heightFraction > 1.0)
{
heightFraction = 1.0;
}
UIInterfaceOrientation orientation =
[[UIApplication sharedApplication] statusBarOrientation];
if (orientation == UIInterfaceOrientationPortrait ||
orientation == UIInterfaceOrientationPortraitUpsideDown)
{
animatedDistance = floor(PORTRAIT_KEYBOARD_HEIGHT * heightFraction);
}
else
{
animatedDistance = floor(LANDSCAPE_KEYBOARD_HEIGHT * heightFraction);
}
CGRect viewFrame = self.view.frame;
viewFrame.origin.y -= animatedDistance;
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationDuration:KEYBOARD_ANIMATION_DURATION];
[self.view setFrame:viewFrame];
[UIView commitAnimations];
}
- (void)textFieldDidEndEditing:(UITextField *)textField
{
CGRect viewFrame = self.view.frame;
viewFrame.origin.y += animatedDistance;
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationDuration:KEYBOARD_ANIMATION_DURATION];
[self.view setFrame:viewFrame];
[UIView commitAnimations];
}
- (BOOL)textFieldShouldReturn:(UITextField *)textField
{
[textField resignFirstResponder];
return YES;
}
How can I include this view in a scrollerView?
I have a subview with different textfields ,and I want to have it in a scrollview so that when a user clicks on a field view get scrolled.
- (UIView *)Form
{
if (!_Form) {
CGRect frame = CGRectMake(0.0, Height, Width, 310.0);
UIView *container = [[UIView alloc] initWithFrame:frame];
CGFloat y = 15.0;
frame = CGRectMake(15.0, y, width, height);
UITextField *field = [[UITextField alloc] initWithFrame:frame];
[
field.placeholder = #"text";
CGFloat spacing = 8.0;
y = frame.origin.y + height + spacing;
frame = CGRectMake(15.0, y, kDeviceWidth - 2*15.0, height);
field = [[UITextField alloc] initWithFrame:frame];
field.placeholder = #"text6";
frame.size.height = 200.0;
y = frame.origin.y + height + space;
frame = CGRectMake(15.0, y, width - 2*15.0, height);
field = [[UITextField alloc] initWithFrame:frame];
field.placeholder = #"text1*";
y = frame.origin.y + height + 16.0;
CGFloat w = (kDeviceWidth - 2 * 15.0) / 2;
frame = CGRectMake(15.0, y, w - 2.0, height);
field = [[UITextField alloc] initWithFrame:frame];
field.placeholder = #"text3*";
frame = CGRectMake(15.0 + w + 2.0, y, w - 2.0, height);
field = [[UITextField alloc] initWithFrame:frame];
field.placeholder = #"text4*";
y = frame.origin.y + height + spacevalue;
frame = CGRectMake(15.0, y, w, height);
field = [[UITextField alloc] initWithFrame:frame];
field.placeholder = #"text5";
y = frame.origin.y + height + 20.0;
frame = CGRectMake((frame.size.width - 192.0) / 2, y, 192.0, 34.0);
y = frame.origin.y + height + 8.0;
frame = CGRectMake((frame.size.width - 192.0) / 2, y, 192.0, 34.0);
}
return _Form;
}
Can you help me with code pls.
Thanks
I have this code:
CGPoint puntoInicial;
-(void) textFieldDidBeginEditing:(UITextField *)textField {
CGPoint pt;
CGRect rc = [textField bounds];
rc = [textField convertRect:rc toView:scrollView];
pt = rc.origin;
puntoInicial = pt;
pt.x = 0;
pt.y -= 250;
[scrollView setContentOffset:pt animated:YES];
textField.autocapitalizationType = UITextAutocapitalizationTypeAllCharacters;
}
//Bajar la pantalla cuando se termina de editar
-(void) textFieldDidEndEditing:(UITextField *)textField {
puntoInicial.x = 0;
puntoInicial.y = 0;
[scrollView setContentOffset:puntoInicial animated:YES];
}
Only put this in your code and in the textField -> Connections inspector -> Oulets -> Delegate, put the Files Owner
I have an ImageView which is add to UIView. Now i need to zoomIn ZoomOut the Image which is added to imageView which again add subview UIView.
now to get zooming effect to the image.
I have try not lucky today.
You will want to use a scroll view. Add a scrollview to your nib (or do it programmatically. Then load an UIImage, add it to an UIImageView, then add the UIImageView to the scroll view :
//inside you viewDidLoad
UIImage * image = //set image here
previewImageView = [[UIImageView alloc] initWithImage:image];
scrollView.contentSize = CGSizeMake(320, 480);
[scrollView addSubview:previewImageView];
scrollView.minimumZoomScale = 0.4;
scrollView.maximumZoomScale = 4.0;
scrollView.delegate = self;
[scrollView setZoomScale:scrollView.minimumZoomScale];
Then add your gesture methods:
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollview {
return self.previewImageView;
}
- (CGRect)zoomRectForScale:(float)scale withCenter:(CGPoint)center {
CGRect zoomRect;
zoomRect.size.height = [self.scrollView frame].size.height / scale;
zoomRect.size.width = [self.scrollView frame].size.width / scale;
zoomRect.origin.x = center.x - (zoomRect.size.width / 2.0);
zoomRect.origin.y = center.y - (zoomRect.size.height / 2.0);
return zoomRect;
}
- (void)zoomAction:(UIGestureRecognizer *)gestureRecognizer {
NSLog(#"Hit the gestureRecognizer");
float newScale = [self.scrollView zoomScale] * 2;
CGRect zoomRect = [self zoomRectForScale:newScale withCenter:[gestureRecognizer locationInView:gestureRecognizer.view]];
[self.scrollView zoomToRect:zoomRect animated:YES];
}
EDIT - I had my height and width mixed in my CGSizeMake
Try to add the imageview in a web view or on a scroll view then the zooming will be easy.
I would maybe use a scrollview:
http://idevzilla.com/2010/10/04/uiscrollview-and-zoom/
http://forums.pragprog.com/forums/83/topics/1488
Try this,
UITouch *first = twoTouches objectAtIndex:0;
UITouch *second = twoTouches objectAtIndex:1;
CGPoint firstPoint = first locationInView:self;
CGPoint secondPoint = second locationInView:self;
CGFloat initialDistance = distanceBetweenPoints(firstPoint, secondPoint);
and put self.multipleTouchEnabled = YES;
I am trying to center an image (with respect to the iphone screen) such that when the view is loaded the image is center width/height... In my case my view is loaded at pixel points 0,0 of the image itself and if I zoom out the image appears in the top left corner as opposed to mid-center of the screen/view. Here is what I have so far:
UIImage *image = [UIImage imageNamed: #"t.bmp"];
self.view.backgroundColor = [UIColor blackColor];
self.mi.frame = CGRectMake(0, 0, image.size.width, image.size.height);
self.mi.contentMode = (UIViewContentModeCenter);
self.mi.backgroundColor = [UIColor blackColor];
[self.mi setImage:image];
/* Draw a line here!!
UIGraphicsBeginImageContext(self.mi.frame.size);
[self.mi.image drawInRect:CGRectMake(0, 0, image.size.width, image.size.height)];
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor);
CGContextSetLineWidth(context, 20.0);
CGContextBeginPath(context);
CGContextMoveToPoint(context, 0,0);
CGContextAddLineToPoint(context, 200, 200);
CGContextMoveToPoint(context, 200,0);
CGContextAddLineToPoint(context, 0, 200);
CGContextStrokePath(context);
self.mi.image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
*/
self.expimg.maximumZoomScale = 2.0;
self.expimg.minimumZoomScale = 0.1;
self.expimg.clipsToBounds = YES;
self.expimg.delegate = self;
[self.expimg setContentSize:self.mi.frame.size];
[self.expimg addSubview: self.mi];
[self.view addSubview: self.expimg];
Thanks!
Edit: mi is a UIImageView and expimg is a UIScrollView (used interface builder). Also, viewForZoomingInScrollView is defined.
You should be able to do this by adjusting the position and size of the image and scroll view on initial load, and as zoom levels change. Make a method that is called on viewDidLoad, and again on the UIScrollViewDelegate method scrollViewDidZoom:.
Something like this should work (where imageView and scrollView are class attributes):
- (void)centerImage {
CGSize screenSize = CGSizeMake(320, 480);
CGSize imageSize = imageView.frame.size;
imageSize.width = imageSize.width * scrollView.zoomScale;
imageSize.height = imageSize.height * scrollView.zoomScale;
CGSize scrollSize = scrollView.frame.size;
CGFloat centerX;
CGFloat centerY;
CGFloat left;
CGFloat top;
if (imageSize.width > screenSize.width) {
scrollSize.width = imageSize.width;
centerX = imageSize.width/2;
left = 0;
} else {
scrollSize.width = screenSize.width;
centerX = screenSize.width/2;
left = centerX - imageSize.width/2;
}
if (imageSize.height > screenSize.height) {
scrollSize.height = imageSize.height;
centerY = imageSize.height/2;
top = 0;
} else {
scrollSize.height = screenSize.height;
centerY = screenSize.width/2;
top = centerY - imageSize.height/2;
}
CGRect scrollFrame = scrollView.frame;
scrollFrame.size = scrollSize;
scrollView.frame = scrollFrame;
CGRect imageFrame = imageView.frame;
imageFrame.origin = CGPointMake(left, top);
scrollView.contentOffset = CGPointMake(centerX-(imageSize.width/2), centerY-(imageSize.height/2));
}
I have not tested this, so some of my math could be wrong. Either way, it will hopefully give you a good idea of what to do.
Step 1: You create an image view property then init it at viewDidLoad and add to scrollView:
self.pictureImage = [[UIImageView alloc]initWithImage:self.picture];
[_scrollView addSubview:_pictureImage];
self.pictureImage.alpha = 0;
_scrollView.delegate = self;
Step 2: Create adjustZoomScale function to get minimum scale
- (CGFloat)adjustZoomScale{
CGFloat scale = self.scrollView.bounds.size.width / self.pictureImage.bounds.size.width;
CGFloat h = scale * self.pictureImage.bounds.size.height;
if (h > self.scrollView.bounds.size.height) {
scale = self.scrollView.bounds.size.height / self.pictureImage.bounds.size.height;
}
return scale;
}
Step 3: Because frame of scroll view will be updated at viewDidAppear so we need to adjust zoom scale here. And set alpha to make image appear smoother:
- (void)viewDidAppear:(BOOL)animated {
[super viewDidAppear: animated];
_scrollView.maximumZoomScale = 1.0;
_scrollView.minimumZoomScale = [self adjustZoomScale];
[_scrollView setZoomScale:_scrollView.minimumZoomScale];
self.pictureImage.alpha = 1;
}
Step 4: Implement viewForZoomingInScrollView (scroll delegate method) and return image view
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView{
return self.pictureImage;
}
Step 5: Implement scrollViewDidZoom (scroll delegate method) and adjust point for image view
- (void)scrollViewDidZoom: (UIScrollView*) scrollView {
CGSize boundsSize = scrollView.bounds.size;
CGRect contentsFrame = _pictureImage.frame;
if (contentsFrame.size.width < boundsSize.width) {
contentsFrame.origin.x = (boundsSize.width - contentsFrame.size.width) / 2.0;
} else {
contentsFrame.origin.x = 0.0;
}
if (contentsFrame.size.height < boundsSize.height) {
contentsFrame.origin.y = (boundsSize.height - contentsFrame.size.height) / 2.0;
} else {
contentsFrame.origin.y = 0.0;
}
_pictureImage.frame = contentsFrame;
}
Thank shawhu at this post for point adjusting for image view while zooming
[scrollView zoomToRect:CGRectMake(x, y, width, height) animated:YES]; will work for you...
Where rect should have those center coordinates as origin.