Création d’applications
et découverte d’Android
Intervenant
Mustapha Hain
Une application Android est un assemblage de
composants liés grâce à un fichier de configuration. Nous
allons découvrir chaque pièce de notre puzzle applicatif,
comment le fichier de configuration de l’application la
décrit et comment toutes les pièces interagissent entre elles.
Qu’est-ce qu’une application Android ?
Qu’est-ce qu’une application Android ?
code
images
UI layouts
constants
Arborescence d’un projet Android
*.APK
fichier de configuration
Qu’est-ce qu’une activité Android ?
Activité du
premier plan
Activité
Visible
Activité
d’arrière plan
Processus
sans GUI
Service
Broadcast receivers
Cycle de vie d’une activité
Qu’est-ce qu’une activité Android ?
Qu’est-ce qu’une activité Android ?
Qu’est-ce qu’une activité Android ?
Les vues sont les briques de construction de l’interface
graphique d’une activité Android. Les objets View
représentent des éléments à l’écran qui permettent
d’interagir avec l’utilisateur via un mécanisme d’événements.
Qu’est-ce qu’une Vue Android ?
Qu’est-ce qu’une Vue Android ?
Exemple d’une vue-xml
Les ressources
Les ressources sont des fichiers externes – ne contenant
pas d’instruction – qui sont utilisés par le code et liés à
l’application au moment de sa construction. Android offre
un support d’un grand nombre de fichiers ressources
comme les fichiers images JPEG et PNG, Chaine de
caractères, Son, Vidéo, Couleur, Etc.
Couleurs
Une couleur définit une valeur RVB (rouge, vert et bleu) et
une transparence.
Il existe différents formats dont la syntaxe globale est la suivante :
<color name=nom_couleur>valeur_de_la_couleur</color>
Les différents formats d’une couleur sont les suivants :
• #RGB (Rouge-Vert-Bleu/valeur hexadécimale sur 1 caractère [0,16])
• #ARGB (Alpha (transparence)-Rouge-Vert-Bleu)
• #RRGGBB (Rouge-Vert-Bleu/valeur hexadécimale sur 2 caractères [0,255])
• #AARRGGBB
Unités de mesure
Symbole Unité Description
px Pixels correspond à la taille réelle en pixels
sur l’écran.
in inches (pouces) basé sur la taille physique
de l’écran.
1 inch = 2.54 cm
mm millimètres basé sur la taille physique de
l’écran.
pt points 1/72 de pouce, basé sur la taille
physique de l’écran.
dp density-
independant
pixels :
unité abstraite basée sur la densité
physique de l’écran.
sp scale-
independant
pixels
mis à l’échelle par préférence
utilisateur.
Création d’interfaces utilisateur
De point de vue utilisateur
Le même écran vu
par le développeur
Sous Android, vous pouvez décrire vos interfaces utilisateur de
deux façons différentes :
Directement dans le code Java d’une activité.
avec une description déclarative XML ;
Création d’interfaces utilisateur
TextView T1 = new TextView(this);
setContentView(T1);
T1.setText("Bonjour tout le monde !");
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/T1"
android:text="Texte en haut à droite"
android:gravity="top|right" />
Positionner les vues avec les gabarits
LinearLayout
RelativeLayout
FrameLayout
TableLayout
Positionner les vues avec les gabarits
Peu du code XML
Travaillons ensemble
Atelier 2: deuxième contact avec SDK
Créer une interface utilisateur
La création d’une interface se traduit par deux éléments :
une définition de l’interface utilisateur (gabarits, etc.) de façon
déclarative dans un fichier XML ;
une définition de la logique utilisateur (comportement de
l’interface) dans une classe d’activité.
Cela permet d’avoir une séparation stricte entre la présentation
et la logique fonctionnelle de l’application. De plus, un
intégrateur graphique pourra modifier l’interface sans interférer
avec le code du développeur.
Définition d’interface
Créer une interface utilisateur
Associez votre interface à une activité et définissez la logique utilisateur
import android.app.Activity;
import android.os.Bundle;
public class Main extends Activity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
}
Créer une interface utilisateur
Gérer les événements
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:gravity="center_vertical|center_horizontal" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/monBouton"
android:text="Cliquez ici !" >
</Button>
</LinearLayout>
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Nous cherchons le bouton dans notre interface
((Button)findViewById(R.id.monBouton))
// Nous paramétrons un écouteur sur l’événement ‘click’ de ce bouton
.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
// Nous affichons un message à l’utilisateur
Toast.makeText(Main.this, "Bouton cliqué !", Toast.LENGTH_LONG).show();
} });
}
Gérer les événements
Travaillons ensemble

Création d’applications et découverte d’Android

  • 1.
    Création d’applications et découverted’Android Intervenant Mustapha Hain
  • 2.
    Une application Androidest un assemblage de composants liés grâce à un fichier de configuration. Nous allons découvrir chaque pièce de notre puzzle applicatif, comment le fichier de configuration de l’application la décrit et comment toutes les pièces interagissent entre elles. Qu’est-ce qu’une application Android ?
  • 3.
  • 4.
    code images UI layouts constants Arborescence d’unprojet Android *.APK fichier de configuration
  • 6.
    Qu’est-ce qu’une activitéAndroid ? Activité du premier plan Activité Visible Activité d’arrière plan Processus sans GUI Service Broadcast receivers
  • 7.
    Cycle de vied’une activité Qu’est-ce qu’une activité Android ?
  • 8.
  • 9.
  • 10.
    Les vues sontles briques de construction de l’interface graphique d’une activité Android. Les objets View représentent des éléments à l’écran qui permettent d’interagir avec l’utilisateur via un mécanisme d’événements. Qu’est-ce qu’une Vue Android ?
  • 11.
    Qu’est-ce qu’une VueAndroid ? Exemple d’une vue-xml
  • 12.
    Les ressources Les ressourcessont des fichiers externes – ne contenant pas d’instruction – qui sont utilisés par le code et liés à l’application au moment de sa construction. Android offre un support d’un grand nombre de fichiers ressources comme les fichiers images JPEG et PNG, Chaine de caractères, Son, Vidéo, Couleur, Etc.
  • 13.
    Couleurs Une couleur définitune valeur RVB (rouge, vert et bleu) et une transparence. Il existe différents formats dont la syntaxe globale est la suivante : <color name=nom_couleur>valeur_de_la_couleur</color> Les différents formats d’une couleur sont les suivants : • #RGB (Rouge-Vert-Bleu/valeur hexadécimale sur 1 caractère [0,16]) • #ARGB (Alpha (transparence)-Rouge-Vert-Bleu) • #RRGGBB (Rouge-Vert-Bleu/valeur hexadécimale sur 2 caractères [0,255]) • #AARRGGBB
  • 14.
    Unités de mesure SymboleUnité Description px Pixels correspond à la taille réelle en pixels sur l’écran. in inches (pouces) basé sur la taille physique de l’écran. 1 inch = 2.54 cm mm millimètres basé sur la taille physique de l’écran. pt points 1/72 de pouce, basé sur la taille physique de l’écran. dp density- independant pixels : unité abstraite basée sur la densité physique de l’écran. sp scale- independant pixels mis à l’échelle par préférence utilisateur.
  • 15.
    Création d’interfaces utilisateur Depoint de vue utilisateur Le même écran vu par le développeur
  • 16.
    Sous Android, vouspouvez décrire vos interfaces utilisateur de deux façons différentes : Directement dans le code Java d’une activité. avec une description déclarative XML ; Création d’interfaces utilisateur TextView T1 = new TextView(this); setContentView(T1); T1.setText("Bonjour tout le monde !"); <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/T1" android:text="Texte en haut à droite" android:gravity="top|right" />
  • 17.
    Positionner les vuesavec les gabarits LinearLayout RelativeLayout FrameLayout TableLayout
  • 18.
    Positionner les vuesavec les gabarits Peu du code XML
  • 19.
    Travaillons ensemble Atelier 2:deuxième contact avec SDK
  • 20.
    Créer une interfaceutilisateur La création d’une interface se traduit par deux éléments : une définition de l’interface utilisateur (gabarits, etc.) de façon déclarative dans un fichier XML ; une définition de la logique utilisateur (comportement de l’interface) dans une classe d’activité. Cela permet d’avoir une séparation stricte entre la présentation et la logique fonctionnelle de l’application. De plus, un intégrateur graphique pourra modifier l’interface sans interférer avec le code du développeur.
  • 21.
  • 22.
    Associez votre interfaceà une activité et définissez la logique utilisateur import android.app.Activity; import android.os.Bundle; public class Main extends Activity { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); } } Créer une interface utilisateur
  • 25.
    Gérer les événements <?xmlversion="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_height="fill_parent" android:layout_width="fill_parent" android:gravity="center_vertical|center_horizontal" > <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/monBouton" android:text="Cliquez ici !" > </Button> </LinearLayout>
  • 26.
    protected void onCreate(BundlesavedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // Nous cherchons le bouton dans notre interface ((Button)findViewById(R.id.monBouton)) // Nous paramétrons un écouteur sur l’événement ‘click’ de ce bouton .setOnClickListener(new View.OnClickListener() { public void onClick(View v) { // Nous affichons un message à l’utilisateur Toast.makeText(Main.this, "Bouton cliqué !", Toast.LENGTH_LONG).show(); } }); } Gérer les événements
  • 27.