Facebook Twitter Google Plus RSS Feed Email

    dimanche 27 octobre 2013

    Les ateliers seront suspendus!




    Les ateliers d'Enis Android Club seront suspendus pendant deux semaines en raison des DS à l'Ecole Nationale d'ingénieurs de Sfax. Nous reprendrons les activitées juste après (le mercredi 13 Novembre 2013) .
    Bonne courage dans les devoirs  Smiley


    Plusieurs surprises vous attendent.




    jeudi 24 octobre 2013

    [Tutoriel] : ListView Android



    Bonjour tout le monde , ce tutoriel va vous montrer qu'est ce qu'on vu la dérniére séance du Club (23/10/2013 : 4 éme Atelier ) : Les ListView .
    Comme son nom l'indique, une ListView est une liste de vue comprenant des items ;

    lundi 21 octobre 2013

    [Événement] : Atelier Développement Android 4



     EAC organise un atelier ce mercredi (23 Octobre 2013 à l'Ecole Nationale d'ingénieurs de Sfax)  Smiley .

    samedi 12 octobre 2013

    [Actualité] :Arab Mobile App Challenge




    'Arab Mobile App challenge' est le nom de la  nouvelle  événement organisé par l’Ecole Supérieure des Communications de Tunis (Sup’Com) en partenariat avec Silatech et l’ Institute of Applied Innovation, Berkley, USA.

    [Tutoriel] : Changement de vues sous Android (Intent)


    On va un peu plus loin la création et la gestion des vues sous Android. Dans ce tutoriel, vous allez apprendre à gérer le passage d’une vue à une autre dans votre application.
    Le passage d'une vue à une autre signifie qu'il y a un changement d'activités. Pour pouvoir essayer ce tuto , il faut voir ces deux articles : Notions de Base et Design&Tosat&AlertDalog .Smiley

    Nous allons créer un nouveau projet TutoIntentEAC ayant comme activité :  Activity1   (je vais travailler avec 2.2) .
    Tout simplement on va faire une formulaire d'inscription qui permet de passer d'une activité à une autre en passant des données entre les activités .


    Je pense que c'est facile maintenant de créer une telle interface Smiley . non !
    Téléchargement de ressources 

    Activity_1.xml :
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:id="@+id/RelativeLayout1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/back"
        android:orientation="vertical" >

        <EditText
            android:id="@+id/editTextNom"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_centerHorizontal="true"
            android:layout_marginLeft="20dp"
            android:layout_marginRight="20dp"
            android:layout_marginTop="64dp"
            android:hint="Votre nom"
            android:inputType="textPersonName" />

        <EditText
            android:id="@+id/editTextPrenom"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/editTextNom"
            android:layout_centerHorizontal="true"
            android:layout_marginLeft="20dp"
            android:layout_marginRight="20dp"
            android:hint="Votre prénom"
            android:inputType="textPersonName" />

        <EditText
            android:id="@+id/editTextMail"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/editTextPrenom"
            android:layout_centerHorizontal="true"
            android:layout_marginLeft="20dp"
            android:layout_marginRight="20dp"
            android:hint="Votre mail"
            android:inputType="textEmailAddress" />

        <EditText
            android:id="@+id/editTextPassword"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/editTextMail"
            android:layout_centerHorizontal="true"
            android:layout_marginLeft="20dp"
            android:layout_marginRight="20dp"
            android:hint="Votre mot de passe"
            android:inputType="textPassword" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/editTextPassword"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="30dp" >

            <Button
                android:id="@+id/button2"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:drawableLeft="@drawable/exit"
                android:text="Annuler" />

            <Button
                android:id="@+id/button1"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:drawableLeft="@drawable/accept1"
                android:text="Enregistrer" />
        </LinearLayout>


    </RelativeLayout>

    Créons une autre activité maintenant Activity2.
    Sélectionner le projet (clic droite): > New > Other > Android > Android Activity 
    et nommer l'activité  Activity2 , et la layout activity_2.


    Activity_2.xml :
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/back"
    > 

    <TextView
    android:id="@+id/textView1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:layout_marginTop="27dp"
    android:text="Large Text"
    android:textAppearance="?android:attr/textAppearanceLarge" />


    </RelativeLayout>

    Dans l'activité Activity1.java , on récupère les composants par leurs ID , et on ajoute un écouteur d’événement au deux boutons. 
    public class Activity1 extends Activity implements OnClickListener {

    EditText nom;
    EditText prenom;
    EditText mail;
    Button enreg;
    Button annuler;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    //On charge l'interface (layout) activity_1
    setContentView(R.layout.activity_1);
    //récupération des composants  grâce à les ID
    nom=(EditText)findViewById(R.id.editTextNom);
    prenom=(EditText)findViewById(R.id.editTextPrenom);
    mail=(EditText)findViewById(R.id.editTextMail);
    enreg=(Button)findViewById(R.id.button1);
    annuler=(Button)findViewById(R.id.button2);
    //on applique un ecouteur d'évenemnt au clique sur les 2 boutons
    annuler.setOnClickListener(this);
    enreg.setOnClickListener(this);


    }

    Nous allons faire en sorte que lorsqu’un nouvel utilisateur clique sur le bouton “Enregistrer”, il soit redirigé vers une autre vue (Activité 2) en affichant les informations saisis dans la deuxième vue.

    Intent 

    Pour le passage d’une activité à une autre c’est facile. On crée un nouveau Intent (Les intents peuvent être considérés comme des messages utilisées par le système afin de communiquer avec des applications, activités …
      Le premier argument représente le contexte (facilement récupérable à l’aide de l’activité de départ) et le second représente l’activité d’arrivée.
        On utilise la méthode “startActivityForResult” avec comme argument l’intent crée précédemment et un code.Smiley
        Pour les actions de deux boutons on fait un onClickListener sur chaque bouton.
        Dans la méthode onClick :


        public void onClick(View arg0) {

        switch (arg0.getId()) {
        //selon le bouton :
        case R.id.button1:
        // bouton Enregister
        //On crée un nouveau Intent
        Intent i=new Intent(this,Activity2.class);
        this.startActivityForResult(i, 1000);
        break;

        case R.id.button2:
        //  bouton annuler
        //fermer l'app
        finish();
        break;
        }
        }

        Si vous testez le code , le passage vers l'autre activité s’effectue correctement mais les données d'utilisateur ne sont pas transmis Smiley .

        Passage de données d’une activité à une autre:

        Pour transmettre des données, il suffit de les ajouter à l’intent crée précédemment en leur spécifiant une clé permettant de les identifier. (comme si on transmet l'argent Smiley).
        Intent i=new Intent(this,Activity2.class);
        // envoyer les données vers l'autre activité
        i.putExtra("cleNom", nom.getText().toString());
        i.putExtra("clePrenom", prenom.getText().toString());
        i.putExtra("cleMail", mail.getText().toString());

        this.startActivityForResult(i, 1000);

         Il nous reste que recevoir les données par la deuxième activité.
        Dans la méthode onCreate() du Activity2.java , il faut tout d'abord vérifier qu'il y a des données transmis via Intent (Extras).Si oui , alors on récupère les donnés grâce au identifiant (Clé) .
        String s1 = null;
         if (this.getIntent().getExtras()!=null){ //recuperer le nom grace à l'identifiant cleNom                             s1=this.getIntent().getExtras().getString("cleNom");}
        la variable s1 contient donc la valeur du Nom saisis au premier activité , de même pour les autres variables transmises Smiley.
        On peut afficher le contenu de cette variable dans un Toast (ici) lors de lancement de la deuxième activité  dans onCreate() et après le code précédent on tape :

        Toast msg=Toast.makeText(Activity2.this.getApplicationContext(), "Bienvenue "+s1, Toast.LENGTH_LONG);                                                                    msg.show();



        Conclusion:

        Après ce tutoriel , vous êtes capable de construire une application à plusieurs interfaces graphique qui interagissent entre eux (avec Passage des données etc. ) Smiley.
        Voici le code source:(Android 2.2)



        Désolé pour les fautes d'orthographe mais n'hésitez pas à me les dire pour les corriger Smiley et n'hésitez pas de poser vos questions ainsi les commentaires .


        vendredi 11 octobre 2013

        [Tutoriel] : Design , Splash Screen , AlertDialog , Toast



        Salut tout le monde , voici le nouvel tutoriel qui va expliquer qu'est qu'on a vu la dernière séance (Mercredi 9 Octobre 2013) suite à cet événement ." Get ready ! "Smiley.
        Dans ce tutoriel on va présenter 4 choses :
         - Splash Screen
        -  Le design
        - Toast
        - AlertDialog




        Passons maintenant au dévéloppement :

        On va tout d'abord créer un nouveau projet (Design par exemple)



         On va maintenant changer l'icone de notre application : il suffit de cliquer sur le bouton "Browse" ,une fenetre s'ouvre contenant l'arborescence de dossier de votre système,choisissez une image puis valider.




        On peut aussi changer le Shape de l'icone ,ici on voit le résultat du Shape "Circle".


        Aprés , votre projet sera crée: Smiley




        1) Splash Screen :

        Un splash screen  est la toute première fenêtre affichée par une application ou logiciel.
        Cette fenêtre incite l'utilisateur à patienter pendant le chargement et l'installation d'un logiciel tout en lui apportant diverses informations comme le nom du logiciel, le nom de l'éditeur, le logo de l'éditeur ou du logiciel, les droits d'auteur associés au logiciel, la version et l'état du chargement du logiciel.
        Cette fenêtre peut aussi demander à l'utilisateur de s'identifier avec un nom d'utilisateur et un mot de passe.

        Voici  des exemples :
        Avant tout,on va ajouter des photos à notre projet qu'on va ensuite les utiliser dans notre application . Comme vous le savez , les photos sont obligatoirement mises dans le dossier  drawable . Pour ce faire on va faire du copier/coller de nos photos dans le dossier drawable soit on se plaçant dans le dossier drawable dans le dossier de notre application dans notre workspace ou bien en faisant copier/coller directement dans eclipse .

        On va maintent ajouter une autre activité MainActivity .

        On ouvre le layout splash.xml dans le dossier layout de notre application puis on va ajouter une photos à l'interface indiquant que l'activité est en cours de chargement . 
        On fait un drag-and-drop de ImageView dans le layout,une fenetre s'ouvre contenant la liste des images de notre application ,on choisi la photo qu'on veut l'ajouter puis on confirme .
         





        Revenons à l'activité SplashScreen,on va ajuter ces lignes de code :

        package com.enisandroidclub.design;

        import android.os.Bundle;
        import android.os.Handler;
        import android.app.Activity;
        import android.content.Intent;


        public class SplashScreen extends Activity {

            @Override
            protected void onCreate(Bundle savedInstanceState) {
                super.onCreate(savedInstanceState);
                setContentView(R.layout.splash);
               
                new Handler().postDelayed(new Runnable() {
                  

                    @Override

                    public void run() {
                       
                        Intent i = new Intent(SplashScreen.this, MainActivity.class);
                        startActivity(i);

                        finish();

                    }
                }, 3000);
            }

        }


        On lance l'application,l'activité SplashScreen va apparaitre pour 3 secondes puis elle sera fermée et l'activité MainActivity va se lancer .






        Nous voulons maintenant désactiver la barre de titre de l'activité SplashScreen afin qu'elle va apparaitre en plein écran , on ajoute donc cette instruction :

        public class SplashScreen extends Activity {

            @Override
            protected void onCreate(Bundle savedInstanceState) {
                super.onCreate(savedInstanceState);
                
                requestWindowFeature(Window.FEATURE_NO_TITLE);
                
                setContentView(R.layout.splash);
               
                new Handler().postDelayed(new Runnable() {
                  

                    @Override
                    public void run() {
                       
                        Intent i = new Intent(SplashScreen.this, MainActivity.class);
                        startActivity(i);

                        finish();
                    }
                }, 3000);
            }




        Avant d'aborder la notion de Toast, on va faire un peu de design pour l'activité MainActivity,pour ce faire,on va concevoir une activité d’authentification :
        - ajouter une image comme on l'a fait précédemment
        - ajouter deux EditText(Login, Mot de passe) 
        - deux boutons : l'un pour afficher un Toast et l'autre pour afficher un AlertDialog .

        On va faire un drag-and-drop à partir de la palette un ImageView,une fenêtre s'ouvre,on choisit la photo et on valide .

        Ici on modifie la proprieté Hint de l'EditText .
        Ici on ajoute un icone à gauche pour le bouton Exit à partir de la proprieté Drawable Left .







        On va maintenant changer l'arrière plan de l'activité .








        Et voici le résultat après l'exécution .




        2) Les Toast :

        Un toast est une vue contenant un petit message rapide pour l'utilisateur.


        On va récupérer les identifiant des 2 boutons  ,on déclare deux variables de type Button : 

        Button infos;
        Button exit;

        Puis dans la méthode  onCreate on ajoute :

        infos=(Button)findViewById(R.id.infos);
        exit=(Button)findViewById(R.id.exit);
               
        infos.setOnClickListener(this);
        exit.setOnClickListener(this);

        La classe MainActivity implements OnClickListener et on ajoute enfin la méthode public void onClick(View v) qui va contenir le code des actions des boutons .

        switch(v.getId())
                {
                case R.id.infos:
                   
                    Toast t=Toast.makeText(this, "Ceci est un Toast",              Toast.LENGTH_LONG);
                    t.setGravity(Gravity.CENTER, 0, 0);
                    t.show();
                   

                    break;
                   
                case R.id.exit:
                   
                    break;
                }
               
         Ces trois lignes permettent d'afficher un Toast contenant le message "Ceci est un Toast" .

         Toast t=Toast.makeText(this, "Ceci est un Toast",Toast.LENGTH_LONG);
                    t.setGravity(Gravity.CENTER, 0, 0);
                    t.show();

        => setGravity() permet d'indiquer la position qu'on veut y afficher le Toast.
        => show() permet d'afficher le Toast,si on ne l'écrit pas le Toast ne sera pas    affiché .            



        3) Les AlertDialog :

        Dans Android, vous pouvez ajouter des alertes à votre demande pour obtenir le utilisateurs de se concentrer sur quelque chose, comme une mise à jour. La classe AlertDialog est utilisé pour afficher une alerte. Voici comment faire pour implémenter la fonctionnalité dans votre application.

        Voir les étapes qui découlent:
        1- Tout d'abord, utiliser le AlertDialog.Builder pour créer l'interface d'alerte de la boîte, comme le titre, message à afficher, des boutons, et un bouton fonction onclick 
        2- Joindre plus tard au-dessus de constructeur à AlertDialog et l'afficher. 
        3- Terminé. 


        @Override
            public void onClick(View v) {
                switch(v.getId())
                {
                case R.id.infos:
                   
                    Toast t=Toast.makeText(this, "Ceci est un Toast", Toast.LENGTH_LONG);
                    t.setGravity(Gravity.CENTER, 0, 0);
                    t.show();
                   
                    break;
                   
                case R.id.exit:
                   
                    AlertDialog.Builder ad= new AlertDialog.Builder(this);
                    ad.setTitle("Quitter");
                    ad.setMessage("Voulez-vous vraiment quitter l'application ?");
                    ad.setIcon(R.drawable.alert);
                    ad.show();
                   
                    break;

                }
               
            } 




        On va ajouter maintenant plus d’interaction avec la boite de dialogue en ajoutant des boutons de confirmation (Oui / Non),si Oui on va qui l'application sinon on va rien faire .

        case R.id.exit:
                   
                    AlertDialog.Builder ad= new AlertDialog.Builder(this);
                    ad.setTitle("Quitter");
                    ad.setMessage("Voulez-vous vraiment quitter l'application ?");
                    ad.setIcon(R.drawable.alert);


                    ad.setPositiveButton("Oui",new android.content.DialogInterface.OnClickListener() {
                       
                        @Override
                        public void onClick(DialogInterface dialog, int which) {
                            finish();
                           
                        }
                    });
                    ad.setNegativeButton("Non",new android.content.DialogInterface.OnClickListener() {
                       
                        @Override
                        public void onClick(DialogInterface dialog, int which) {
                       
                           
                        }
                    });


                    ad.show();
                   
                    break;


        Avant de finir , je veux vous donner une astuce comment changer le font d'un TextView par exemple avec un font de votre choix et qui n'est pas integré dans le SDK Android,pour ce faire je vous recommande ce site qui vous offre une grande bibliothèque de font .

        1- Ajouter un fichier font de type .ttf au dossier Assets de l'application (nommé par exemple androidfont.ttf) .

        2- On ajoute par exemple un TextView au layout splash.xml 



        On ajoute ces ligne de code à l'activité SplashScreen :

        txt=(TextView)findViewById(R.id.textView1);
        Typeface font=Typeface.createFromAsset(getAssets(), "androidfont.ttf");
        txt.setTypeface(font);




        Ce tutoriel est fini Smiley ,on espère que tout a été clair et n'osez pas de poser des questions ou des remarques .
        A bientôt .

        Sauvegarder le lien

        Twitter Delicious Facebook Digg Stumbleupon Favorites More

        Recherche

        Pages vues

        Articles populaires

        Notre page facebook

        Libellés

        Tutoriel (17) Android (12) Activite (10) Actualite (6) Event (5) 2014 (3) Compétition (2) MySQL (2) json (2) php (2) webservices (2) APK (1) Design (1) Formation (1) KitKat (1) SIB (1) Securité (1) sfax (1)
        Copyright © ENIS Android Club