Formation. Développement mobile. Bastien Stephan. Page 0

Transcription

1 Formation Développement mobile Bastien Stephan Page 0

2 Table des matières Introduction...2 Prérequis...2 Installation...2 Création de l application... 3 Interface...4 Codage...5 Page 1

3 Introduction Afin de réaliser notre formation, nous aurons besoin de l IDE (Environnement de développement) Android Studio. Développé par Google en 2014, Android Studio permet principalement d'éditer les fichiers Java, XML et les fichiers de configuration d'une application Android. Prérequis Afin de commencer la formation il nous faut installerandroid Studio, vous trouverez l exécutable («android-studio-bundle windows.exe») dans le dossier de formation. Installation Commencez par exécuter le fichier «android-studio-bundle windows.exe» Cliquez sur «Next>», laissez toutes les configurations par défaut pour chaque page. Page 2

4 Si l exécutable ne trouve pas le JDK (Java Development kit), vous devez l installer. Il se trouve dans le dossier formation «jdk-7u75-windowsx64.exe». Création de l application Nous allons pouvoir lancer l IDE. Patientez pendant que le programme se met à jour. Une fois terminé, une fenêtre s ouvre, cliquez sur «Start a new Android Studio project». Appelez le projet «BST_Formation». Gardez le SDK par défaut (API 15 : Android (IceCreamSandwich). Dans la fenêtre suivante, choisissez BlankActivity. Laissez par défaut le nom des fichiers, puis cliquez sur «Finish». Page 3

5 Interface Formation Développement mobile Commençons par supprimer le libellé «Hello World!» généré automatiquement à la création d un nouveau projet d application. On peut aussi bien le faire dans la partie graphique (design) du fichier activity_main.xml que dans la partie texte (ligne de code), la partie graphique nous permet de gagner du temps en faisant glisser les différentswidgets mis à notre disposition par android studio. Ensuite, nous devons passer notre application en mode linéaire, dans la partie Text, remplacez «RelativeLayout» par «LinearLayout». Le LinearLayout est un Layout qui repose sur une idée de boite : les widgets appartenant à ce Layout sont alignés en ligne horizontale ou verticale. Dans notre cas, ce sera vertical. Il faut donc ajouter : «android:orientation="vertical"» Il faut ensuite ajouter les différents widgets dont nous aurons besoin. Ici nous cherchons à créer une application qui permettra d ajouter ou soustraire deux chiffres (ou nombre). Passez en paramètre grâce à deux TextField. Lettre Widget Text id A Medium Premier Lbl1 Text Nombre B Plain Text / TF1 C Medium Deuxième Lbl2 Text Nombre D Plain Text / TF2 E* Large Text / LblResultat F Small Button + buttonajo uter G Small Button - buttonsou straire *Pour le Text, il faut cliquer sur les puis «new Ressource» «New String Value». Puis dans Ressource name entrer : emptystring Car la valeur de ce widget sera vide au lancement de l application. Pour les boutons, il faut préciser l action à faire quand l utilisateur clique sur le bouton. Dans les properties, sur la propriété «onclick» on rentre «onbuttonclick», qui sera notre méthode. Page 4

6 Codage Après avoir fait la partie «graphique» avec les différents widgets dont nous aurons besoin, nous allons écrire la méthode onbuttonclick(), qui ajoutera ou supprimera les deux chiffres rentrés en paramètres. Allez dans l onglet MainActivity.java, après la méthode «protectedvoidoncreate(bundle savedinstancestate)», nous allons écrire notre méthode qui aura en paramètre une View v «public void onbuttonclick(view v)» La classe view n est pas importée, faitesalt+entrer pour que l IDE l ajoute automatiquement. Nous allons créer deux objetsedittext qui viennent prendre la valeur des TextField : EditTextpremiernb = (EditText)findViewById(R.id.TF1); EditTextdeuxiemenb = (EditText)findViewById(R.id.TF2); Nous allons maintenant créer une TextView(label) qui prend le résultat contenu dans «LblResultat» : TextViewResultatTV = (TextView)findViewById(R.id.LblResultat); Ensuite, nous allons créer trois réels qui vont pouvoir effectuer les calculs, et instancier résultat à 0 : double num1,num2,resultat; resultat = 0; Num1 et num2 prennent la valeur de premiernb et deuxiemenb : num1 = Double.parseDouble(premiernb.getText().toString()); num2 = Double.parseDouble(premiernb.getText().toString()); Page 5

7 Nous allons ensuite créer 2 fonctions if qui nous permettront de savoir sur quel bouton a cliqué l utilisateur. if (v.getid() == R.id.buttonAjouter) resultat = num1 + num2; if (v.getid() == R.id.buttonSoustraire) resultat = num1 - num2; Pour finir, on rentre le résultat dans la TextViewResultatTV : ResultatTV.setText(resultat+""); Test de l application. Cliquez sur «Run app». Page 6

8 Si vous avez un smartphoneandroid, choisissez le dans la liste «Choose a running device». Sinon, choisissez l émulateur. Page 7