November 08, 2007

Flick interfaces

I'm going to experiment with bring the 'flick' scrolling to one of my interfaces. Meaning that the user could click-drag then the area would continue to scroll along that vector for a certain time until slowly easing to a stop. The iPhone does this in all of it's scrolling areas.

First I can put aside the vector math, which is relative pretty simple anyway, by constraining to just left/right or up/down. The one variable is then speed, which is the size of the original click-drag move divided the amount of time of the click. So a fast wide click is very fast, while as short and long click would move relatively slowly.

So what is the best algorithm to compute the distance to travel starting with a given speed (or velocity) which tails off slowly towards the end? Exponential decay? Something parabolic to model along the lines of skipping stones?

Eric? Landon? ;-)

Posted by jherr at November 8, 2007 12:02 PM
Comments

Tweener would work well for you:
http://code.google.com/p/tweener/

They have a TON of different algorithms, and it's really easy to switch them out, depending on what you like best.

(You could even do a user preferences, "Flick Friction")

Posted by: hatsix at November 8, 2007 01:22 PM

This is definitely a cool library. It will definitely help in what I want to do. But do you know of anything that implements iPhone style flick scrolling in Flash or Flex? Basically a scrolling canvas that scrolls the same way Google Maps does (by clicking and dragging) that has the inertial throw mechanism.

Posted by: jherr at November 8, 2007 07:42 PM

Ok, I think I found it:

http://blog.voq.jp/2007/09/scrolling-component-likes-ipho.html

Man, I love the Google.

Posted by: jherr at November 8, 2007 07:53 PM
Post a comment

Thanks for signing in, . Now you can comment. (sign out)

(If you haven't left a comment here before, you may need to be approved by the site owner before your comment will appear. Until then, it won't appear on the entry. Thanks for waiting.)


Remember me?