UNIVERSITÉ MOHAMMED V de Rabat

Faculté des Sciences

Département d’informatique
Filière Licence fondamentale
en Sciences Mathématiques et Informatique

PROJET DE FIN D’ÉTUDES

intitulé :

Développement d’une application Android pour la

gestion des annonces
Présenté par :
EDDOU kaoutar & EL HAMZI saida
soutenu le 23 Juin 2016 devant le Jury

Mme. Orhanou Ghizlane Professeur à la Faculté des Sciences - Rabat Présidente

M. Ballihi Lahoucine Professeur à la Faculté des Sciences - Rabat Encadrant
M. Zkik Karim Doctorant à la Faculté des Sciences - Rabat Examinateur

Année universitaire 2015-2016

Dédicaces

Nous dédions ce travail à nos chers parents et bons amis, ainsi qu’à tous ceux qui de
loin ou de près ont contribué à sa réalisation.

«Veuillez trouver dans ce travail le fruit de vos bénédictions, et l’expression de notre

profonde gratitude. »

i
Remerciements

Nous remercions ALLAH le tout puissant de nous avoir donné le courage, la volonté
et la patience de mener à terme le présent travail.

Au terme de ce projet, Nous tenons à exprimer notre profonde gratitude et notre

immense respect à Monsieur BALLIHI Lahoucine, notre encadrant pour sa disponibilité,
ces avis éclairés, et ces judicieux conseils.

Nous exprimons aussi notre gratitude à tous les membres du jury d’avoir accepté
d’examiner et d’évaluer ce travail.

Avec beaucoup d’égard, nous ne manquerons pas d’exprimer notre grande recon-
naissance à tous les enseignants et administrateurs de la Faculté des Sciences Rabat.

ii
Résumé

Développement d’une application Android pour la

gestion des annonces

L’objectif principal de ce projet de fin d’études consiste à développer une application

mobile dynamique pour la publication des annonces, basée sur la plateforme JAVA sous
Android.
L’utilisation d’Android comme système d’exploitation puissant, gratuit a ouvert la
route à plusieurs projets.
Par conséquence,les applications mobiles des Smartphones sont utilisé par des gens
de plusieurs tranches d’age pour les utiliser de différentes manières, et pour bénéficier de
plusieurs services, comme l’achat en ligne, les jeux en ligne,messagerie...
Notre application eeMarket est une application à visée publicitaire, qui permettra aux
clients de chercher des annonces de différentes catégories dans toutes les régions du Maroc
et de déposer leur propres annonces.
Mots clés : Android, Android studio, JDK, SDK, WampServer, MYSQL, PHP,
JSON, JAVA, XML, Modelio, Carte interactive, Adobe Photoshop.

iii
Abstract

development of an Android application for announces

This project aims to implement a mobile application based on android plateform to

mannage commecrial ads, the client can search for ads from different categories or post
his own one for free.

Keywords : Android, Android studio, JDK, SDK, WampServer, MYSQL, PHP,

JSON, JAVA, XML, Modelio, Interactive map, Adobe Photoshop.

iv
Table des matières

Dédicaces i

Remerciements ii

Résumé iii

Abstract iv

INTRODUCTION GÉNÉRALE viii

1 LA PRÉSENTATION GÉNÉRALE 1
1.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
1.2 Présentation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
1.3 Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2

2 L’ANALYSE ET SPÉCIFICATION DES BESOINS 3

2.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
2.2 Spécification des besoins fonctionnels . . . . . . . . . . . . . . . . . . . . 3
2.3 Spécification des besoins non fonctionnels . . . . . . . . . . . . . . . . . . 3
2.4 Spécifications techniques . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
2.5 Diagramme de cas d’utilisations . . . . . . . . . . . . . . . . . . . . . . . 4
2.5.1 Raffinement des cas d’utilisations . . . . . . . . . . . . . . . . . . 6
2.6 Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8

3 LA CONCEPTION 9
3.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
3.2 Diagramme de classes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
3.3 Diagramme d’activités . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
3.3.1 Diagramme d’activités pour le cas d’utilisation "créer un compte" 10
3.3.2 Diagramme d’activités pour le cas d’utilisation
"s’authetifier" . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
3.4 Diagramme de séquence . . . . . . . . . . . . . . . . . . . . . . . . . . . 12
3.5 Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13

4 L’ENVIRONNEMENT DE TRAVAIL 14
4.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
4.2 Environnement matériel . . . . . . . . . . . . . . . . . . . . . . . . . . . 14

v
 4.3 Environnement logiciel . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
4.3.1 Présentation d’ANDROID . . . . . . . . . . . . . . . . . . . . . . 15
4.3.2 Les outils utilisés . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
4.4 Langages de programmation . . . . . . . . . . . . . . . . . . . . . . . . . 26
4.5 Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26

5 REALISATION ET TEST 27
5.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27
5.2 Présentation des interfaces . . . . . . . . . . . . . . . . . . . . . . . . . . 27
5.3 Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36

Conclusion 37

vi
Table des figures

1.2.1 architecture 3-tiers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2

2.5.1 Diagramme de cas d’utilisation . . . . . . . . . . . . . . . . . . . . . . . 5

3.2.1 Diagramme de classes . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9

3.3.1 Diagramme d’activités pour le cas d’utilisation "créer un compte" . . . . 10
3.3.2 Diagramme d’activités pour le cas d’utilisation "s’authentifier" . . . . . . 11
3.4.1 Diagramme de séquence pour le cas d’utilisation "s’authentifier" . . . . . 12

4.3.1 Les technologies utilisées . . . . . . . . . . . . . . . . . . . . . . . . . . . 15

4.3.2 Cycle de vie d’une application Android . . . . . . . . . . . . . . . . . . . 16
4.3.3 Android studio . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
4.3.4 JDK . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
4.3.5 SDK Android . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
4.3.6 etape 1 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
4.3.7 etape 2 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
4.3.8 etape 3 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
4.3.9 etape 4 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
4.3.10etape 5 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
4.3.11modelio . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22
4.3.12Wamp Server . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22
4.3.13Serveur MYSQL . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22
4.3.14Serveur SQLite . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
4.3.15php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
4.3.16json . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
4.3.17Adobe Photoshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25
4.4.1 Exemple d’un fichier XML . . . . . . . . . . . . . . . . . . . . . . . . . 26

5.2.1 Le logo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27
5.2.2 Home . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 28
5.2.3 Le menu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
5.2.4 Déposer une annonce . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
5.2.5 affichage d’annonce . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31
5.2.6 Interface d’inscription . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32
5.2.7 Interface de modification du profil . . . . . . . . . . . . . . . . . . . . . 33
5.2.8 Session client . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34
5.2.9 Session Admin . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35
5.2.10Interface de gestion des annonces . . . . . . . . . . . . . . . . . . . . . . 36

vii
Introduction Générale

Les Smartphones ont connu un essor très important durant ces dernières années,
ils sont de plus en plus dotés d’une puissance aoivec des fonctionnalités assez évoluées
permettant de créer des applications innovantes et de les distribuer en toute simplicité.

Bien plus que ces appareils nous permettent d’effectuer des appels ou d’envoyer
des SMS, ils sont devenus de véritables outils multimédia permettant d’accéder à tous
les modes de communication si bien que les besoins des utilisateurs sont de plus en plus
croissants et spécifiques en termes d’application pour satisfaire leurs besoins quotidien.

Dans le cadre de notre projet de fin d’étude, nous nous intéressons à développer
une application qui sert à la gestion des annonces, reconnu dans le domaine informatique
par le nom " m-commerce ", cette application est développée sous Android.

Les supports de notre application m-commerce sont les téléphones portable et les
tablettes menés d’un système d’exploitation Android.

L’OS Android est gratuit et open source fondé sur un noyau Linux destiné aux
Smartphones, et autres terminaux mobile comme les tablettes tactiles. Android ne cesse
d’accroitre sa part du marché, En 2015, il est le système d’exploitation le plus utilisé
dans le monde avec plus de 80 % de parts de marché dans les smartphones.

Mis à part le développement proprement dit de l’application, la première étape

consistait à nous familiariser avec l’environnement Android, puis de choisir les outils
conviviaux et envisageables à l’aboutissement du projet. Par la suite, nous entamerons
la modélisation et le développement de l’application.

Ce rapport est ainsi subdivisé en cinq chapitres. Le premier consistera à la pré-

sentation générale du projet, et ses objectifs principaux, le deuxième chapitre sera
consacrée à l’analyse des besoins, dans Le troisième chapitre on présentera l’environ-
nement de travail ainsi que les logiciels et technologies utilisés, le quatrième chapitre
entamera la partie conception. Enfin, le cinquième et dernier chapitre sera réservée
à présenter l’application avec les fonctionnalités de base et une notice permettant de
comprendre comment utiliser le logiciel.

viii
Chapitre 1

LA PRÉSENTATION GÉNÉRALE

1.1 Introduction
Ce chapitre est consacré à la présentation, la précision du cadre du projet et la pro-
blématique puis l’énumération des étapes à suivre pour le réaliser.

1.2 Présentation
Cadre du travail

Ce travail s’inscrit dans le cadre du projet de fin d’études (PFE) pour l’obtention
du diplôme de licence Mathématique et Informatique et cela au terme du cursus de la
formation qui s’est étalée sur trois ans au sein de la faculté des Sciences Rabat. Le su-
jet est intitulé "Développement d’une application Android pour la gestion des annonces ".

Présentation du projet

Notre projet consiste à mettre en place une application de publication et de consultation

des annonces de différentes catégories.
L’application eeMarket est une application qui a le même principe que les autres
applications de gestion des annonces comme Avito, Bikhir et Leboncoin ... sauf que que
pendant la réalisation de ce projet nous avons insister sur des objectifs majeurs : faciliter
l’accessibilité que ce soit pour le client ou pour l’administrateur , la circulation rapide de
l’information et la mise en place d’une base de données pour la réalisation de différentes
tâches et la bonne gestion des informations .
L’utilisateur doit éventuellement s’inscrire pour qu’il puisse publier une ou plusieurs
annonces, comme il peut consulter toutes les annonces publiées et validées sur l’applica-
tion en tant que visiteur.
Nous avons modélisé cette application à l’aide d’un outil UML : Modelio en présentant
dans le chapitre conception quelque diagramme de vue statique et celles de vue dyna-
mique.

1
 Figure 1.2.1 – architecture 3-tiers

Notre application eeMarket est conçu spécialement pour les appareils Android. Elle
fournit un moyen simple pour chercher dans plusieurs régions du Maroc les annonces
publiées et validées par l’administrateur , notre application permet à n’importe quel
internaute de chercher et visualiser les annonces ainsi de s’inscrire pour devenir un
client qui peut déposer des annonces . notre solution consiste alors à développer une
application mobile sous Android connectée avec la base de données MYSQl, ce qui nous
a mené à écrire et exécuter des scripts PHP en utilisant le protocole HTTP, ensuite coder
les données dans le format JSON, afin de récupérer les données par le client Android
(Figure 1.3.1).

Objectifs visés
Ce projet a pour but de réaliser une application mobile fonctionnelle et esthétiquement
attrayante, de navigation fluide et efficace, facile et simple d’utilisation.

Approches du travail
Le projet comprend deux phases : la première est la recherche d’une solution convenable
pour réaliser l’application, et la deuxième, la phase de conception et de développement.

Phase de recherche
C’est l’étape qui inclut l’étude bibliographique, dans laquelle nous devons saisir les
différentes notions et technologies à utiliser dans le projet, les architectures, etc. Aussi
elle renferme les tests des différentes solutions mises en hypothèse, et les outils nécessaires
pour la réalisation du projet.

Phase de conception et de développement

C’est une étape, dans laquelle, nous spécifions les besoins fonctionnels et nous modélisons
le système à réaliser pour clarifier les tâches à accomplir dans la partie développement.
Cette phase se termine par une partie qui comprend la programmation et les tests de
validation.

1.3 Conclusion
Au terme de ce premier chapitre, nous avons introduit le contexte de notre projet
dont les étapes de réalisation seront décrites d’une manière détaillée dans les chapitres
qui suivent. Le chapitre suivant sera réservé à la spécification détaillée et l’analyse des
différents besoins de notre application.

2
Chapitre 2

L’ANALYSE ET SPÉCIFICATION
DES BESOINS

2.1 Introduction
La phase d’analyse et spécification des besoins présente une étape primordiale dans le
cycle de développement d’un projet. En effet, elle permet de mieux comprendre le travail
demandé en dégageant les besoins des différents utilisateurs que le système doit accomplir.

2.2 Spécification des besoins fonctionnels

Le visiteur peut rechercher et visualiser des annonces comme il peut créer un
compte pour bénéficier de toutes les fonctionnalités de l’application.
Le client peut en plus de rechercher et visualiser des annonces, proposer et supprimer
ses propres annonces, comme il peut modifier son profil ou le supprimer.
L’administrateur doit valider, invalider ou supprimer les annonces.

2.3 Spécification des besoins non fonctionnels

A part les besoins fondamentaux, notre système doit répondre aux critères suivants :
la rapidité de traitement : En effet, vu le nombre important des transactions
quotidiennes, il est impérativement nécessaire que la durée d’exécution des traitements
s’approche le plus possible du temps réel.

La performance : Un logiciel doit être avant tout performant c’est-à-dire à tra-

vers ses fonctionnalités, répond à toutes les exigences des usagers d’une manière optimale.

La convivialité : Le futur logiciel doit être facile à utiliser. En effet, les interfaces
utilisateurs doivent être conviviales c’est-à-dire simples, ergonomiques et adaptées à
l’utilisateur.

3
2.4 Spécifications techniques
— Il faut que toute interface de notre application soit homogène, en effet, les dif-
férentes interfaces doivent suivre le même modèle de représentation (couleurs,
images, textes défilants, etc.).
— Le code doit être extensible et maintenable pour faciliter toute opération d’amé-
lioration ou d’optimisation

2.5 Diagramme de cas d’utilisations

Le diagramme de cas d’utilisation représente la structure des grandes fonctionnalités
nécessaires aux utilisateurs du système. C’est le premier diagramme du modèle UML, celui
où s’assure une relation entre l’utilisateur et les objets que le système met en oeuvre. Il
représente la structure des fonctionnalités nécessaires aux utilisateurs du système. Pour ce
qui est de notre projet, nous l’utilisons lors des étapes de capture des besoins fonctionnels
et techniques dans notre processus de développement . Cette procédure est efficace car
elle permet de cerner tous les besoins de l’utilisateur avant la réalisation du projet (Figure
2.5.1).

4
Figure 2.5.1 – Diagramme de cas d’utilisation

5
2.5.1 Raffinement des cas d’utilisations

Raffinement de cas d’utilisation "Créer un compte"

Cas d’utilisation : Créer un compte (s’inscrire)

Acteurs : Visiteur
Pré-conditions : Le visiteur lance l’application
Post-conditions : Le visiteur est ajouté dans la base de données et devient
un client
Scénario : 1.Le client clique sur " register " (s’inscrire).
2.Le système affiche le formulaire d’inscription.
3.Le visiteur remplie le formulaire par ses informations.
4.Le système vérifie la cohérence et l’unicité des données
saisies.
5.Le système affiche un message de confirmation concer-
nant l’inscription.

Raffinement de cas d’utilisation "Valider les annonces"

Cas d’utilisation : Valider les annonces.

Acteurs : Administrateur
Pré-conditions : L’application fonctionne correctement et l’administra-
teur est authentifié.
Post-conditions : L’annonce est validé.
Scénario : 1.L’admin choisit une annonce.
2. Le système affiche une "alert dialog".
3.L’admin appuie sur "validate".
4.L’annonce est validée.

Raffinement de cas d’utilisation "Rechercher une annonce"

Cas d’utilisation : Rechercher une annonce .

Acteurs : Client | Visiteur | Administrateur
Pré-conditions : L’utilisateur lance l’application.
Post-conditions : L’annonce recherchée est affichée
Scénario : 1.L’utilisateur clique sur une région précise dans la carte
interactive.
2. Il entre la catégorie et clique sur "search" (rechercher).
3.Le système présente une ou des annonces selon le choix
précis de l’utilisateur.

6
Raffinement de cas d’utilisation "Déposer une annonce"

Cas d’utilisation : Déposer une annonce

Acteurs : client
Pré-conditions : Le système fonctionne et le client est connecté
Post-conditions : La nouvelle annonce est ajoutée à la base de données
Scénario : 1.Le client clique sur " post an ad " (déposer une an-
nonce).
2.Le système affiche le formulaire de déposition d’an-
nonces.
3.Le système vérifie la cohérence des données saisies.
4.Le système affiche un message de confirmation concer-
nant l’ajout de l’annonce.

Raffinement de cas d’utilisation "Se connecter" (s’authentifier)

Cas d’utilisation : se connecter

Acteurs : Client | Administrateur
Pré-conditions : Le système fonctionne
Post-conditions : Accès aux fonctionnalités de l’application selon les pri-
vilèges de chaque utilisateur.
Scénario : 1.L’utilisateur clique sur " log in "(se connecter)
2.Le système affiche le formulaire d’authentification
3.L’utilisateur saisit son email et mot de passe.
4.Le système ouvre une session à l’utilisateur en donnant
un accès a l’application selon son type.

Raffinement de cas d’utilisation "Supprimer une annonce"

Cas d’utilisation : Supprimer une annonce

Acteurs : Administrateur | client
Pré-conditions : L’application fonctionne et l’utilisateur est connecté
Post-conditions : L’annonce est supprimée
Scénario : 1.L’utilisateur choisit l’annonce à supprimer.
2. Le système affiche une " alert dialog ".
3. L’utilisateur appuie sur " delete ".
4. Le système supprime l’annonce de la base de données.
4. Un message de confirmation s’affiche.

7
 Raffinement de cas d’utilisation "Supprimer son profil"

Cas d’utilisation : Supprimer son profil

Acteurs : Client
Pré-conditions : L’application fonctionne et le client est connecté
Post-conditions : Le profil est supprimé
Scénario : 1.Le client appuie sur "your profil".
2. Le système affiche une " alert dialog ".
3. L’utilisateur appuie sur " delete ".
4. Le système supprime le client de la base de données
et toutes ses annonces.
5. Un message de confirmation s’affiche.

Raffinement de cas d’utilisation "Modifier son profil"

Cas d’utilisation : Modifier son profil

Acteurs : Client
Pré-conditions : L’application fonctionne et le client est connecté
Post-conditions : Le profil est modifié
Scénario : 1.Le client appuie sur "your profil".
2. Le système affiche une " alert dialog ".
3. L’utilisateur appuie sur " Edit ".
4. Le système affiche le formulaire.
5. Le client remplie les champs qu’il veut modifier.
6.Le profil est modifié dans la base de données.

2.6 Conclusion
Dans ce chapitre, nous avons énuméré les différents besoins fonctionnels et non fonc-
tionnels de notre application. Ensuite, nous avons fait une étude des différents cas d’uti-
lisation de notre solution. Ce chapitre a été d’une importance cruciale surtout pour la
compréhension des besoins et attentes du client.

8
Chapitre 3

LA CONCEPTION

3.1 Introduction
Dans ce chapitre nous abordons la partie conception du projet, dans laquelle, nous
détaillons les différents éléments de conception, à savoir les diagrammes de séquences, les
diagrammes d’activités et les diagrammes de classes.

3.2 Diagramme de classes

Le diagramme de classes est une modélisation statique du système en termes de classes
et de relations entre ces classes. Son intérêt réside dans la modélisation des entités du
système d’information.

Figure 3.2.1 – Diagramme de classes

9
 Classe Utilisateur : est la classe qui contient toutes les informations concernant un
utilisateur ; client ou admin selon le type.
Classe Visiteur : est la classe qui définie les opérations qui peuvent être réalisées
par un visiteur.
Classe Annonce : est la classe qui contient toutes les informations concernant une
annonce.
Classe Inscription : est la classe qui contient toutes les informations concernant
une inscription.

3.3 Diagramme d’activités

Le diagramme d’activités permet de décrire sous forme de flux ou d’enchaînement
d’activités le comportement du système ou de ses composants.

3.3.1 Diagramme d’activités pour le cas d’utilisation "créer un

compte"

Figure 3.3.1 – Diagramme d’activités pour le cas d’utilisation "créer un compte"

10
3.3.2 Diagramme d’activités pour le cas d’utilisation
"s’authetifier"

Figure 3.3.2 – Diagramme d’activités pour le cas d’utilisation "s’authentifier"

11
3.4 Diagramme de séquence
Le diagramme de séquence décrit l’aspect dynamique du système. Il modélise les inter-
actions entre les objets ou entre utilisateur et objet, en mettant l’accent sur la chronologie
des messages échangés.

Figure 3.4.1 – Diagramme de séquence pour le cas d’utilisation "s’authentifier"

12
3.5 Conclusion
Dans ce chapitre nous avons détaillé la phase de conception, ainsi nous avons fait
la description des diagrammes de classe et d’activité afin de délimiter le cadre de notre
travail et de préparer pour la prochaine étape.

13
Chapitre 4

L’ENVIRONNEMENT DE TRAVAIL

4.1 Introduction
Ce chapitre est consacré à la présentation de l’environnement matériel et logiciel
utilisés pour le développement de la solution proposé, nous expliquerons éventuellement
nos choix techniques relatif aux langages de programmation et des outils utilisés.

4.2 Environnement matériel

L’application a été développée sur des machines possédants les caractéristiques
suivantes, les deux machines ont été utilisées pour coder :

Processeur Intel Core i5-2467M

RAM 8Go
Frequence 1.60 GHz
Ecran 14"
Disque dur 120 Go

Table 4.1 – ordinateur utilisé pour compiler

Processeur Intel Atom CPU D2500

RAM 2Go
Frequence 1.86 GHz
Ecran 16"
Disque dur 215 Go

Table 4.2 – l’ordinateur serveur de base de données

14
4.3 Environnement logiciel

Figure 4.3.1 – Les technologies utilisées

4.3.1 Présentation d’ANDROID

Android est un système d’exploitation Open Source pour terminaux mobiles conçu
par Android, une startup américaine puis rachetée par Google en juillet 2005 [1].
Cet OS se différencie principalement de ses concurrents, par le fait qu’il est ouvert. Le mo-
dèle économique de Google semble très pertinent, l’adoption d’Android par les fabricants
sera plus rapide du fait de la gratuité d’utilisation pour le constructeur. Voilà pourquoi
il nous est pertinent de travailler sur cette plateforme. Une autre raison est que les ap-
plications Android sont développées en Java, un langage de programmation dont nous
avons connaissances pour l’avoir étudié en cours . Android dispose aussi d’un ensemble
de librairies qui incluent la plupart des fonctionnalités présentes dans java ainsi que des
fonctionnalités supplémentaires pour la gestion de l’interface graphique par exemple.
Cette plateforme mobile, bâtie autour du noyau Linux 2.6 a plusieurs versions avec une ar-
chitecture organisée en plusieurs couches permettant ainsi de développer des applications
innovantes :
— Le noyau Linux
— Les bibliothèques graphiques
— Une Machine Virtuelle : Dalvik Virtual Machine
— Framework applicatif
— Application
Les applications Android sont des assemblages de composants liés entre eux par un
fichier de configuration et reposent sur un cycle de vie comme l’indique la figure suivante :

Ses composants sont :

— Vues qui sont comme des éléments de l’interface graphique qui contiennent des
composants organisés selon diverses mises en page.

15
 Figure 4.3.2 – Cycle de vie d’une application Android

— Contrôles Boutons, champs de saisie, case à cocher, etc.

— Activité(Activity) peut être assimilée à un écran structuré par un ensemble de
vues et de contrôles. Elle présente deux volets à savoir le volet métier et la gestion
du cycle de vie implémentée en Java dans une classe héritant d’Activity et le volet
interface définit soit en XML soit en JAVA.

16
4.3.2 Les outils utilisés
Pour réaliser notre application nous avons eu recours aux logiciels suivants :
1. Android studio L’environnement de travail que nous avons utilisé pour la réali-
sation de ce projet est Android studio, qui est annoncé lors de l’événement Google
I/O de mai 2013 . Il s’agit d’un IDE(Integrated Development Environment) conçu
par Google pour faciliter le développement d’apps pour système Android quel que
soit le terminal sous-jacent (smartphone, tablette, montre, TV, Google Glass...).

Figure 4.3.3 – Android studio

17
installation : JDK (Java Development Kit)
http ://www.oracle.com/technetwork/java/javase/downloads/index.html

Figure 4.3.4 – JDK

SDK Android(Software Developmet Kit)

https ://developer.android.com/studio/index.html

Figure 4.3.5 – SDK Android

18
Une fois le téléchargement terminé, lancez l’installation.
Sur cet écran, conservez les options Android SDK et Android Virtual Device, mais
ne sélectionnez Performance (Intel R HAXM) que si vous avez un processeur Intel
capable d’émulation

Figure 4.3.6 – etape 1

Le premier répertoire est celui qui indique où sera installé Android Studio et le
deuxième celui où sera installé le SDK. Ce second répertoire risque de peser assez
lourd alors choisissez un disque qui a assez d’espace disque.

Figure 4.3.7 – etape 2

19
Si votre ordinateur est suffisamment puissant, cet écran vous propose d’indiquer
quel mémoire vive (RAM) vous souhaitez accorder à l’émulateur Android. La va-
leur par défaut est 2 Go mais vous pouvez indiquer une valeur en choisissant
Custom.

Figure 4.3.8 – etape 3

Une fois l’installation terminée, lancez Android Studio.

Figure 4.3.9 – etape 4

20
Maintenant on va configurer le SDK Manager, nécessaire pour développer une
application Android.

Figure 4.3.10 – etape 5

Ce SDK Manager propose tout une liste d’outil nécessaire ou non à installer.De
manière générale, une application développée pour une version précise d’Android
fonctionnera sur les versions suivantes d’Android mais pas sur les versions précé-
dentes.

21
2. Modelio Nous avons choisi pour la modélisation UML de l’application Modelio
qui se caractérise par sa simplicité d’installation et de prise en main . C’est un
outil de création de modèles.

Figure 4.3.11 – modelio

3.wampserve WampServer est une plate-forme de développement Web sous Win-

dows pour des applications Web dynamiques à l’aide du serveur Apache2, du
langage de scripts PHP et d’une base de données MySQL. Il possède également
PHPMyAdmin pour gérer plus facilement vos bases de données.
http ://www.wampserver.com/

Figure 4.3.12 – Wamp Server

4.Serveur de base de donnée MYSQL Notre choix s’est porté sur le serveur de
base de données MYSQL pour de nombreuses raisons :
C’est un SGBD gratuit et disponible sur de nombreuses plateformes (Unix, Linux,
Windows, MacOs X, Solaris, etc.). Il s’intègre au sein de nombreux serveurs web
(Apache, Microsoft IlS, etc.) et est beaucoup plus adapté à des petites bases de
données.
MySQL est un serveur de base de données très utilisé dans le monde. Il est rapide,
robuste, facile à utiliser et à administrer et dispose d’une documentation complète.

Figure 4.3.13 – Serveur MYSQL

22
5.Serveur SQLite Pour la gestion en local des informations nous avons utilisé la
base SQLite car elle est légère et simple .

Figure 4.3.14 – Serveur SQLite

6.PHP (PHP :Hypertext Preprocessor)Le langage PHP est le langage utilisé pour
l’écriture de nos scripts, c’est un langage de script HTML, exécuté côté serveur.
Sa syntaxe est empruntée aux langages C, Java et Perl, et est facile à apprendre.
Le but de ce langage est de permettre aux développeurs web d’écrire des pages
dynamiques rapidement.

Figure 4.3.15 – php

7.JSON (JavaScript Object Notation)est un format léger d’échange de données. Il

est facile à lire et à écrire. Il est aisément analysable ou générable par des machines.
Il est basé sur le langage de programmation JavaScript.
JSON est un format texte complètement indépendant de tout langage, mais les
conventions qu’il utilise seront familières à tout programmeur habitué aux langages
descendant du C.

Figure 4.3.16 – json

23
La connectivité aux bases de données est une opération trés importante. Il existe
plusieurs procédures qui permettent depuis un client android, de se connecter à
une base de données.
Dans notre cas,on a choisis d’utiliser la méthodes qui consiste à l’utilisation d’un
fichier PHP qui convertit les données récupérées en format JSON(Le format JSON
est une réprésentation structurée de données en Objet JavaScript, les données sont
maniables très facilement dans ce format qui est aussi une sorte de compression.En
PHP, la fonction json_encode() permet d’encoder en JSON.
Cette méthode est donc très avantageuse , souple et facile à mettre en oeuvre. Le
fichier php consiste à envoyer des requetes sql à la base de données qui contient
la table client et annonce. Il récupère le résultat des requetes, ensuite l’encode en
JSON grêce au simple appel de la fonction json_encode() comme dit précedem-
ment.
Au niveau du client Android, il s’agit de demander au serveur de nous renvoyer
les données grace aux commandes HttpClient, Ensuite, il nous appartient de de-
coder(récuperer les champs) ces données(puisqu’elles sont renvoyées sous forme
d’objet JSON) et les afficher sous forme de liste dans notre cas. Cela se fera en
utilisant une seule classe principale qui va hériter de ListActivity pour faire simple.

24
8.Adobe Photoshop Photoshop est un logiciel de retouche, de traitement et de des-
sin , Il est principalement utilisé pour le traitement de photographies numériques,
mais sert également à la création des images.
nous l’avons utilisé pour la création de la carte interactive et la répartition de ses
régions.

Figure 4.3.17 – Adobe Photoshop

25
4.4 Langages de programmation
JAVA Le langage de programmation utilisé dans le cadre de ce projet Android est
le Java, très répandu dans les développements informatiques actuels. Ce langage
offre un ensemble de librairies qui facilitent le développement et dispose d’une
documentation bien fournie.
XML Pour la réalisation des interfaces graphiques de l’application nous avons utilisé
le langage XML. C’est un langage informatique qui sert essentiellement à sto-
cker/transférer des données de type texte structurées en champs arborescents. Ce
langage est qualifié d’extensible car il permet à l’utilisateur de définir des mar-
queurs (balises) qui facilitent le parcours au sein du fichier et donc la lecture de
l’information. Ce langage est couramment utilisé et son apprentissage est aisé.

Figure 4.4.1 – Exemple d’un fichier XML

4.5 Conclusion
Dans ce chapitre nous avons détaillé les technologies utilisées pour la réalisation de
notre projet ainsi que les différents logiciels ,et langages de programmation avec des liens
d’installation .

26
Chapitre 5

REALISATION ET TEST

5.1 Introduction
Dans ce chapitre, nous nous intéressons à la description de quelques interfaces du
système implémentés dans le cadre de quelques scénarios d’utilisation par des imprimés
écrans.

5.2 Présentation des interfaces

notez qu’il faut changer l’adresse ip dans la classe java "Appconfig" avant de compiler
selon l’adresse attribué a l’ordinateur pour que le téléphone et l’ordinateur soient dans le
même réseaux.
1. le logo de l’interface au lancement de l’application(Splashscreen).

Figure 5.2.1 – Le logo

27
2. Le Home est la page qui s’affichera après le Splashscreen (écran de démarrage) de
l’application. Cette interface affiche une carte interactive du Maroc subdivisée en
12 régions cliquables qui mènent vers l’activité de recherche des annonces.

Figure 5.2.2 – Home

28
3. Le menu contient un sous menu en commun entre tout les utilisateurs, un autre
pour le client et le dernier pour l’administrateur.

Figure 5.2.3 – Le menu

29
4. L’interface de déposition des annonces qui contient un formulaire à remplir par le
client afin de déposer son annonce.

Figure 5.2.4 – Déposer une annonce

30
5. L’interface d’affichage détaillé d’une annonce.

Figure 5.2.5 – affichage d’annonce

31
6. l’interface d’inscription dédié aux visiteurs pour créer un compte .

Figure 5.2.6 – Interface d’inscription

32
7. L’interface qui permet au client de modifier ou supprimer son compte.

Figure 5.2.7 – Interface de modification du profil

33
8. L’interface qui s’affiche après l’authentification du client.

Figure 5.2.8 – Session client

34
9. L’interface qui s’affiche après que l’administrateur s’authentifie.

Figure 5.2.9 – Session Admin

35
 10. L’interface qui permet à l’administrateur de valider, invalider ou supprimer une
annonce.

Figure 5.2.10 – Interface de gestion des annonces

5.3 Conclusion
Nous sommes parvenus au terme de ce chapitre dont l’objectif principal était de
présenter le résultat final obtenu, à l’aide de quelque imprimés-écrans.

36
Conclusion Générale

Au bout de notre cursus en licence informatique, nous avons été chargés de réaliser
un projet de fin d’études. Ceci nous a amené à découvrir une nouvelle plateforme de
développement et enrichir notre savoir et notre expérience.

Il s’agissait au cours du projet d’étudier et de développer une application mobile

sous Android. Avec l’avancée et l’émergence des technologies mobiles, les développements
embarqués sont de plus en plus demandés sur le marché.Le rythme de nos jours est
accéléré et les gens ont besoin de réduire leurs déplacements, ainsi le nombre des
utilisateurs d’Android ne cesse d’accroître d’où nait l’idée de développer une application
utile sur ce système d’exploitation pour la publication et la gestion d’annonces.

37
ANNEXE

Inscription a l’application
1. Le code Java pour l’activité SignUp ; inscription a l’application :
package com.example.eeMarket ;
import android.app.AlertDialog ;
import android.app.ProgressDialog ;
import android.content.DialogInterface ;
import android.content.Intent ;
import android.os.AsyncTask ;
import android.os.Bundle ;
import android.support.design.widget.NavigationView ;
import android.support.v4.view.GravityCompat ;
import android.support.v4.widget.DrawerLayout ;
import android.support.v7.app.AppCompatActivity ;
import android.util.Log ;
import android.view.MenuItem ;
import android.view.View ;
import android.widget.Button ;
import android.widget.EditText ;
import android.widget.Spinner ;
import android.widget.Toast ;
import java.io.BufferedReader ;
import java.io.BufferedWriter ;
import java.io.InputStreamReader ;
import java.io.OutputStream ;
import java.io.OutputStreamWriter ;
import java.io.UnsupportedEncodingException ;
import java.net.HttpURLConnection ;
import java.net.URL ;
import java.net.URLEncoder
import java.util.HashMap ;
import java.util.Map ;
import javax.net.ssl.HttpsURLConnection ;
public class SignUpActivity extends AppCompatActivity implements

38
NavigationView.OnNavigationItemSelectedListener
private static final String TAG =SignInActivity.class.getSimpleName() ;
private Button btnSignin ;
private Button btnLinkToLogin ;
private EditText Name ;
private EditText Phone ;
private EditText Email ;
private EditText Password ;
private ProgressDialog pDialog ;
private SessionManager session ;
private SQLiteHandler db ;
private Spinner spinner1,spinner2 ;
private static final String SIGNIN_URL = AppConfig.URL_REGISTER ;
@Override
public void onCreate(Bundle savedInstanceState)
super.onCreate(savedInstanceState) ;
setContentView(R.layout.activity_sign) ;
Name = (EditText) findViewById(R.id.fname) ;
Email = (EditText) findViewById(R.id.email) ;
Password = (EditText) findViewById(R.id.passwd) ;
Phone=(EditText) findViewById(R.id.phone) ;
spinner2=(Spinner) findViewById(R.id.spinner_region) ;
btnSignin = (Button) findViewById(R.id.btnsignin) ;
btnLinkToLogin = (Button) findViewById(R.id.btnLinkTologin) ;
NavigationView navigationView = (NavigationView)
findViewById(R.id.nav_view) ;
navigationView.setNavigationItemSelectedListener(this) ;
db = new SQLiteHandler(getApplicationContext()) ;
// Session manager
session = new SessionManager(getApplicationContext()) ;
// SQLite database handler
db = new SQLiteHandler(getApplicationContext()) ;
// Check if user is already logged in or not
if (session.isLoggedIn())
// User is already logged in. Take him to main activity
Intent intent = new Intent(SignInActivity.this,
MainActivity.class) ;
startActivity(intent) ;
finish() ;
btnLinkToLogin.setOnClickListener(new View.OnClickLstener()
public void onClick(View view)

39
Intent i = new Intent(getApplicationContext(),
LoginActivity.class) ;
startActivity(i) ;
finish() ;
);
btnSignin.setOnClickListener(new View.OnClickListener()
public void onClick(View view)
String name = Name.getText().toString().trim() ;
String email = Email.getText().toString().trim() ;
String password =
Password.getText().toString().trim() ;
String phone = Phone.getText().toString().trim() ;
String region= spinner2.getSelectedItem().toString() ;
if ( !name.isEmpty() && !email.isEmpty() &&
!password.isEmpty() && !phone.isEmpty() &&
!region.isEmpty())
registerUser(name, email, password,phone,region) ;
else
Toast.makeText(getApplicationContext(),
"Please enter your details !", Toast.LENGTH_LONG)
.show() ;
);
private void registerUser(final String name, final String email,
final String password, final String phone, final String region)
class RegisterUser extends AsyncTask<String, Void, String>
ProgressDialog loading ;
@Override
protected void onPreExecute()
super.onPreExecute() ;
loading = ProgressDialog.show(SignInActivity.this,
"Please Wait",null, true, true) ; @Override
protected void onPostExecute(String s)
super.onPostExecute(s) ;
loading.dismiss() ;
Log.d("Erreur On Post", s) ;
Toast.makeText(getApplicationCont
ext(),s,Toast.LENGTH_LONG).show() ;
@Override
protected String doInBackground(String... params)
HashMap<String, String> data = new
HashMap<String,String>() ;

40
data.put("name",params[0]) ;
data.put("email",params[1]) ;
data.put("password", params[2]) ;
data.put("phone", params[3]) ;
data.put("region", params[4]) ;
String
str=params[0]+"
,"+params[1]+","+params[2]+","+params[3]+","+params[4] ;
Log.d("params",str) ;
String result = sendPostRequest(SIGNIN_URL,data) ;
return result ;
RegisterUser ru = new RegisterUser() ;
ru.execute(name, email, password, phone, region) ;
public String sendPostRequest(String requestURL,
HashMap<String, String> postDataParams)
URL url ;
String response = "" ;
try
url = new URL(requestURL) ;
HttpURLConnection conn = (HttpURLConnection)
url.openConnection() ;
conn.setReadTimeout(15000) ;
conn.setConnectTimeout(15000) ;
conn.setRequestMethod("POST") ;
conn.setDoInput(true) ;
conn.setDoOutput(true) ;
OutputStream os = conn.getOutputStream() ;
BufferedWriter writer = new BufferedWriter(
new OutputStreamWriter(os, "UTF-8")) ;
writer.write(getPostDataString(postDataParams)) ;
writer.flush() ;
writer.close() ;
os.close() ;
int responseCode=conn.getResponseCode() ;
if (responseCode == HttpsURLConnection.HTTP_OK)
BufferedReader br=new BufferedReader(new
InputStreamReader(conn.getInputStream())) ;
response = br.readLine() ;
else
response="Error Registering" ;
catch (Exception e)

41
e.printStackTrace() ;
return response ;
private String getPostDataString(HashMap<String, String> params) throws
UnsupportedEncodingException
StringBuilder result = new StringBuilder() ;
boolean first = true ; for(Map.Entry<String, String> entry : params.entrySet())
if (first)
first = false ;
else
result.append("&") ;
result.append(URLEncoder.encode(entry.getKey(), "UTF-8")) ;
result.append("=") ;
result.append(URLEncoder.encode(entry.getValue(), "UTF-8")) ;
return result.toString() ;
@Override
public boolean onNavigationItemSelected(MenuItem item)
int id = item.getItemId() ;
if (id == R.id.exp)
startActivity(new
Intent(SignInActivity.this,EmptyActivity.class)) ;
return true ;
else if (id == R.id.sign_in)
startActivity(new Intent(SignInActivity.this,SignInActivity.class)) ;
return true ;
else if (id == R.id.login)
startActivity(new Intent(SignInActivity.this,LoginActivity.class)) ;
return true ;
else if (id == R.id.regs)
startActivity(new Intent(SignInActivity.this,MainActivity.class)) ;
return true ;
else if (id == R.id.adm)
startActivity(new Intent(SignInActivity.this,AdminSpace.class)) ;
return true ; else if (id == R.id.dep)
startActivity(new Intent(SignInActivity.this,AnnonceActivity.class)) ;
return true ; else if (id == R.id.your_announces)
startActivity(new
Intent(SignInActivity.this,Annonce_emailActivity.class)) ;
return true ;
else if (id == R.id.edit)
/*Intent i = new Intent(getApplicationContext(), AdminChoice.class) ;
i.putExtra("id",Id) ;

42
 startActivity(i) ;*/
AlertDialog.Builder builder = new
AlertDialog.Builder(SignInActivity.this) ;
builder.setMessage("Choose an action ?") ;
builder.setNegativeButton("Delete", new DialogInterface.OnClickListener()
@Override
public void onClick(DialogInterface dialog, int which)
Intent i = new Intent(SignInActivity.this, Delete_Account.class) ;
startActivity(i) ;
dialog.cancel() ;
finish() ;
);
builder.setPositiveButton("Edit", new DialogInterface.OnClickListener()
@Override
public void onClick(DialogInterface dialog, int which)
Intent i = new Intent(SignInActivity.this,
Edit_ProfileActivity.class) ;
startActivity(i) ;
dialog.cancel() ;
finish() ;
);
Aler
tDialog alert11 = builder.create() ;
alert11.show() ;
return true ;
DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout) ;
drawer.closeDrawer(GravityCompat.START) ;
return true ;
2. Le code XML :

< ?xml version="1.0" encoding="utf-8" ?>

<android.support.v4.widget.DrawerLayout
xmlns :android="http ://schemas.android.com/apk/res/android"
xmlns :app="http ://schemas.android.com/apk/res-auto"
xmlns :tools="http ://schemas.android.com/tools"
android :id="@+id/drawer_layout"
android :layout_width="match_parent"
android :layout_height="match_parent"
android :fitsSystemWindows="true"
tools :openDrawer="start"
android :background="@color/white"

43
>
<android.support.design.widget.CoordinatorLayout
xmlns :android="http ://schemas.android.com/apk/res/android"
xmlns :app="http ://schemas.android.com/apk/res-auto"
xmlns :tools="http ://schemas.android.com/tools"
android :layout_width="match_parent"
android :layout_height="match_parent"
android :background="@color/bg_login"
android :fitsSystemWindows="true"
tools :context="com.example.jawad.myapplication.MainActivity"
>
<android.support.design.widget.AppBarLayout
android :layout_width="match_parent"
android :layout_height="wrap_content"
android :theme="@style/AppTheme.AppBarOverlay"
> <android.support.v7.widget.Toolbar
android :id="@+id/toolbar"
android :layout_width="match_parent"
android :layout_height=" ?attr/actionBarSize"
android :background="#019ACB"
android :titleTextColor="@color/white"
app :popupTheme="@style/AppTheme.PopupOverlay"
/>
</android.su
pport.design.widget.AppBarLayout>
<LinearLayout
android :layout_width="fill_parent"
android :layout_height="wrap_content"
android :layout_gravity="center"
android :orientation="vertical"
android :paddingTop="100dp"
android :paddingLeft="20dp"
android :paddingRight="20dp" >
<EditText
android :id="@+id/fname"
android :layout_width="fill_parent"
android :layout_height="wrap_content"
android :layout_marginBottom="10dp"
android :background="@color/white"
android :hint="@string/fname"
android :inputType="text"

44
android :padding="10dp"
android :singleLine="true"
android :textColor="@color/input_login"
android :textColorHint="@color/input_login_hint" />
<EditText
android :id="@+id/email"
android :layout_width="fill_parent"
android :layout_height="wrap_content"
android :layout_marginBottom="10dp"
android :background="@color/white"
android :hint="@string/email"
android :inputType="textEmailAddress"
android :padding="10dp"
android :singleLine="true"
android :textColor="@color/input_login"
android :textColorHint="@color/input_login_hint" />
<EditText
android :id="@+id/passwd"
android :layout_width="fill_parent"
android :layout_height="wrap_content"
android :layout_marginBottom="10dp"
android :background="@color/white"
android :hint="@string/passwd"
android :inputType="textPassword"
android :padding="10dp"
android :singleLine="true"
android :textColor="@color/input_login"
android :textColorHint="@color/input_login_hint" />
<EditText
android :id="@+id/phone"
android :layout_width="fill_parent"
android :layout_height="wrap_content"
android :layout_marginBottom="10dp"
android :background="@color/white"
android :hint="@string/tel"
android :inputType="text"
android :padding="10dp"
android :singleLine="true"
android :textColor="@color/input_login"
android :textColorHint="@color/input_login_hint" />
<Spinner

45
android :id="@+id/spinner_region"
android :layout_width="fill_parent"
android :layout_height="wrap_content"
android :layout_marginBottom="10dp"
android :background="@color/white"
android :padding="10dp"
android :singleLine="true"
android :entries="@array/region_arrays"
android :prompt="@string/region_prompt"
/>
< !– Login Button –>
<Button
android :id="@+id/btnsignin"
android :layout_width="fill_parent"
android :layout_height="wrap_content"
android :layout_marginTop="20dip"
android :background="@color/btn_login_bg"
android :text="Register"
android :textColor="@color/btn_login" />
< !– Link to Login Screen –>
<Button
android :id="@+id/btnLinkTologin"
android :layout_width="fill_parent"
android :layout_height="wrap_content"
android :layout_marginTop="40dip"
android :background="@null"
android :text="@string/btn_link_to_login"
android :textAllCaps="false"
android :textColor="@color/white"
android :textSize="20sp" />
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android :id="@+id/nav_view"
android :layout_width="wrap_content"
android :layout_height="match_parent"
android :layout_gravity="start"
android :fitsSystemWindows="true"
app :headerLayout="@layout/nav_header_main2 " />
</android.support.v4.widget.DrawerLayout>

46
3. le code php :

47
Authentification
1. le code Java : package com.example.jawad.myapplication ;
import ...
public class LoginActivity extends Activity implements Navigation-
View.OnNavigationItemSelectedListener
private static final String TAG = LoginActivity.class.getSimpleName() ;
private Button btnLogin ;
private Button btnLinkToRegister ;
private EditText inputEmail ;
private EditText inputPassword ;
private ProgressDialog pDialog ;
private SessionManager session ;
private SQLiteHandler db ;
@Override
public void onCreate(Bundle savedInstanceState)
super.onCreate(savedInstanceState) ;
setContentView(R.layout.activity_login) ;
inputEmail = (EditText) findViewById(R.id.email) ;
inputPassword = (EditText) findViewById(R.id.password) ;
btnLogin = (Button) findViewById(R.id.btnLogin) ;
btnLinkToRegister = (Button) findViewById(R.id.btnLinkToRegisterScreen) ;
NavigationView navigationView = (NavigationView) findView-
ById(R.id.nav_view) ;
navigationView.setNavigationItemSelectedListener(this) ;
// Progress dialog
pDialog = new ProgressDialog(this) ;
pDialog.setCancelable(false) ;
// SQLite database handler
db = new SQLiteHandler(getApplicationContext()) ;
// Session manager
session = new SessionManager(getApplicationContext()) ;
// Check if user is already logged in or not
if (session.isLoggedIn())
// User is already logged in. Take him to welcome activity
Intent intent = new Intent(LoginActivity.this, WelcomeActivity.class) ;
startActivity(intent) ;
finish() ;
// Login button Click Event
btnLogin.setOnClickListener(new View.OnClickListener()
public void onClick(View view)
String email = inputEmail.getText().toString().trim() ;

48
String password = inputPassword.getText().toString().trim() ;
// Check for empty data in the form
if ( !email.isEmpty() && !password.isEmpty())
// login user
checkLogin(email, password) ;
else
// Prompt user to enter credentials
Toast.makeText(getApplicationContext(),
"Please enter the credentials !", Toast.LENGTH_LONG).show() ;
);
// Link to Register
btnLinkToRegister.setOnClickListener(new View.OnClickListener()
public void onClick(View view)
Intent i = new Intent(getApplicationContext(),
SignInActivity.class) ;
startActivity(i) ;
finish() ;
);
private void checkLogin(final String email, final String password)
// Tag used to cancel the request
String tag_string_req = "req_login" ;
pDialog.setMessage("Logging in ...") ;
showDialog() ;
StringRequest strReq = new StringRequest(Method.POST,
AppConfig.URL_LOGIN, new Response.Listener<String>()
@Override
public void onResponse(String response)
Log.d(TAG, "Login Response : " + response.toString()) ;
hideDialog() ;
try
JSONObject jObj = new JSONObject(response) ;
boolean error = jObj.getBoolean("error") ;
// Check for error node in json
if ( !error)
// user successfully logged in
// Create login session
session.setLogin(true) ;
JSONObject user = jObj.getJSONObject("user") ;
String name = user.getString("name") ;
String email = user.getString("email") ;
// Now store the user in SQLite

49
// Inserting row in users table
db.addUser(name, email) ;
// Launch welcome activity
Intent intent = new Intent(LoginActivity.this,WelcomeActivity.class) ;
startActivity(intent) ;
finish() ;
else
// Error in login. Get the error message
String errorMsg = jObj.getString("error_msg") ;
Toast.makeText(getApplicationContext(),
errorMsg, Toast.LENGTH_LONG).show() ;
catch (JSONException e)
// JSON error
e.printStackTrace() ;
Toast.makeText(getApplicationContext(), "Json error : " + e.getMessage(),
Toast.LENGTH_LONG).show() ;
, new Response.ErrorListener()
@Override
public void onErrorResponse(VolleyError error)
Log.e(TAG, "Login Error : " + error.getMessage()) ;
Toast.makeText(getApplicationContext(),error.getMessage(),
Toast.LENGTH_LONG).show() ;
hideDialog() ;
)
@Override
protected Map<String, String> getParams()
// Posting parameters to login url
Map<String, String> params = new HashMap<String, String>() ;
params.put("email", email) ;
params.put("password", password) ;
return params ;
;
// Adding request to request queue
AppController.getInstance().addToRequestQueue(strReq, tag_string_req) ;
private void showDialog()
if ( !pDialog.isShowing())
pDialog.show() ;
private void hideDialog()
if (pDialog.isShowing())
pDialog.dismiss() ;
@Override

50
public boolean onNavigationItemSelected(MenuItem item)
int id = item.getItemId() ;
if (id == R.id.exp)
startActivity(new Intent(LoginActivity.this,EmptyActivity.class)) ;
return true ;
else if (id == R.id.sign_in)
startActivity(new Intent(LoginActivity.this,SignInActivity.class)) ;
return true ;
else if (id == R.id.login)
startActivity(new Intent(LoginActivity.this,LoginActivity.class)) ;
return true ;
else if (id == R.id.regs)
startActivity(new Intent(LoginActivity.this,MainActivity.class)) ;
return true ;
else if (id == R.id.adm)
startActivity(new Intent(LoginActivity.this,AdminSpace.class)) ;
return true ;
else if (id == R.id.dep)
startActivity(new Intent(LoginActivity.this,AnnonceActivity.class)) ;
return true ;
else if (id == R.id.your_announces)
startActivity(new Intent(LoginActivity.this,Annonce_emailActivity.class)) ;
return true ;
else if (id == R.id.edit)
AlertDialog.Builder builder = new AlertDialog.Builder(LoginActivity.this) ;
builder.setMessage("Choose an action ?") ;
builder.setNegativeButton("Delete", new DialogInterface.OnClickListener()
@Override
public void onClick(DialogInterface dialog, int which)
Intent i = new Intent(LoginActivity.this, Delete_Account.class) ;
startActivity(i) ;
dialog.cancel() ;
finish() ;
);
builder.setPositiveButton("Edit", new DialogInterface.OnClickListener()
@Override
public void onClick(DialogInterface dialog, int which)
Intent i = new Intent(LoginActivity.this, Edit_ProfileActivity.class) ;
startActivity(i) ;
dialog.cancel() ;
finish() ;

51
 );
AlertDialog alert11 = builder.create() ;
alert11.show() ;
return true ;
DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout) ;
drawer.closeDrawer(GravityCompat.START) ;
return true ;
2. Le code XML : < ?xml version="1.0" encoding="utf-8" ?>
<android.support.v4.widget.DrawerLayout xmlns :android="http ://sche-
mas.android.com/apk/res/android"
xmlns :app="http ://schemas.android.com/apk/res-auto"
xmlns :tools="http ://schemas.android.com/tools"
android :id="@+id/drawer_layout"
android :layout_width="match_parent"
android :layout_height="match_parent"
android :fitsSystemWindows="true"
tools :openDrawer="start"
android :background="@color/white"
>
<android.support.design.widget.CoordinatorLayout
xmlns :android="http ://schemas.android.com/apk/res/android"
xmlns :app="http ://schemas.android.com/apk/res-auto"
xmlns :tools="http ://schemas.android.com/tools"
android :layout_width="match_parent"
android :layout_height="match_parent"
android :background="@color/bg_login"
android :fitsSystemWindows="true"
tools :context="com.example.jawad.myapplication.MainActivity"
>
<android.support.design.widget.AppBarLayout
android :layout_width="match_parent"
android :layout_height="wrap_content"
android :theme="@style/AppTheme.AppBarOverlay"
>
<android.support.v7.widget.Toolbar
android :id="@+id/toolbar"
android :layout_width="match_parent"
android :layout_height=" ?attr/actionBarSize"
android :background="@color/bg_main"
app :popupTheme="@style/AppTheme.PopupOverlay"
/>

52
</android.support.design.widget.AppBarLayout>
<LinearLayout
android :layout_width="fill_parent"
android :layout_height="wrap_content"
android :layout_gravity="center"
android :orientation="vertical"
android :paddingLeft="20dp"
android :paddingRight="20dp" >
<EditText
android :id="@+id/email"
android :layout_width="fill_parent"
android :layout_height="wrap_content"
android :layout_marginBottom="10dp"
android :background="@color/white"
android :hint="@string/hint_email"
android :inputType="textEmailAddress"
android :padding="10dp"
android :singleLine="true"
android :textColor="@color/input_login"
android :textColorHint="@color/input_login_hint" />
<EditText
android :id="@+id/password"
android :layout_width="fill_parent"
android :layout_height="wrap_content"
android :layout_marginBottom="10dp"
android :background="@color/white"
android :hint="@string/hint_password"
android :inputType="textPassword"
android :padding="10dp"
android :singleLine="true"
android :textColor="@color/input_login"
android :textColorHint="@color/input_login_hint" />
< !– Login Button –>
<Button
android :id="@+id/btnLogin"
android :layout_width="fill_parent"
android :layout_height="wrap_content"
android :layout_marginTop="20dip"
android :background="@color/btn_login_bg"
android :text="@string/btn_login"
android :textColor="@color/btn_login" />

53
< !– Link to Login Screen –>
<Button
android :id="@+id/btnLinkToRegisterScreen"
android :layout_width="fill_parent"
android :layout_height="wrap_content"
android :layout_marginTop="40dip"
android :background="@null"
android :text="@string/btn_link_to_register"
android :textAllCaps="false"
android :textColor="@color/white"
android :textSize="15dp" />
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android :id="@+id/nav_view"
android :layout_width="wrap_content"
android :layout_height="match_parent"
android :layout_gravity="start"
android :fitsSystemWindows="true"
app :headerLayout="@layout/nav_header_main2"
app :menu="@menu/activity_main2_drawer" />
</android.support.v4.widget.DrawerLayout>

54
3. Le code PHP :

55
WEBOGRAPHIE

1. https ://developer.android.com/index.html

2. http ://ineumann.developpez.com/

3. https ://openclassrooms.com/dashboard
4. http ://www.frandroid.com/comment-faire/tutoriaux/311391_lesmeilleurs-
tutorielspourapprendreamaitriserandroid
5. http ://www.androiddev.fr/

56
Bibliographie

[1] :Programmation Androïd de la conception au déploiement avec le SDK Google

Androïd de Damien Guignard, Julien Chable, Emmanuel Robles Edition Eyrol1es
publié en Avril 2010 Année

http ://www.isima.fr/ lacomme/DevPortable/tutorial_android.pdf

https ://www.irif.univparisdiderot.fr/ carton/Enseignement/XML/Cours/support.pdf

http ://www.academiepro.com/uploads/livres/lart-du-developpement-android.pdf

57