[tutoriel] communication android avec mysql [php] [ partie 2_2 ] +bonus

7/22/2019 [Tutoriel] Communication Android Avec MySQL [PHP] [ Partie 2_2 ] +BONUS

1/21

Bienvenue ,ceci est la deuxime partie du tutoriel prcdant [Tutoriel] :Communication Android avec

MySQL [PHP] [ Partie 1/2 ].

Notre objectif est de faire communiquer notre application Android avec une base de donnes MySQLet faire diffrents oprations (CRUD).

Comme le titre indique il y a un BONUS .

Voici le rsultat final de ce tutoriel :

Je sais que vous allez "scroller" jusqu' la fin pour voir le Bonus , mais , je vais commencer par ce bonus

tout d'abord

Partie 0 : Bonus : ProgressDialog personnalis:
http://www.enis-androidclub.tk/2014/04/tutoAndroidMysql.htmlhttp://4.bp.blogspot.com/-foqEO4-j7oQ/U1GrJPtgL4I/AAAAAAAAC7U/FAcA-Ig5pX0/s1600/remotejsong.png


2/21

CustomProgressDialog

Plusieurs entre vous dveloppent des applications android qui ncessitent que l'utilisateur attend un

peu du temps afin que le traitement soit termin . Pour cela on utilise des progressDiaolg pour

demander de l'utilisateur de patienter ou l'informer .

Je vais vous montrer comment personnaliser un progressDialog moderne .

Tout d'abord on cre un nouveau projet Android (vous le savez comme mme )

On va crer une classe "CustomProgressDialog" quis'tend de la classe "Diaolg" :et avec un ctrl

+ shift + otout va bien :

public class CustomProgressDialog extends Dialog {

private ImageView iv;

public CustomProgressDialog(Context context, int resourceIdOfImage) {

super(context, R.style.TransparentProgressDialog);

WindowManager.LayoutParams wlmp = getWindow().getAttributes();

wlmp.gravity = Gravity.CENTER_HORIZONTAL;

getWindow().setAttributes(wlmp);

setCancelable(false);

setOnCancelListener(null);

LinearLayout layout = new LinearLayout(context);

layout.setOrientation(LinearLayout.VERTICAL);

LinearLayout.LayoutParams params = new
https://images-blogger-opensocial.googleusercontent.com/gadgets/proxy?url=http%3A%2F%2Ffr.openclassrooms.com%2Fbundles%2Fcommon%2Fimages%2Fsmiley%2Fheureux.png&container=blogger&gadget=a&rewriteMime=image%2F*http://1.bp.blogspot.com/-yIVIrmeZ3E0/U1H89h2Oi_I/AAAAAAAAC-E/KS9bl8UNQ5o/s1600/progress.png


3/21

LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);

iv = new ImageView(context);

iv.setImageResource(resourceIdOfImage);

layout.addView(iv, params);

addContentView(layout, params);

}

@Override

public void show() {

super.show();

RotateAnimation anim = new RotateAnimation(0.0f, 360.0f ,

Animation.RELATIVE_TO_SELF, .5f, Animation.RELATIVE_TO_SELF, .5f);

anim.setInterpolator(new LinearInterpolator());

anim.setRepeatCount(Animation.INFINITE);

anim.setDuration(3000);

iv.setAnimation(anim);

iv.startAnimation(anim);

}

}

- Il nous reste qu'ajouter la configuration du style dans le fichier"res/values/styles.xml":

@null

@android:color/transparent

true

@null

@null

@android:style/Animation.Dialog

stateUnspecified|adjustPan

true

@android:color/transparent


4/21

- Pour tester ce progressDialog , il suffit d'instancier la classe et appeler la mthode "show":

CustomProgressDialog progressDialog = new CustomProgressDialog(this,

R.drawable.loading_throbber);

progressDialog.setCancelable(true);

progressDialog.show();

//progressDialog.dismiss();- Ajouter cette photo dans le dossier drawable (vous pouvez la changer par un autre modle) :

Partie 1 : Let's code:

Revenons notre objectif principal : communiquer notre application Android avec une base de

donnes MySQL et faire diffrents oprations (CRUD).

Comme on vu dans la premire partie, notre base (avec un seul table et 4 champs ) est un peu gnrale

, vous pouvez travaillez sur vos base .

Voici le concept gnral de notre application :
http://4.bp.blogspot.com/-vwZ7XcSE57E/U1IGnKUXrLI/AAAAAAAAC-g/BS37jsufBlc/s1600/Sans+titre.pnghttp://1.bp.blogspot.com/-GdPj6ZyjgVQ/UpFVu65IqoI/AAAAAAAABIs/caQJFATElqI/s1600/Capture+du+2013-11-24+02%253A26%253A00.pnghttp://4.bp.blogspot.com/-EEcUBLFZScA/U1IBd8i_c6I/AAAAAAAAC-Q/Yv7Jmqz-gzQ/s1600/loading_throbber.png


5/21

O: Avant de commencer : AsyncTask , HTTP request , parsing ?? :

Il y a des notions qu'on va les utiliser dans le dveloppement de notre application:

1. AsyncTask: vous permet de faire proprement et facilement des oprations en parallle duthread UI. Cette classe permet d'effectuer des oprations d'arrire-plan et de publier les

rsultats dans le thread UI sans avoir manipuler de threads ou de handlers.

private class AddDataAsyncTask extends AsyncTask {

@Override

protected void onPreExecute() {

// TODO Auto-generated method stub

super.onPreExecute();

// faire des traitement avant mettre des requtes : montrer progressDialog par exmple

}

@Override

protected Void doInBackground(Void... params) {


// ici on fait les requetes ,retourner les reponser et transformer les donnes JSON (Parsing)

return null;

}

@Override

protected void onPostExecute(Void result) {


super.onPostExecute(result);

// ici on crit le code aprs l'excution de doInBackground

// par exmemple : cache le progressDialog , afficher les rsultats etc..

}

}
http://1.bp.blogspot.com/-fo46Ic2JSxg/U1IomZRwp0I/AAAAAAAAC_s/5amIgJKiRsk/s1600/test1.png


6/21

Remarques:

viter les traitements cot U/I dans la mthode doInBackgound ( passage entre activits ,

cache le progressDialog etc.. )

Essayer toujours de faire des logs (afficher les rsultats dans le logcat ) pour dcouvrir

facilement les erreurs. (mme aprs chaque ligne Log.i("msg",monValeur))

Il faut bien connatre le retour de vos fonctions PHP (JSON) afin de les rcuprer .

(JSONObject, JSONArray etc. )

VERIFIER QUE LA PERMESSION INTERNET EST AJOUTE SVP .

Essayer d'utiliser lmulateur Genymotion: Rapide , performant

Pour faire des requtes HTTP et retourner la rponse , on va utiliser utiliser une classe dveloppe

parRavi Tamadadans son fameux site des tutoriels AndroidHive:ServiceHandler:elle va nous faciliteles choses

http://pastebin.com/4VsfVvCA
http://pastebin.com/4VsfVvCAhttps://images-blogger-opensocial.googleusercontent.com/gadgets/proxy?url=http%3A%2F%2Ffr.openclassrooms.com%2Fbundles%2Fcommon%2Fimages%2Fsmiley%2Fheureux.png&container=blogger&gadget=a&rewriteMime=image%2F*http://www.androidhive.info/https://www.facebook.com/ravi8xhttps://cloud.genymotion.com/page/launchpad/download/http://2.bp.blogspot.com/-UBvd4XhWlmc/U1IvB2jgWbI/AAAAAAAADAA/DKv54PDR00I/s1600/test1.pnghttp://2.bp.blogspot.com/-UBvd4XhWlmc/U1IvB2jgWbI/AAAAAAAAC_8/Op5Zuzojscg/s1600/test1.png


7/21

1: ActivityMain :Ajouter des donnes la base :

Cette activit a pour but ,d'ajouter des donnes la base insres par lutilisateur.

Voici le code xml du layout activity_main : http://pastebin.com/TE7whc3w

MainActivity

Avant de passer coder ,rappelons qu'on va utiliser le fichier ajout_bd.php

Donc on va transmettre 3 valeurs : col2, col3 et col4

==> HTTP POST request

et on a comme rsultat : un seul objet (JSONObject) qui contient un entieret une chane de

caractres (String)

Let's code !

Dans la classe MainActivity , on va dclarer des variables globales (avant on Create()) :

CustomProgressDialog progressDialog;

Button ajout,annuler;
http://2.bp.blogspot.com/-vFVBWnZo56M/U1IaR4RGQVI/AAAAAAAAC_E/p0dsbiQ4bwM/s1600/tes1.pnghttp://1.bp.blogspot.com/-3obaHOUc6uw/U1IZvt3x98I/AAAAAAAAC-4/P5y5CJFA4NE/s1600/tes1.pnghttp://1.bp.blogspot.com/-9j5I3Q1T6TA/U1IY5JHUd7I/AAAAAAAAC-w/utUjrqxAuuw/s1600/tes1.pnghttp://pastebin.com/TE7whc3w


8/21

EditText col2Valeur,col3Valeur,col4Valeur;

String urlAdd="http://address_IP_du_PC/enis_android_club/ajout_bd.php";

AddDataAsyncTask AddData; // instance de notre asyncTask

String message;

int success;

- Dans la mthode onCreate,on dfinit les variables (les boutons etc.. ) , les listeners des boutons

etc. :

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

progressDialog = new CustomProgressDialog(this,



ajout=(Button)findViewById(R.id.ajout);

annuler=(Button)findViewById(R.id.annuler);

col2Valeur=(EditText)findViewById(R.id.col2);



AddData =new AddDataAsyncTask();

ajout.setOnClickListener(new OnClickListener() {

@Override

public void onClick(View arg0) {

AddData.execute();// excuter l'asyncTask

}

});

}

- Maintenant on va dfinir notre asyncTask pas pas :Dans la mme classe Main , on cre une classe

prive s'tend de AsyncTask nomme :AddDataAsyncTask


@Override


Log.i("add", "onPreExecute");



9/21

// ici on va afficher notre progressDialog

}

@Override


Log.i("add", " start doInBackground"); /*ici on va faire notre requte de type POST

puisqu'on a des donnes envoyer

rcuprer la rponse et extraire les donnes

comme on dit prcdemment , le rponse contient un

seul JSONObject avec un entier et String */

Log.i("add", " end doInBackground");

return null;

}

@Override


Log.i("add", "onPostExecute");


/* ici on va cacher le progressDialog

et afficher un Toast selon le rsultat */

}

}

- Donc on obtient : (http://pastebin.com/Apv7KYMi : code total)


@Override





}

@Override

http://pastebin.com/Apv7KYMi


10/21

Log.i("add", " start doInBackground");

// Creating service handler class instance

ServiceHandler sh = new ServiceHandler();

List nameValuePair = new ArrayList(1);

nameValuePair.add(new

BasicNameValuePair("col2",col2Valeur.getText().toString()));





// Making a request to url and getting response

String jsonStr = sh.makeServiceCall(urlAdd,

ServiceHandler.POST,nameValuePair); // type =POST

Log.d("Response: ",jsonStr);

if (jsonStr != null) {

try {

JSONObject jsonObj = new JSONObject(jsonStr);

success = jsonObj.getInt("success");

message = jsonObj.getString("message");

Log.i("suucess", String.valueOf(success));

Log.i("message", message);

} catch (JSONException e) {

e.printStackTrace();

}

}


return null;

}


11/21


12/21

Remarque:

Si vous cliquez autre fois sur le bouton ajouter , votre application va se fermer (crasher) et

l'erreur c'est que AddData est nulle .La solution est de changer la mthode onClick comme

suit :

public void onClick(View arg0) {

AddData =new AddDataAsyncTask();

AddData.execute();

}

2: ListDataActivity :Afficher les donnes de la base :

- On ajoute une nouvelle activit la projet ListDataActivity dont on va lister les donnes insres

dans notre base en appelant le fichier affichage_bd.php.

Rappelons qu'on a pas des donnes envoyer ==>HTTP GET

& pour la rponse , il diffre selon la valeur de success:

Si success = 0 :
http://3.bp.blogspot.com/-fo46Ic2JSxg/U1IomZRwp0I/AAAAAAAAC_w/Gd2y2Za6G34/s1600/test1.pnghttp://2.bp.blogspot.com/-0kz24H9Mc4g/U1IhqsMB3KI/AAAAAAAAC_U/_YMWd4nqfzw/s1600/tes1.png


13/21

Donc on a dans ce cas un seul JSONObject qui contient un entier et un string.

Si success = 1:

Donc on a dans ce cas un seul JSONObject qui contient un entier (success=1) ,et JSONArray (tableau)

dont les indices sont les col1, col2, col3 et col4

- Ainsi , dans l'asyncTask (doInBackground) , on va travailler sur la valeur success, on le rcupere tout

dabord , & selon son valeur on dcide de rcuprer le reste des donnes

- On va procder comme la premire activit.

- Notre layoutcomporte qu'une listView: http://pastebin.com/u8SbFfT5

- Pour faciliter le travail , notre listView sera simple nonpersonnalis (les donnes d'une ligne de la base serontaffiches dans la mme ligne ) . Si vous voulezpersonnaliser votre liste , jetez un il sur ce tutoriel: [Tutoriel] : ListView Android .

Variables globales:

CustomProgressDialog progressDialog;

String urlGet="http://192.168.1.*/enis_android_club/affichage_bd.php";

//adresse IP du PC

GetDataAsyncTask getData;

String message;
http://www.enis-androidclub.tk/2013/10/listViewAndroidtuto.htmlhttp://pastebin.com/u8SbFfT5https://images-blogger-opensocial.googleusercontent.com/gadgets/proxy?url=http%3A%2F%2Ffr.openclassrooms.com%2Fbundles%2Fcommon%2Fimages%2Fsmiley%2Fheureux.png&container=blogger&gadget=a&rewriteMime=image%2F*http://2.bp.blogspot.com/-UBvd4XhWlmc/U1IvB2jgWbI/AAAAAAAADAA/DKv54PDR00I/s1600/test1.png


14/21

int success;

ListView lv;

List myListofData ;

ArrayAdapter arrayadp;

OnCreate:

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_list_data);

progressDialog = new CustomProgressDialog(this,



lv=(ListView)findViewById(R.id.listView1);

myListofData = new ArrayList();

getData=new GetDataAsyncTask();

getData.execute();

}

Notre asyncTask : GetDataAsynck (la mme faon que la prcdente):

private class GetDataAsyncTask extends AsyncTask {

@Override





}

@Override


Log.i("add", " start doInBackground");


// Making a request to url and getting response String jsonStr = sh.makeServiceCall(urlGet, ServiceHandler.GET);



15/21


try {


// return value of success

success=jsonObj.getInt("success"); Log.i("success", String.valueOf(success));

if (success==0)

{

// success=0 ==> there is a string = message

message=jsonObj.getString("message");


}

else if (success==1)

{

// success=1 ==> there is an array of data = valeurs

JSONArray dataValues = jsonObj.getJSONArray("valeurs");

// loop each row in the array

for(int j=0;j


16/21


}

} else {

Log.e("ServiceHandler", "Couldn't get any data from the url");

}


return null;

}

@Override


Log.i("add", "onPostExecute");


if (progressDialog.isShowing())

{

progressDialog.dismiss();

}

if(success==1)

{

Toast.makeText(getApplicationContext(), "Bien rcues ",

Toast.LENGTH_LONG).show();

// show the list view contains the data

arrayadp=new ArrayAdapter(getApplicationContext(),

android.R.layout.simple_list_item_1,

myListofData);

lv.setAdapter(arrayadp);

}

else

{

Toast.makeText(getApplicationContext(), "Erreur",


}

}

}

Remarques:


17/21

J'ai ajout un autre bouton dans la 1er activit qui permet d'afficher la 2eme (ListDatActivity)

N'oublier pas de vrifier que la deuxime activit est ajoute dans le manifest.xml

Vous pouvez galement changer l'adaptateur de la listeView.

L'asynckTask est excut ds que l'activit est cre.

Il faut tre attentif la format JSON du rponse: JSONObject , JSONArray (array de donnes)

exemple d'affichage d'une ligne de la liste

Voici le code total de la deuxime activit http://pastebin.com/qUEeT8AJ

3: EditSuppActivity :Editer / Supprimer une donne de la base :

Pour le moment , nous avons dvelopps deux activits qui contiennent deux asyncktask

(GET& POST) avec diffrents rponses.

Cette activit (EditSuppActivity) pour but de modifier ou supprimer une donne choisit

par utilisateur en cliquant sur une ligne de listeView.

Pour moi , j'ai simplifi la liste en mettant tout les donnes dans la mme ligne , donc encliquant sur une ligne , je vais extraire les donnes chacune dans une variable et les envoient

vers cette activit en utilisant intent

On modifie l'activit ListDataActivity en ajoutant dans la mthodeonCreate:

lv.setOnItemClickListener(new OnItemClickListener() {

public void onItemClick(AdapterView arg0, View arg1, int arg2,long

arg3) {

// s= value of seleted row

String s=(String) (lv.getItemAtPosition(arg2));

// on each row , I have save all of data separted by '-' : col1-

col2-col3-col4

String[] patrs = s.split(" - ");

//parts[0] contains value of col1 , parts [1] contains value of

col2 of each row

Intent intent = new Intent(ListDataActivity.this,

EditSuppActivity.class);
http://pastebin.com/qUEeT8AJhttp://4.bp.blogspot.com/-fbww_faNEqs/U1I85Pw89MI/AAAAAAAADAM/88SNVLUzxUM/s1600/test2.png


18/21

//send data to the next activity

intent.putExtra("col1Value", patrs[0]);




startActivityForResult(intent, 100); finish();

}

});

Aprs avoir passer les donnes , on va les mettre dans des EditText inchanges

(setEnabled(false)).

On cre 3 Boutons :

1. Editer : pour activer la modification

2. Enregistrer : pour sauvegarder les donnes (Mise jour dans la base)

3. Supprimer :pour supprimer les donnes de la base.

4. Code xml du layout activity_edit_supp.xml :http://pastebin.com/RR17Uz5j

activity_edit_supp.xml

Bon le dmarche est le suivant :
http://3.bp.blogspot.com/-q5vrzaGV840/U1JPuHPTlgI/AAAAAAAADAc/DGWE0xHm6Sc/s1600/TEST.pnghttp://pastebin.com/RR17Uz5j


19/21

1. Si l'utilisateur clique sur Supprimer(les autres sont desactivs) : les donnes seront

supprimes de la base ==> AsyncTask

2. S'il clique sur Editer, les champs seront actives ainsi le bouton Enregistrer.

3. C'est un jeu de boutons

A- SuppDataAsyncTask : AsyncTask pour supprimer la ligne slectionne:

C'est presque comme les classes prcdents !

==> On doit envoyer une valeur (paramtre : col1) ==> HTTP POST

Pour le retour de la requte:

==> Un JSONObject avec un entier et String

On dclare les variables globales ncessaires : urlSupp(url vers le

fichiersuppression_bd.php), success , message , progressDialog:

supp.setOnClickListener(new OnClickListener() {

@Override

public void onClick(View v) {


new SuppDataAsyncTask().execute();

}

});

& pour l'asyncTask :

private class SuppDataAsyncTask extends AsyncTask {

@Override


Log.i("supp", "onPreExecute");



}
http://1.bp.blogspot.com/-LzwmQL69m48/U1JV1Vg9M7I/AAAAAAAADA0/atbQQh6KDB4/s1600/test.pnghttp://3.bp.blogspot.com/-I12_jOx7Lhs/U1JVH6iw9hI/AAAAAAAADAs/QLVNT6PgQ9g/s1600/test.pnghttps://images-blogger-opensocial.googleusercontent.com/gadgets/proxy?url=http%3A%2F%2Ffr.openclassrooms.com%2Fbundles%2Fcommon%2Fimages%2Fsmiley%2Fheureux.png&container=blogger&gadget=a&rewriteMime=image%2F*


20/21

@Override


Log.i("supp", " start doInBackground");


List nameValuePair = new ArrayList(1);

nameValuePair.add(newBasicNameValuePair("col1",valCOL1.getText().toString()));

// Making a request to url and getting response

String jsonStr = sh.makeServiceCall(urlSupp,

ServiceHandler.POST,nameValuePair);



try {


// return value of success

success=jsonObj.getInt("success");

message = jsonObj.getString("message");

Log.i("suucess", String.valueOf(success));


} catch (JSONException e) {


}

} else {

Log.e("ServiceHandler", "Couldn't get any data from the url");

}

Log.i("supp", " end doInBackground");

return null;

}

@Override


Log.i("supp", "onPostExecute");



21/21

if (progressDialog.isShowing())

{

progressDialog.dismiss();

}

if(success==1)

{ Toast.makeText(getApplicationContext(), "Supprim ",


}

else

{

Toast.makeText(getApplicationContext(), "Erreur",


}

Intent intent = new Intent(EditSuppActivity.this,

ListDataActivity.class);

startActivityForResult(intent, 100);

finish();

}

}

B- UpdateDataAsyncTask : AsyncTask pour mise jour la ligne slectionne:

Cette asyncTask est similaire l'asyncTask d'jout de donnes (mais dans la requte en ajoute la valeur

de col1)

Je pense que vous avez appris le principe :D

Partie 3 : Conclusion:

Aprs ces deux parties , j'espre que vous avez appris une leon trs important dans la vie

professionelle (PFE , tude etc. ) .

Il y a beaucoup des notions , mais ce sont facile comprendre , surtout que ce tutoriel est gnrale et

vous pouvez l'utiliser tel qu'il est en changants les champs (col1= id , col2= prix etc.. )

Je vous souhaite bonne chance , et s 'il y a une question , n'hesitez pas de nous contacter et poser vos

questions soit par email ([email protected]) soit par un commentaire.

En fin je vous donne le lien de tlchargemnt du code source total: lien
https://images-blogger-opensocial.googleusercontent.com/gadgets/proxy?url=http%3A%2F%2Ffr.openclassrooms.com%2Fbundles%2Fcommon%2Fimages%2Fsmiley%2Fheureux.png&container=blogger&gadget=a&rewriteMime=image%2F*https://www.mediafire.com/?4bb3fq45ab289xbhttps://images-blogger-opensocial.googleusercontent.com/gadgets/proxy?url=http%3A%2F%2Ffr.openclassrooms.com%2Fbundles%2Fcommon%2Fimages%2Fsmiley%2Fheureux.png&container=blogger&gadget=a&rewriteMime=image%2F*

[tutoriel] communication android avec mysql [php] [ partie 2_2 ] +bonus

Documents