samedi 22 août 2015

Android drawer activity :

il est très simple de créer une application android de base utilisant le drawer activity :

ouvrir android studio , choisir créer une nouvelle application android et dans les activités proposées choisir le drawer activity :

créer l'application et l'adapter à vos besoins .

Les seuls fichiers à modifier sont le mainActivity dans les procécédures oncreateView et onSectionAttached(int number) , puis le fichier fragment_main.xml ( qui ne contient qu'un TextView) en ajoutant un ImageView si on veut afficher des images ou un autre TextView pour afficher du texte dans une autre zone de texte .
On doit également adapter le fichier string.xml situé dans  res/values/ de la facon suivante par exemple :

<resources>
    <string name="app_name">Diop Fragment</string>

    <string name="title_section1">Macky</string>
    <string name="title_section2">Obama</string>
    <string name="title_section3">Hollande</string>
    <string name="title_section4">Maitre Wade</string>
    <string name="title_section5">Mandela</string>

    <string name="navigation_drawer_open">Open navigation drawer</string>
    <string name="navigation_drawer_close">Close navigation drawer</string>

    <string name="action_example">Example action</string>

    <string name="action_settings">Settings</string>
</resources>
 
ici on veut afficher les infos sur Macky , Obama,Hollande,
Maitre Wade, Mandela .

Ces noms sont automatiquement mis a jour dans la procédure 
onSectionAttached(int number) du fichier mainActivity.java car cette 
procedure utilise les appels comme 
getString(R.string.title_section1);

Tout cela sera expliqué dans ce qui suit :

1°)  je crée une application nommee Diop Fragment
2°) La classe main je la nomme Restau(je ne sais pourquoi !! j'avais peut-etre faim au moment de la création)
3°) Je valide  puis je choisis  comme activity le drawer activity .
4°) Je valide et j'attends que mon application s'ouvre .
J'obtient 2 fichiers java :
Restau.java et NavigationDrawerFragment
et  3 fichiers xml :
activity_restau.xml , fragment_navigation_drawer.xml et fragment_restau.xml .

Seul Restau.java  et fragment_restau.xml seront modifiés .
5°) Je cherche des images de macky,obama,maitre wade,mandela sur internet et je les ajoute dans le dossier res/drawer .
Souvent les images téléchargées sont en jpg ; je les ouvre sous paint et les enregistre au format png si je veux du png mais on peut aussi garder le format jpg même si le png est conseillé .

6°) J'ajoute une ImageView dans fragment_restau.xml ;
IMPORTANT : pour que le drawer  fonctionne correctement  il faut initialiser l'affichage avec le premier élément à afficher (Macky dans notre exemple )  en ajoutant le
android:src="@drawable/makcysall" .

on obtient comme fragment_resteau.xml suivant :

<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:paddingLeft="@dimen/activity_horizontal_margin" 
 android:paddingRight="@dimen/activity_horizontal_margin" 
 android:paddingTop="@dimen/activity_vertical_margin" 
 android:paddingBottom="@dimen/activity_vertical_margin" 
 tools:context=".Restau$PlaceholderFragment">

 <TextView 
 android:id="@+id/section_label" 
 android:layout_width="wrap_content" 
 android:layout_height="wrap_content" />
 
 <ImageView 
 android:id="@+id/imageView" 
 android:layout_width="wrap_content" 
 android:layout_height="wrap_content" 
 android:layout_below="@+id/section_label" 
 android:layout_toEndOf="@+id/section_label" 
 android:src="@drawable/mackysall"  
 android:layout_marginTop="53dp" />

</RelativeLayout>

6°) je modifie le fichier Restau.java de la façon suivante :
procedure :   onSectionAttached :

public void onSectionAttached(int number) {
    switch (number) {
        case 1:
            mTitle = getString(R.string.title_section1);
            break;
        case 2:
            mTitle = getString(R.string.title_section2);
            break;
        case 3:
            mTitle = getString(R.string.title_section3);
            break;
        case 4:
            mTitle = getString(R.string.title_section4);
            break;
        case 5:
            mTitle = getString(R.string.title_section5);
            break;
    }
}

procedure :   onCreateView :
c'est la procedure pour le choix de l'image et du texte à afficher en fonction de l'item choisi :
il sera remarqué que mTitle n'est pas static donc il suffira de rajouter static devant sa declaration en tête de procedure  :


public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    View rootView = inflater.inflate(R.layout.fragment_restau,
 container, false);
    TextView tv = (TextView)rootView.findViewById(R.id.section_label);
    ImageView iv = (ImageView)rootView.findViewById(R.id.imageView);
    String s = mTitle.toString();
    //********************************** 
 if(s.contains("Macky Sall"))
    {
        tv.setTextColor(Color.RED);
        tv.setText("Macky , President du senegal");
        iv.setImageResource(R.drawable.mackysall);}
    //********************************* 
 if(s.contains("Obama"))
    {
        tv.setTextColor(Color.MAGENTA);
        tv.setText("Obama , President des USA");
        iv.setImageResource(R.drawable.obama);}
    //********************************* 
 if(s.contains("Hollande"))
    {
        tv.setTextColor(Color.GREEN);
        tv.setText("Hollande , de France");
        iv.setImageResource(R.drawable.hollande);}
    //********************************* 
 if(s.contains("Maitre Wade"))
    {
        tv.setTextColor(Color.BLUE);
        tv.setText("Maitre wade , le BON");
        iv.setImageResource(R.drawable.maitrewade);}
    //********************************* 
 if(s.contains("Mandela"))
    {
        tv.setTextColor(Color.GREEN);
        tv.setText("Mandela , de Afique du Sud");
        iv.setImageResource(R.drawable.mandela);}
    //*********************************
    return rootView;
}


That's all ; run your application and adapt it to your needs .