How to implement pinch to zoom and flick with momentum for a drawing (graph) Core Graphics app? - iphone

In my app, I drew a graph using Core Graphics (inside a view, inside a view). Not a graphing calc app though, it graphs patient data and marks it every six months, and it is larger than the screen, so the user needs to have some way to move around. I was wondering if there is an easy way to implement pinch to zoom, or to flick with momentum. I was planning on just using UITouch to get notified when these actions were performed, but it doesnt really give you a lot of information. For example, all you get with the pinch to zoom is the ratio that they have zoomed, and all you get with the flick is the direction that they have flicked. So, I was just going to implement basic flicks without momentum, and simple pinch to zoom without being able to move around too.
But I figured I would ask here first, to see if anyone has a better idea about how to do this (easily).
EDIT: I found lots of places that tell you how to do this with photos, but none with core graphics or something like that, thanks.

I ended up using a UIScrollView, which implements pinch to zoom, and flick automatically (well, almost).

Related

Can it be done using UIAnimation?

I am developing a game for iPhone and I came across a question whether this can be done using UIAnimation or I have to switch to OpenGL.
If you see the picture above, you can realize there is a rectangle (it will have background image) having many holes in it. User is supposed to touch on holes and initiate the animation. The holes are actually on the image and are not some view. Do you know any article or tutorial I need to read in order to understand this can be done using UIAnimation?
It's more like chess. When you tap a hole, there is a view placed and moved at z-axis and then when you press the other hole, the view is moved to that hole and so on.
I believe it can be done with UIViews too. The holes can be made by using an image with "transparent" holes in it. You can place this UIView on top of a background image(if required). When touches are detected, you can animate another view on top of this view using addSubview:. You can keep this other view outside the screen bounds initially so that the animation seems like a sliding animation.
yes UIView is also an option in your case. if you feel that you will use high quality lots of graphic and will do lots of animation stuff at once on the screen, openGL will be the best or perhaps the gane you are making is a 2d game so you must consider COCOS2D "http://www.cocos2d-iphone.org/" for kick starting your game you'll surely get many effects and other glittering stuff with it. and bes of all it is openGL based..!! Performance will be too high for you..!!
Best of luck..!!

Gestures and usability

I'm currently drawing some mockups of my future iPhone app.
One of the app's functionalities is to display a bar graph showing the evolution of a value over time. Users can perform few gestures on the graph :
swipe/drag to move through time;
pinch to zoom in or zoom out (and therefore display a longer or shorter period of time);
double tap to add a cursor to the graph (i.e. a vertical line with a label on top).
What I'm afraid of is users not noticing these gestures. Of course, I would provide buttons for doing the same tasks, but if users ended up only using those, the interface's usability would not be very great...
Therefore, I am wondering if there is any way to show some visual clues to indicate the presence of gestures on the interface. Do you know any app that does something similar?
I think if you animate mentioned graph behavior it would be a great clue for user to perform this actions by fingers. For example if he(she) choose another date you should move you graph through time smoothly with easyInOut animation. Or if user changed scale you should gradually zoom from scale 1 to scale 2.

OpenGL ES : Revealing underneath view

I am working on a sample in which I have placed two textures one above the other. What I want, whenever user moves his finger on the screen, underneath view should get revealed as he moves. Wiping out front view to reveal underneath view is what I am looking for.
I would like to know some of ideas/ thoughts to implement this feature using OpenGL ES. Any related pointer will be highly appreciated.
Thanks in advance.
This does not sound performance-intensive so simple code can trump complicated tuned operations.
You don't need to use OpenGL. You can simply have two images - front and back - with the front supporting an alpha channel. Each time you get a hit or move, you clear a circular patch whereever the impact is for some certain radius or such.
And then queue-up a redraw. The redraw draws the two bitmaps, back first then front.
If possible, try to queue a redraw for just the the area where you have updated the front since the last draw.

switching images with animation

I'd like to have a static background image (let's imagine a model in underwear), where several images are placed in layers in front of the background. Each image in front can be switched out, from the left or right, with some animation.
So our model might start with a panama hat on her head. A gesture replaces it with a porkpie hat, another gesture places a toque. A dress on her body switches to a pant suit, then mechanic overalls. Cowboy boots to sandals to galoshes, and etc.
It seems there are many ways to do this. I could use UIScrollView, with paging enabled. There is Core Animation, with CALayers on top of the background image. Even simple UIImageViews with swipe gestures enabled, tracking coordinates of the user's finger.
Does one of these techniques stand out as being better than the others in this case? Or does it seem to you readers that each could work as well as the others?
I'd say if you want a prebuild solution try OpenFlow (I'm not affiliated, just a user)
http://apparentlogic.com/openflow/
Otherwise, maybe just a UIScrollView with paging enabled would do the trick?

How can I capture the amount of surface area that the user is making contact with the iPhone screen?

Is there a way to capture the amount of screen that is making contact with the users? I assume there is since this finger painting app shows the ipad responding to only the pixels that the user makes contact with.
Thanks so much in advance for your help!
The size of the touch is abstracted away by the framework, and UITouches only contain calculated (“best estimated”) points instead of the raw, actual areas that were touched. I would guess that the “pressure” was calculated from the duration and the direction of the touch.
In a nutshell, there is no public API to get the contact area.
I don't think Apple provides APIs for the size of the touch, or as #nickthedude said (I think) any kind of way to measure pressure. Basically, you need to implement your own algorithm/policy for determining line thickness/opacity/other effects. I believe a common way to do this is to measure the amount of time spent for the stroke, and work from there. For instance, if the user moved more quickly, you might want a thinner line segment. Apple really should just provide a canvas view of some kind. Best of luck!
to get the exact area you may have to roll your own but you can get uievents pretty easily and then do some magic from there. Basically impliment/override touchesBegan, touchesEnded, touchesMoved on the UIView in question and put in your custom code there.
Looking at the video maybe the amount of touches in the UIEvent set might correspond to the "pressure" of the touch, then again maybe not.
What if you laid down a series of successively smaller square uiviews wherever the user touched then if the touches "spilled" into the larger uiviews behind the smaller front ones than you could conjecture that the touch pressure was harder. Something to try I guess. Good luck.
Why not just describe what you want to do and foxus on asking about that instead - it may not have anything at all to do with the example that has you so otherwise enthralled - I can use a camera to monitor your hand from across the table and paint pixels on the screen via BT, completely ignoring any contact between your fingers and the screen.