Sunday, 26 October 2014

Zoom UIImageView in iPhone SDK




UIImageView is a vital control used in every app development, independent of  platform for which app is going to be developed. Recently, one of my colleague faced problem for adding zoom-in and zoom-out image feature in his app. We searched for this and found a nice code snippets zoom image in and out. In this post  I am going to tell you, how can we add zoom-in and zoom-out feature in IOS app development.

Below are the steps for adding zoom-in and zoom-out feature to the app:

1. Add UIScrollView to your xib.
Fig. Adding UIScrollView to xib. 

2. Go to attribute inspector window and set Max and Min value for zoom property. I set it to Min:1 Max:8
Fig. Setting maximum and minimum zoom values


3. Select connection Inspector and connect UIScrollView delegate to file owner, by selecting circle next to delegate and drag it toward File Owner.
Fig. Connecting UIScrollView Delegates with File Owner


4. Create IBoutlet for UIImageView  in viewController.h file.

5. Add UIImageView to your UIScrollView, make sure UIImageView is of same size as of UIScrollView.
Fig. Adding UIImageView to UIScrollView

6. Connect outlets to your UIImageView .

7. Go to viewController.m file and implement delegate for UIScrollView, given below

 -(UIView *) viewForZoomingInScrollView:(UIScrollView *)scrollView
{
    return wallpaperImageView;
}

 
8. Run the app and pan your UIImageView.

Link to download Source Code Zoom Image Source Code

NOTE:- If you are using AutoLayout then your UIScrollView content size may be  zero and above code will not work, so you need to set it programmatically.

2 comments:
Write comments
  1. Great post, clear understanding

    ReplyDelete
  2. thnx for sharing

    ReplyDelete