Application Android Interface utilisateur

Nous avons choisi de concevoir une interface simple pour l'affichage. L'application affiche tout d'abord un menu principal, dans lequel l'utilisateur peut, via des boutons, lancer le contrôle, ou modifier les paramètres de connexion. Le menu de paramètres permet de modifier l'adresse de connexion vers le serveur, ainsi que le port de connexion. L'interface de contrôle de l'hélicostat sera composée de deux joysticks, avec lesquels l'utilisateur pourra diriger l'hélicostat.


Menu principal


Menu Paramètres


Ecran de contrôle de l'hélicostat (gauche : direction, droite : gaz)

Chacun de ces menus est contrôlé par une activité, qui permet de déterminer un comportement pour chacun des éléments de l'interface. De plus, l'activité doit elle-même appeler et afficher le layout du menu correspondant.

Voici le contrôleur du menu principal. Cette activité est déclaré dans le AndroidManifest comme étant l'activité de lancement. Ce sera donc celle ci qui se lancera en premier.
Tout d'abord, nous créons deux variables Button, qui permettrons de stocker les boutons du menu après sa création, afin de pouvoir modifier leur comportement par la suite.
Une activité débute toujours par la méthode onCreate(), nous utilisons donc cette méthode afin de paramétrer l'ensemble du menu. D'abord, elle affiche le fichier XML du menu , le layout activity_main à l'aide de la fonction setContentView(). Puis, on récupère chacun des boutons du menu via la classe R, qui est une classe auto généré par Eclipse, et qui permet d'accéder très simplement à chaque élément créé de l'interface via un id. Avec la méthode findViewById(), il suffit alors de donner l'id d'un élément pour récupérer la View associé, et ainsi pouvoir accéder à toutes ces méthodes.
Ensuite, on configure l’évènement onClick() pour chaque bouton, en appelant la méthode setOnClickListener(). On créé alors un nouvel objet OnClickListener(), auquel on modifie son évènement onClick(), afin de démarrer une activité voulue dès que l'utilisateur appuie sur le bouton.

Le contrôleur du menu Paramètres est similaire au précédent pour le démarrage.
Cependant, nous stockons également une variable EditText, afin d'accéder à l’élément permettant à l'utilisateur d'entrer l'adresse.
Ici, nous affichons, via la méthode setText() de l'EditText, dans la barre de texte permettant d'entrer l'adresse du serveur, l'adresse déjà défini dans notre application.
Nous avons choisi de ne pas enregistrer directement chacune des entrées de l'utilisateur dans cette barre. Nous souhaitons laisser à l'utilisateur la possibilité d'annuler ces modifications, simplement en appuyant sur le bouton Retour du smartphone. Pour enregistrer, l'utilisateur doit cliquer sur le bouton Enregistrer. Nous avons défini le onClick() de ce bouton de manière similaire à ceux du menu, excepté que le bouton envoie ici le contenu de la barre de texte dans l'application, que l'on récupère via un getText(), afin de modifier l'adresse. Puis, il relance le menu principal.

Ce contrôleur est très particulier, puisqu'il ne fait qu'afficher le layout et lancer la connexion avec le serveur. En effet, nous n'avons pas besoin de paramétrer les joysticks dans ce contrôleur. Toutes modifications de ces éléments se feront dans une classe métier dédiée à eux.

menu_principal.png (6.81 KB) Nicolas Develet, 03/22/2015 09:32 PM

menu_parametres.png (10.8 KB) Nicolas Develet, 03/22/2015 09:33 PM

ecran_controle.png (8.17 KB) Nicolas Develet, 03/22/2015 09:33 PM

controleur_menu.png (30.3 KB) Nicolas Develet, 03/23/2015 06:39 PM

controleur_parametres.png (22.9 KB) Nicolas Develet, 03/23/2015 06:39 PM

controleur_soloWindow.png (6.39 KB) Nicolas Develet, 03/23/2015 06:39 PM