This post originated from an RSS feed registered with Java Buzz
by Fred Grott.
Original Post: Webkit Tricks-Xspot
Feed Title: ShareMe Technologies LLC-The Mobile Future
Feed URL: http://www.jroller.com/shareme/feed/entries/rss
Feed Description: A Weblog about Java programming and digital convergence on mobile devices in such areas as P2P and collaborative technology.
Part of the aspect of designing a web UI for a mobile application targeted for both Android and iPhone is that the webkit versions are different so you start with Android and make ti work and it works on iPhone. The other aspect is layout orientation as we are dealing with 2 touch screen devices in which user will change orientation of the device to reach the keyboard and etc. In iPhones case since no keyboard maybe you switch orientation for other reasons. Lastly, you have a virtual mouse via touch that is not continuous and thus normal mouse over events need to be modified.
Thus you are face with an UI design in which you cannot place a border around all the application edges due to scrolling and because we have a possible device orientation change only the left and right edges get borders. On Android Webkit webview I cannot get divs to fully position to the top of the view and thus here is the design I cam e up with:
Main thing it looks the same in both devices. Next is to figure out which iPhoen javascript tricks work and which ones do not as than I can use the common ones that work to target both devices with one code base.
Previous Topic
