JQuery Mobile en Android

JQuery is waarschijnlijk de meest populaire en meest gebruikte javascript toolkit vandaag de dag. Ik gebruik de toolkit zelf regelmatig voor verschillende web-applicaties, zelfs voor mobiele websites.

Dit werkt goed genoeg, maar ook al doen hedendaagse mobiele (WebKit based) browsers niet onder voor hun desktop variant, qua presentatie en besturing merk je toch dat een mobiel device speciale eisen stelt aan de user interface.

Ik was dan ook enorm enthousiast toen Jon Resig op 11 augustus aankondigde dat er een JQuery Mobile zou komen. Al wist ik niet precies wat ik er van moest verwachten, in ging er vanuit dat jquery gewoon nog wat lekkerder op Android zou werken dan het al deed, met name qua user interface.

Nu is sinds een week of twee een eerste alpha release beschikbaar, en ik ben daar dus ook meteen mee aan de slag gegaan, en wel door een simpele BMI / Propoints calculator te bouwen voor Android. Android applicaties zijn namelijk razendsnel te prototypen en te bouwen door ze in HTML/Javascript te bouwen en vervolgens in een Android applicatie in een WebView te laden. Voorheen gebruikte ik hier de "normale" JQuery / JQueryUI voor.

Een aantal observaties over de huidige JQuery Mobile Alpha:


  • Layout is nog niet optimaal. Als je de aanbevolen layouts gebruikt, wordt content niet optimaal weergegeven: labels en input velden komen niet naast elkaar te staan (al zegt de documentatie dat dit wel moet gebeuren als het scherm breed genoeg is).

  • Er wordt een (naar mijn mening) onnodige scheidingslijn tussen controls getoond.

  • Chrome lijkt nog niet het keyboard aan te passen aan een "number" input type.

  • Er lijkt geen rekening gehouden te worden met de size van een input veld. Ze zijn hierdoor onnodig breed, en passen eigenlijk niet goed op het scherm.

  • (Fixed) positioning en scrolling werkt nog niet altijd even goed in iedere situatie

  • De look is iPhone-ish. Het zou leuk zijn als je een android / iphone theme kan selecteren.


Al met al zullen de meeste issues  denk ik met een volgende release grotendeels verdwijnen.

De JQuery Mobile toolkit is volledig op HTML5 concepten gebouwd, maar zou moeten werken in alle HTML capable browsers. JQuery Mobile gebruikt "progressive enhancement", als een browser meer features ondersteunt dan worden deze gebruikt.

Het is mogelijk om meerdere losse pages in een enkele HTML pagina op te nemen en hiernaar te verwijzen/springen zonder page reloads, met sjieke transities bij het schakelen tussen deze interne pagina's. Een aantal basiscontrols zijn aanwezig, maar complexere controls zoals tabs en auto complete zijn nog niet beschikbaar.

Samengevat, met enige moeite is het goed mogelijk al een hele aardige applicatie te bouwen met JQuery Mobile, maar er is een hoop (visueel) detail wat nog aandacht vereist. Ik ga er vanuit dat hier nog heel veel verbetering zal plaatsvinden, en iedere nieuwe release zal ik volgen met een nieuwe release van Propoca.

Last updated 19 april 2013 10:11 | filed under android
comments powered by Disqus