Silverlight and "Cover Flow" – Part II
In my last post I talked about the difficulty of implementing a “vanishing point” perspective effect with Silverlight since (currently) it only supports 2D affine transforms.
As a result, most of “Cover Flow” implementations with Silverlight “avoided” perspective.
However, my belief is that if we do that we’ll significantly diminish the Coverflow interface perceptive quality.
How can we then implement such interface, without building a whole 3D engine, and just using the Silverlight affine transforms?
- It can be done with Polygon triangulation and Texture mapping.
If we decompose the polygons (cover artwork in our case) into a set of triangles, and then linearly interpolate its content in accordance with its vertices, we are still using an affine transform and the result is close to a true perspective transform.
(You can obtain a great Textured Triangle Control for Silverlight 2 by Florian Kruesch here).
There’s a catch, however. Because affine texture mapping does not take into account the polygon's vertices depth information it will not look exactly right and we’ll see a noticeable defect. The only way to get around this is by adding more, and smaller, triangles.
But what about the Coverflow interface, how can this affect it visually?
Well, I built one and you can see (and hear) it yourself here: Coverflow.
See you.
Pedro Fortes
Update (2009-02-19): Source code now available here.
PFCoverflow 20090119a public.zip
Comments
Anonymous
January 10, 2009
really interesting work. any chance to get the source code? thank youAnonymous
January 11, 2009
The comment has been removedAnonymous
January 13, 2009
Thanks for the kind feedback :) I don’t want to disappoint you but I’ll post the source code only in late February. There are some reasons behind this, one of those is related to a event that will take place next month. Sorry :(Anonymous
July 07, 2009
The sample and the source code link seem to be broken.Anonymous
July 08, 2009
The source code was re-hosted. The sample is temporary unavailable (I have to check with my ISP).