Nantes Mobi Parkings – ActionBarSherlock – Episode 3
Cet article est le troisième de la série sur l’application Nantes Mobi Parkings. Pour rappel, l’épisode #1 présentait le projet dans sa globalité. L’épisode #2 s’est concentré sur l’intégration technique d’une carte OpenStreetMap sur Android. Dans ce troisième article, je vous propose d’étudier (sous la forme d’un tutoriel) un autre aspect technique du projet : l’utilisation d’une ActionBar, compatible avec l’ensemble des terminaux Android disponibles sur le marché.
“Action Bar” quezako ?
Pour ceux qui ne connaissent pas bien Android, commençons par une petite description de l’Action Bar. C’est un composant graphique essentiel des applications Android, qui apparaît en haut de chaque écran, sous la barre de notification. Il permet notamment de donner une identité visuelle à l’application (icône et nom). Ainsi, l’utilisateur pourra l’identifierd’un seul coup d’œil.
Mais j’ai un vieux téléphone, pas le Nexus 7 en Android 4.1 !
Le mécanisme d’ActionBar est disponible dans le SDK Android officiel, depuis la version 3.x d’Android (avec des améliorations importantes dans la version 4.x). Comme vous le savez sans doute, la fragmentation d’Android est assez forte (et la tendance n’est pas encore prête de s’inverser – avec encore 64% de téléphone avec la version 2.3 d’Android). La question que l’on se pose naturellement est le support de ce pattern d’interface graphique sur des versions antérieures… J’exclus volontairement de réaliser plusieurs versions de la même application pour différentes versions d’Android – les applications Google “officielles” ne semblant pas suivre cette voie. Google a évidemment bien compris ce problème et met à notre disposition, sur son site dédié à Android, une bibliothèque de compatibilité qui permet de proposer une implémentation limitée de certains composants (ActionBar, Fragments, AsyncTaskLoader…) . Mais comme je l’ai déjà indiqué, l’ActionBar d’Android 3.x n’est pas exactement la même que celle de la version 4.x… Bref, Google propose des outils mais ne règle pas vraiment le problème…
ActionBarSherlock, vient à mon secours !
Jake Wharton – appelons le “Sherlock” – s’est donc posé une question simple : est-il possible de proposer la toute dernière version de l’ActionBar sur des versions antérieures d’Android (et donc sur les branches 3.x mais aussi 2.x) en proposant la même API et les mêmes fonctionnalités. La stratégie de Jake Wharton a été plutôt simple : utiliser le code source mis à disposition sur le projet Android Open Source Project (AOSP) et faire les modifications nécessaires pour le faire fonctionner sur des versions antérieures ! Pour résumer ActionBarSherlock (ABS), c’est :
- l’API “standard” de l’ActionBar sur n’importe quelle version d’Android ;
- l’implémentation native sur Android 4.x – il se comporte alors simplement comme une simple wrapper ;
- une implémentation dédiée pour toutes les versions antérieures (c-a-d même avec Android 3.x) – en utilisant une version largement modifiée par rapport à ce qui est disponible dans le projet AOSP
A titre d’information, le projet ActionBarSherlock est assez actif : il fait notamment partie du TOP 5 des projets les plus surveillés sur GitHub. Parmi leurs références, on peut citer l’application Android Foursquare… et Nantes Mobi Parking 🙂
Petite mise en pratique
Quelques prérequis…
Pour la mise en pratique, je suppose que vous avez :
- Installer un JDK 1.6 + Eclipse 4.2 (Java Edition) ;
- Ajouter le plugin Android ADT 20.x pour Eclipse ;
- Télécharger le SDK Android ;
- Télécharger la plateforme Android 4.0.3 (API 15) et Android 2.2 (API 8)
- Créer un émulateur (AVD) pour chacune des deux plateformes
Si ce n’est pas le cas, je vous invite à le faire avant de poursuivre 🙂
Récupération d’ActionBarSherlock
Se rendre sur la page suivante et récupérer la dernière version de ActionBarSherlock. L’archive téléchargée contient les sources de cette librairie. En effet, les outils de compilation d’Android supportent assez mal les systèmes de packaging (et ne me parlez pas de Maven et de ces apklib :). 1. Il faut donc importer ce projet dans Eclipse comme un projet Android standard : File > New > Android Project From Existing Code 2. Sélectionner uniquement le répertoire “library” pour importer simplement la librairie (sans ses exemples). 3. Supprimer le répertoire libs/, puis dans le menu contextuel choisir Android > Add. 4. Il faut ensuite vérifier certains paramètres dans les propriétés du projet :
- Dans la section Android, l’option Build Target doit avoir la valeur Android 4.0.3 ;
- Toujours dans la section Android, l’option Is Library doit être cochée ;
- Dans la section Java Compiler, l’option compiler compliance level doit être à 1.6
Intégration dans une application
Afin de rapidement prendre en main ABS, je vous propose de créer un nouveau projet d’exemple afin de recevoir nos différents tests ! 1.* File > New > Android Application Project*puis mettre les options suivantes :
- Application Name : Ippon ABS Test
- Build SDK : Android 4.0.3 (API 15)
- Minimum Required SDK : API 8 : Android 2.2
- Décocher Create custom launcher icon et cliquer sur *Next. *3. Choisir Blank Activity et ne rien changer sur les valeurs par défaut ensuite. Vous pouvez ensuite lancer l’application d’exemple sur un émulateur Android 2.2 et un émulateur Android 4.0.3. Vous pourrez observer que si l’application fonctionne bien sur les deux plateformes, elle ne profite que de l’ActionBar que sous la version 4.0.3 d’Android. Sur un terminal Android 2.2, seul le titre de l’application s’affiche en haut de l’écran et les “actions” ne sont accessibles que par l’utilisation de la touche physique “Menu”.
[![](/content/images/2012/08/android_22.png "Application sur Android 2.2")](/content/images/2012/08/android_22.png)Application sur Android 2.2
| [![](/content/images/2012/08/android_403_hardware.png "Application sur Android 4 (avec boutons natifs)")](/content/images/2012/08/android_403_hardware.png)Application sur Android 4 (avec boutons natifs)
| [![](/content/images/2012/08/android_403_overflow.png "Application sur Android 4 (sans boutons natifs)")](/content/images/2012/08/android_403_overflow.png)Application sur Android 4 (sans boutons natifs)
|
- Dans la classe MainActivity, remplacer
public class MainActivity extends <strong>Activity</strong> {
parpublic class MainActivity extends <strong>SherlockActivity</strong> {
- Remplacer l’import de
import <strong>android.view.Menu</strong>;
parimport <strong>com.actionbarsherlock.view.Menu</strong>;
- Remplacer également
<strong>getMenuInflater</strong>()
par<strong>getSupportMenuInflater</strong>()
- Supprimer également les répertoires values-v11 et values-v14
- Dans values/styles.xml, remplacer
<style name="AppTheme" parent="<strong>android:Theme.Light</strong>" />
par<style name="AppTheme" parent="<strong>Theme.Sherlock.Light.DarkActionBar.ForceOverflow</strong>" />
NB: L’utilisation du thème avec le suffixe “ForceOverflow” indique que l’on souhaite forcer l’affichage du bouton portant 3 points verticaux (et cela même si le smartphone dispose d’une touche physique menu) Une fois ces modifications effectuées, vous pouvez à nouveau lancer le projet dans votre émulateur Android 2.2 (API 8). Vous obtiendrez alors l’affichage de votre ActionBar sur l’écran :
[![Application avec ActionBarSherlock (sous Android 2.2)](/content/images/2012/08/abs.png "Application avec ActionBarSherlock (sous Android 2.2)")](/content/images/2012/08/abs.png)Application avec ActionBarSherlock (sous Android 2.2)
|
[![Obtenir l'application Nantes Mobi Parkings sur Google Play](http://www.android.com/images/brand/get_it_on_play_logo_large.png "Obtenir l'application Nantes Mobi Parkings sur Google Play")](http://play.google.com/store/apps/details?id=fr.ippon.android.opendata.android)Obtenir l’application Nantes Mobi Parkings sur Google Play
| [![Forker le projet Nantes Mobi Parkings sur GitHub](https://raw.github.com/github/media/master/logos/github_logo_social_coding_outlined.png "Forker le projet Nantes Mobi Parkings sur GitHub")](https://github.com/ippontech/nantes-mobi-parkings)Forker le projet Nantes Mobi Parkings sur GitHub
|