Kinetic Scrolling Demo **Updated** KListControl with source

[dosfan]

Hi

New around these forums..

I've posted a in-progress of a project I'm working on. It's a kinetic scroller (you know that flick scroll effect). Remember this is a demo it doesn't actually do anything useful apart from amuse me!

Not as fluid/cool as iContact, but it's my first PPC application. The grand plan is to turn it into a library based MP3 player with a decent looking interface.

It's written in CF .NET so if you really need the source reflection is your friend.

Tested on a WM6 blueangel device @ 400Mhz. Runs in the WM2003 emulator

----

I've updated with source. No license, do whatever you want with it. Although a mention somewhere would be nice ;)

Chad get this media player out the door now!

-------
New optimized demo released, source now updated.
Removing old source as the file name is confusing.

Thanks for all the comments.
-------------------------------------------------
**************************************
UPDATE:
gingercat has done some fantastic work loosely based on the original source and created a user control. Unlike my old code it doesn't use one big bitmap and just better written in every aspect. I'll leave my old source up just for reference as to how /not/ to write a kinetic scroller ;)

[jackbnymbl]

I can't try it right now because I don't have my device, but it's nice to know that at least a few people still support WM2003/SE...

[nothin]

I can't try it right now because I don't have my device, but it's nice to know that at least a few people still support WM2003/SE...

...especially on wizard..

[thundershadow14]

LOVELY! Why don't we work together to bring your scrolling routine, into my existing mp3 player "Melody". I've got playback and that sort of thing sorted out. Please PM me if you're interested.

[neptune]

anyone care to post a vid plz

[salahnajm]

slow scrolling and not as responsive as other scrolling software out there... but the idea is there :D ... i would also love to see smtg similar implemented in chad's media player (just my simple opinion)...

[dosfan]

LOVELY! Why don't we work together to bring your scrolling routine, into my existing mp3 player "Melody". I've got playback and that sort of thing sorted out. Please PM me if you're interested.

Thanks for the offer! This is a hobby project and I'd like to work on my own.

However I'm now going to release the source so you can use it..

[thundershadow14]

Kinetic scroller, officially a part of Melody.:

http://forum.xda-developers.com/showthread.php?t=325223

[Leo-X]

Hi
I was just wondering, how long will it take for you to make your product compatible to play Mp3 Songs, because I'm tierd of waiting for a Music Player, which is easy to use and fast. And by the way, I think your player is so far the best, it just has to get a litle better UI!!!

[dosfan]

Well, here I am with release 002 of my kinetic scroller demo.

I've added alot of optimizations and its silky smooth on my 400Mhz device! It even runs great underclocked at 200Mhz.

Source to follow (once its cleaned up, probably tommorrow)

[gingercat]

Thanks for this! Once again shows how it just takes one person to come up with a great idea (apple (or whoever initially came up with smooth scrolling)) then we all wonder how we lived without it!

I've just been reflecting over it and note that you are relying on .NET garbage collection to clean up e.g. all the graphics and brush objects you create - you need to be careful about this because this isn't deterministic and you can quickly run out of resources before it gets round to cleaning up. I know you say you're going to clean up the code anyway, but just thought I'd add my tip!

[gingercat]

The holy grail would be if we can figure out how to hook mouse events, because then mouse movement can be processed independently of the form (and any other items on it). Unfortunately, CE doesn't support this (that I know of). The form approach only works if everything is semi-custom drawn.

[chrismrulz]

This new version scrolls as good as or better than iContact, so you can remove that message on the first post.
on the other hand, the version currently implemented in melody v0.6 doesn't seem as good as this one.

btw, once you upload the new source, i'll see if i can make it stop selecting the first touched item when you are trying to scroll.
when thundershadow and i were making our own one we found the way to do this was to do something like listbox1.selectedindex = -1
it should be pretty easy to do.

also, something like this instead of the random number generator could get a list of the files in the current dir:
string[] r = System.IO.Directory.GetFiles(System.IO.Path.GetDir ectoryName(System.Reflection.Assembly.GetExecuting Assembly().GetName().CodeBase),".mp3");

klist = new KList(0, 20, screenX, screenY, "All Tracks");
for (int i = 0; i < r.Length; i++)
{
KItem ki = new KItem(i + ". " + r[i] + ".mp3");
klist.addItem(ki);
}
dunno if that is accurate or not.. haven't used c# that much.. but it should be easy todo.

[dosfan]

Source is now up.

I've starting playing around with MP3 playback but please ignore it (Using the FMODCE .NET wrapper)

[chrismrulz]

Source is now up.

I've starting playing around with MP3 playback but please ignore it (Using the FMODCE .NET wrapper)
if you're intending on making it a practical-use app,
probably the best way to go about it is using the shell execute function to open the mp3's in whatever player they associated mp3's to (cos people will want features they prefer than other media players).

and then later on you can add an option to customize the command so the user can use it with a different media player without changing the associations.
so they'd have to make something like: "\SD Card\TCPMP\player.exe /open %mp3path%".
then the app just has to replace "%mp3path%" with the variable for the path to the selected mp3, and launch everything before it to shell.

you'd also need to add something like the code in my last post to get a list of the mp3's (tried it on my ppc and it doesn't work, so it needs to be fixed up though).

[dosfan]

if you're intending on making it a practical-use app,
probably the best way to go about it is using the shell execute function to open the mp3's in whatever player they associated mp3's to (cos people will want features they prefer than other media players).

and then later on you can add an option to customize the command so the user can use it with a different media player without changing the associations.
so they'd have to make something like: "\SD Card\TCPMP\player.exe /open %mp3path%".
then the app just has to replace "%mp3path%" with the variable for the path to the selected mp3, and launch everything before it to shell.

you'd also need to add something like the code in my last post to get a list of the mp3's (tried it on my ppc and it doesn't work, so it needs to be fixed up though).

Yes, that something I was already considering.

To be honest, I'm not impressed with FMOD's performance. Even just initalizing the library is causing performance issues (without even playing a MP3, does fmod.init() spawn a thread or something???)

I'm looking for a port of MAD that I could interop with. If anyone knows of a libmad.dll for ARM WINCE point me in the direction!

[chrismrulz]

Yes, that something I was already considering.

To be honest, I'm not impressed with FMOD's performance. Even just initalizing the library is causing performance issues (without even playing a MP3, does fmod.init() spawn a thread or something???)

I'm looking for a port of MAD that I could interop with. If anyone knows of a libmad.dll for ARM WINCE point me in the direction!
afaik, performance-wise fmod would be the best library to use.
but the problem is that most people would rather use their own player like tcpmp or wmp that does what they want,
rather than just a basic player with a third-party library in .net cf.

[gingercat]

Hi dosfan,

I have modified the source to create a new KListControl which is a UserControl you can add to any .NET form. All the scroll functionality required is all contained within the new control.

This control doesn't pre-render everything up-front, so should be less memory hungry (especially with long lists) at the slight expense of some speed (runs fine on my hermes).

Each item is now custom drawn, and only needs to support an IKListItem interface - this enables each item to draw whatever it wants, whenever it wants (well, by nicely asking its parent to invalidate it when visible). I have created a basic KListItem object that supports string name, object value (and has the same functionality you provided).

I also updated the project to still compile with the new source, so (if you like the changes) you can continue work from there.

Updates I will still make are:
Better use of statics incase multiple lists are used (currently the background selection image is static)
Common timer between multiple instances of the control (for performance).

Hope you don't mind my changes!

Chris.

[chrismrulz]

i've just modified gingercat's version to launch the selected mp3 using the windows shell.
to test it out you need to create a directory called "\\SD Card\\My Music", or change the variables in form1 and the klistcontrol to where your music dir is.

if the directory doesn't exist it will browse for mp3 files in the app's directory, then grab the folder of the one selected.
this is not a practical idea, and it won't change the variable in the klistcontrol,
so it wont be able to launch it through shell if you use the browsing method.

a better way would be to make it a folderbrowser dialog instead of a file one,
then make the folder variable in form1 a global variable, and the klistcontrol just grabs it from form1.
that still wouldn't work for subdirectories though.
for that you'd need to tag each klistitem with it's full file path or directory when it's being added.


also it should be pointed out that gingercat's version scrolls a bit too fast.
it's smooth so there aren't any performance issues.
it just goes too far with the tiniest tap up or down.

[mrpotter]

is there any way to capture all mouse events of the system?

[dosfan]

Excellent. All changes/improvements are welcome, thats why the source is out there.

I'm on my way to work at the moment but I'll check them out when I get home. I'll probably update the first post with your improvements guys.

[tene]

Some comment after a quick look, just my 2 cents,

- creating a big backbuffer for all the items -> bad, will crash with long, and eat lot of memory, also it's gonna be slower in most case than redrawing the stuff.
- "using", "using" and "using"! you need to make sure your memory is cleaned. That's even more important with GDI objects.
- KItem should be responsible for drawing itself, this way, using the control for a specific type of data would only require to make a class that inherit from KItem (and KItem should also know about its height, etc...).
- using Graphics.Clip, generally slow
- the prerender approach: doesn't allow dynamic list, adding an element will be very costly.
- it's .NET 2.0, use generic, your list inside KList class should be typed.

[gingercat]

Some comment after a quick look, just my 2 cents,

- creating a big backbuffer for all the items -> bad, will crash with long, and eat lot of memory, also it's gonna be slower in most case than redrawing the stuff.
- "using", "using" and "using"! you need to make sure your memory is cleaned. That's even more important with GDI objects.
- KItem should be responsible for drawing itself, this way, using the control for a specific type of data would only require to make a class that inherit from KItem (and KItem should also know about its height, etc...).
- using Graphics.Clip, generally slow
- the prerender approach: doesn't allow dynamic list, adding an element will be very costly.
- it's .NET 2.0, use generic, your list inside KList class should be typed.

My changes remedy all the above issues with the exception that I only supply bounds to the IKListItem when painting, which potentially denies it the opportunity to render itself up front if necessary.

So, my new TODO list:
Better use of statics incase multiple lists are used (currently the background selection image is static)
Common timer between multiple instances of the control (for performance).
Supply bounds to IKIlistItem to enable pre-rendering optimisation
Vertical / Horizontal / Grid layout modes
Enable different item heights
Improved drag velocity calculation
Separate out "kinetic engine" ready for use in other controls

[gingercat]

is there any way to capture all mouse events of the system?

Some people seem to have managed it, but I don't believe anyone has disclosed how yet :( I guess they must hook into the actual driver dlls rather than the OS itself, but can't be sure. Come on chaps, dish the code!

[dosfan]

gingercat:

Fantastic work!

Is it ok for me to update the first post with your control? I didn't realise your 'changes' were almost a complete rewrite :)

[gingercat]

gingercat:

Fantastic work!

Is it ok for me to update the first post with your control? I didn't realise your 'changes' were almost a complete rewrite :)

Thanks! Feel free to update the first post if you're happy with it - I still consider you the "owner" of the code. I'll probably play with it a bit more tonight - I'd really like to get a new horizontal mode working so I can use it in a photo viewer I'm writing.

[gingercat]

Attached is a zip containing just KListItem.cs and KListControl.cs

New features:
Layouts: vertical (default), horozontal and grid
Items now given their bounds relative to 0,0 enabling up-front rendering where needed

Fixes:
Multiple lists now don't share a common selection bitmap
Problems with multiple items ending up being selected on resize fixed

TODO:
Generic picture rendering KListItem?

[jbrianj]

Ladies and Gentlemen;
I need some help here, I think I am missing something here because once I make a Selection the Application closes. Could be Something I Did, but I'm not sure.

My goal is to write a Kinetic Scrolling Application to Launch Programs, which I will then port to a .dll so it can be included as a today screen plugin. Was there something written in the original code that would close the application once a selecetion is made or is this a problem of my creation?

Any Help would be appreciated.
JBrianJ

[gingercat]

Hi JBrianJ,

I believe the problem is your pinvoke declaration of SHGetShortcutTarget - if you change the second parameter to be of type StringBuilder, it works fine. I don't think the standard string class is being marshalled correctly as it stands. There may be a better way to declare this but I don't know it!

StringBuilder target = new StringBuilder();
String shortcut = item.Value.ToString();
bool Result1 = SHGetShortcutTarget(shortcut, target, 256);
CreateProcess(target.ToString(), "", null);

[DllImport("coredll.dll")]
private static extern bool SHGetShortcutTarget(
String szShortcut, StringBuilder szTarget, int cbMax);


As an aside... in your KListItem, if you change GetIcon to return an icon, you can just create it from the memory stream already in the GetIcon method, because the current implementation can throw access exceptions. Also, if you cache the icon and only obtain it if the member icon is null, it renders MUCH faster!

Nice idea for an app - I was thinking of doing the same with the scroller, but I can't get a home plugin project to work so I gave up! Good luck!

Chris (aka Gingercat).

[gingercat]

... I should also add that I have recently made huge optimisations to the way the KListControl class decides what to render, so I'll post those changes to the thread in a few days. (I'm currently working on a photo viewer using the grid). I've also fixed a load of bugs I added to the control and item classes.

[jbrianj]

GingerCat,
Thanks for the Tip. I was actually planning on caching the Icons once I got the other issues resolved. I noticed the Latency when scrolling already and was thinking that was going to be necessary. I actually almost considered just rendering the entire buffer like the original demo code.

I'll let you know how the project comes out.
Brian

[eightd]

Nice job on this, I wanted to know if anyone has implemented a scrollbar and navigation through the DPAD?

I'm developing an app that is designed for Smartphones and PPCs and it would be great to have both abilities in a one component.

[l3v5y]

Nice job on this, I wanted to know if anyone has implemented a scrollbar and navigation through the DPAD?

I'm developing an app that is designed for Smartphones and PPCs and it would be great to have both abilities in a one component.
I've only just discovered this!

But, so far, I've implemented a system to be able to change where in the item the text is displayed (both vertically and horizontally).

I'm now working on the keypresses! :D

[scilor]

Thank you! this was a little help for me drawing text on a picbox

[lordbein]

hello,

I was wondering if this project will be continued or if it is frozen? This is really interesting but I am hanging with one problem:

I know how to get the index of a selected kitem but how to get the equivalent selected text for it? The header text is also not visible for me??

Is there maybe a source code for a newer version available?

thx
lordbein

[computerjunkie]

I know this is an old thread but if there are updates please respond...THANKS!!!!

[tagazok]

I am also very interested in news about this thread :)

[snobrdinrtiste]

I am also very interested in news about this thread :)

i don't think anyone is working on this project anymore... but check out Fluid...
http://fluid.codeplex.com/

[Skadork]

This may be pretty ignorant, but what exactly is the "grid" layout? Is that what I would use if I wanted to make the entire page scrollable?

[gensenio]

... I should also add that I have recently made huge optimisations to the way the KListControl class decides what to render, so I'll post those changes to the thread in a few days. (I'm currently working on a photo viewer using the grid). I've also fixed a load of bugs I added to the control and item classes.
Hi did you ever have post those changes?

[Qtek8020User]

Any updates available? :D

[Qtek8020User]

Anyway... How do I get Designer Support on this baby?
I assume using the Collection editor will do the trick, but I have no idea how.

Anyone who can guide me onto the right track?

[joe_coolish]

Anyway... How do I get Designer Support on this baby?
I assume using the Collection editor will do the trick, but I have no idea how.

Anyone who can guide me onto the right track?

I've read tons of tutorials and abstracts about how to do kinetic scrolling. I made an open source project called XFControls that does smooth scrolling as well as several other things. in fact, my XDAFacebook application is based on to of XFControls. feel free to check it out and let me know if you have any questions. the link is in my signature (I think. I'm on my phone or else i would post a link)

[Qtek8020User]

I've read tons of tutorials and abstracts about how to do kinetic scrolling. I made an open source project called XFControls that does smooth scrolling as well as several other things. in fact, my XDAFacebook application is based on to of XFControls. feel free to check it out and let me know if you have any questions. the link is in my signature (I think. I'm on my phone or else i would post a link)

Id rather build on this project, since it it very simple, to integrate in my existing projects.
I would like to look at your control, but I'm having a hard time, getting an overview of your project.

Where can I download your project?
http://code.google.com/p/xda-winmo-facebook/source/browse/#svn/trunk/XFSenseUI

Dossent contain any download for XFSenseUI, and seems very scattered.
Do you have an all-nessecery-files-included download for yor control?