How do I enable zooming in a UIScrollView
?
4 Answers
Answer is here:
A scroll view also handles zooming and panning of content. As the user makes a pinch-in or pinch-out gesture, the scroll view adjusts the offset and the scale of the content. When the gesture ends, the object managing the content view should update subviews of the content as necessary. (Note that the gesture can end and a finger could still be down.) While the gesture is in progress, the scroll view does not send any tracking calls to the subview.
The UIScrollView class can have a delegate that must adopt the UIScrollViewDelegate protocol. For zooming and panning to work, the delegate must implement both viewForZoomingInScrollView: and scrollViewDidEndZooming:withView:atScale:; in addition, the maximum (maximumZoomScale) and minimum (minimumZoomScale) zoom scale must be different.
So:
- You need a delegate that implements
UIScrollViewDelegate
and is set todelegate
on yourUIScrollView
instance - On your delegate you have to implement one method:
viewForZoomingInScrollView:
(which must return the content view you're interested in zooming). You can also implementscrollViewDidEndZooming:withView:atScale:
optionally. - On your
UIScrollView
instance, you have to set theminimumZoomScale
and themaximumZoomScale
to be different (they are 1.0 by default).
Note: The interesting thing about this is what if you want to break zooming. Is it enough to return nil
in the viewForZooming...
method? It does break zooming, but some of the gestures will be messed up (for two fingers). Therefore, to break zooming you should set the min and max zoom scale to 1.0.
-
18Excellent answer -- this got me exactly what I needed. (Plus, I didn't have to go watch a video! ;)– OlieCommented Jul 4, 2011 at 18:56
-
1thanks. most important thing is the second step here, which isn't found in the original answer– gchbibCommented Oct 4, 2012 at 19:14
-
1
-
1There's also a very good tutorial at appcoda.com/uiscrollview-introduction describing how to set the min and max zoom levels programatically, zoom by tapping, etc. Commented Mar 1, 2016 at 10:58
-
I don't understand why these controls do not come with all functionality– DuckCommented Sep 12, 2020 at 7:47
Have a read through this Ray Wenderlich tutorial:
http://www.raywenderlich.com/76436/use-uiscrollview-scroll-zoom-content-swift
If you follow through the section 'Scrolling and Zooming a Larger Image' it will get a image up and enable you to pinch and zoom.
In case the link gets altered, here's the main info: Put this code in your view controller (this sets the main functionality):
override func viewDidLoad() {
super.viewDidLoad()
// 1
let image = UIImage(named: "photo1.png")!
imageView = UIImageView(image: image)
imageView.frame = CGRect(origin: CGPoint(x: 0, y: 0), size:image.size)
scrollView.addSubview(imageView)
// 2
scrollView.contentSize = image.size
// 3
var doubleTapRecognizer = UITapGestureRecognizer(target: self, action: "scrollViewDoubleTapped:")
doubleTapRecognizer.numberOfTapsRequired = 2
doubleTapRecognizer.numberOfTouchesRequired = 1
scrollView.addGestureRecognizer(doubleTapRecognizer)
// 4
let scrollViewFrame = scrollView.frame
let scaleWidth = scrollViewFrame.size.width / scrollView.contentSize.width
let scaleHeight = scrollViewFrame.size.height / scrollView.contentSize.height
let minScale = min(scaleWidth, scaleHeight);
scrollView.minimumZoomScale = minScale;
// 5
scrollView.maximumZoomScale = 1.0
scrollView.zoomScale = minScale;
// 6
centerScrollViewContents()
}
Add this to the class:
func centerScrollViewContents() {
let boundsSize = scrollView.bounds.size
var contentsFrame = imageView.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
}
imageView.frame = contentsFrame
}
And then this if you want the double tap gesture to be recognised:
func scrollViewDoubleTapped(recognizer: UITapGestureRecognizer) {
// 1
let pointInView = recognizer.locationInView(imageView)
// 2
var newZoomScale = scrollView.zoomScale * 1.5
newZoomScale = min(newZoomScale, scrollView.maximumZoomScale)
// 3
let scrollViewSize = scrollView.bounds.size
let w = scrollViewSize.width / newZoomScale
let h = scrollViewSize.height / newZoomScale
let x = pointInView.x - (w / 2.0)
let y = pointInView.y - (h / 2.0)
let rectToZoomTo = CGRectMake(x, y, w, h);
// 4
scrollView.zoomToRect(rectToZoomTo, animated: true)
}
If you want more detail read the tutorial, but that pretty much covers it.
-
1Although this is potentially quite a good answer, it is essentially a "link only" answer. You should include some information from your links so that if the information behind the links is ever changed/lost, the answer still makes sense. See this link Commented Nov 9, 2015 at 9:20
Make sure you set your viewController as the scrollViews delegate and implement:
func viewForZooming(in scrollView: UIScrollView) -> UIView? {
return imageView
}
I don't think this is working for iOS 5.0 and Xcode 4.3+ Im looking for the same here, I found this its for images but it may help you.
-
no need to set content size of scrollview and the above solution runs perfect on Xcode 4.3+ and iOS 5.0 also– DeepakCommented Apr 4, 2013 at 8:17
-
1Although this is potentially quite a good answer, it is essentially a "link only" answer. You should include some information from your links so that if the information behind the links is ever changed/lost, the answer still makes sense. See this link Commented Nov 9, 2015 at 9:20