I just finished a quick tutorial over how to use UIScrollViews and how to implement pinching and zooming for them. The video has been uploaded, but it isn't fully finished converting on vimeo.com yet. I've sent Chris a PM, so hopefully this info will be in the main tutorial section soon.
Great little tutorial. Any chance you know how to control UIScrollView similar to safari in that:
1) When a zoom is done the content view is redrawn sharply. From what i've done so far with UIScrollView it simply adjusts the transform property of the content view and so text gets blurry. I'd like to zoom an image that i annotate with text/lines etc so blurred is no good.
2) Have a checker board pattern in areas that havent been rendered yet. I doubt that safari creates an image that is the complete size of the page at the zoom level you have selected - plus when you zoom the checkerboard pattern remains the same scale. My view is going to be pretty big so maintaining a view of all the data probably won't perform so well.
In my own attempts at solving issue 1 i have tried setting the transform back to scale factor of 1 in the scrollViewDidEndZooming delegate and then handling the scale factor myself in the drawing for the view. This almost works but next time i start zooming it seems like UIScrollView uses a cached image from the last zoom which looks bad and you lose all idea of where you were zoomed to before.
Any help on these issues would be much appreciated
To answer question 1, I think that the content that Safari is displaying is far larger in resolution than the screen of the iphone could ever support natively. My initial thought is that instead of zooming in on an image that's already full size, you're actually zooming in on an image that has been scaled down. That's why the sharpness comes back.
And as far as question 2 goes, I don't have a clue. With the way that I showed in the tutorial, the entire image is loaded at one time. I've not dealt with anything large enough to require partial loading.
Thanks for the tutorial. If I set the minimumZoomScale to 0.25 in the sample code and then pinch the view down all the way, after the zoom is finished the image moves itself to the top left corner of the scrollview.
1) You need to have your own method for drawing the content sharply at different scales. In your scrollViewDidEndZooming: callback you note the scale, set the transform to identity, setNeedsDisplay, and when your content is drawn you draw it sharply at the current scale. As an example, if you were drawing text you would scale the fontsize and draw at the new fontsize.
2) I think you want the checkerboard to be a view that is behind your content view. It doesn't get scaled and always draws the checkboard the same.
Also if you set the background color of the scrollview to redcolor or groupTableViewBackgroundColor you'll see that these colors and patterns are revealed when the content view gets small. I think it's possible to set up a pattern like the checkerboard as a cgcolor and set the background color of the scrollview to that, if that's what you meant.
Last edited by PhoneyDeveloper; 09-25-2008 at 05:05 PM.