PDA

View Full Version : Launcher like Facebook's iPhone app?



swese44
20 Apr 2011, 2:56 PM
Hey all. I'm just getting started with Sencha Touch and it looks awesome. The first app I'm creating will have a launcher almost identical to Facebook's native iPhone app: http://new.three20.info/gfx/samples/launcher1.png

It was extremely simple to replicate the look and feel by adding docked toolbars on the top and bottom, then filling the rest of the space with a horizontal Carousel. I then set the Carousel's HTML to display divs and images floated and padded.


Now this looks exactly how I want it to look on my iPhone simulator, but I'm not sure about 2 things:
1. How do I open a new view when a user taps an image?
2. How do I scale these images so they take up the same percentage of screen area on an Android phone with a different screen resolution?

I might be going about this all wrong, maybe I should be using more Sencha panels instead of HTML for the Carousel content (or does the Carousel only display HTML?).

I'm brand new to Sencha so I'm still wrapping my head around things. Let me know if you'd like to see any of the code I've written so far.

Thanks!

swese44
26 Apr 2011, 8:31 PM
For the launcher, I ended up creating a vbox with 3 nested hboxes. Each hbox has 3 panels, which each contain 2 items - a button followed by an html label. This effectively created the 3x3 table layout just like the Facebook iPhone app, but I'm concerned that this is creating too many dom elements and could hinder performance, especially since there will be multiple 3x3 "tables" displayed in a Carousel and each item will load new views.

Is there a more efficient way of doing this? Thanks!

yang_du
13 Sep 2011, 6:07 AM
Could you share the source code please?