Exemples de DialogFragment Android

La manière la plus flexible de créer une boîte de dialogue n'est pas d'utiliser la classe andorid.app.Dialog mais la classe DialogFragment. Grâce à elle, vous bénéficiez de toutes les fonctionnalités du fragment, y compris la possibilité d'observer le cycle de vie du dialogue et d'utiliser des ViewModels.

Qu'est-ce qu'un DialogFragment ?

Un DialogFragment est un fragment qui affiche une fenêtre de dialogue, flottant au dessus de la fenêtre de son activité. Ce fragment contient un objet Dialog, qu'il affiche de manière appropriée en fonction de l'état du fragment.

Dans cette classe, nous utilisons le support dialogfragment puisque le framework android.app.dialogFragment a été déprécié au niveau 28 de l'API.

Notre implémentation va surcharger cette classe et implémenter
le onCreateView(LayoutInflater, ViewGroup, Bundle) pour fournir le contenu de la boîte de dialogue. Nous pouvons également surcharger onCreateDialog(Bundle) pour créer une boîte de dialogue entièrement personnalisée, telle qu'un AlertDialog, avec son propre contenu.

Dans cet article, nous allons apprendre ce qui suit :

1. Créer un dialogue avec ListView en kotlin.
2. Utilisation de DialogFragment pour créer des dialogues avec une mise en page personnalisée, comme des dialogues d'alerte, des dialogues de saisie, etc.
3. Créer des menus popup

(a). Kotlin Android DialogFragment avec ListView

Tutoriel Kotlin Android DialogFragment avec ListView.

Nous voulons voir comment ouvrir un DialogFragment lorsqu'un simple bouton est cliqué. Le dialogFragment sera composé d'un titre et d'une liste.

Nous le gonflons via la classe LayoutInflater à partir d'une spécification de mise en page xml.

Lorsque l'utilisateur clique sur un élément de la liste, nous l'affichons dans un Toast. Lorsque l'utilisateur clique en dehors du DialogFragment, nous le rejetons (le DialogFragment).

Allons-y.

Tutoriel vidéo

Nous avons un tutoriel vidéo comme alternative à ceci. Si vous préférez les tutoriels comme celui-ci, il serait bon de vous abonner à notre chaîne YouTube. Fondamentalement, nous avons une télévision pour la programmation où faire des tutoriels quotidiens en particulier Android.

Kotlin Android DialogFragment avec simple ListView

Regardons un exemple complet.

Outils

1. IDE : Android Studio - l'IDE officiel d'android soutenu par Jetbrains et Google.
2. Langage : Kotlin - Langage statiquement typé développé par Jetbrains.
3. Emulateur : Nox Player - Un émulateur assez rapide pour ma machine lente.

Scripts Gradle

Nous commençons par explorer nos scripts Gradle.

(a). build.gradle(App)

Voici notre fichier build.gradle au niveau **app. Nous avons le DSL des dépendances où nous ajoutons nos dépendances.

Ce fichier est appelé app level build.gradle puisqu'il est situé dans le dossier app du projet.

Si vous utilisez Android Studio version 3 et supérieure, utilisez le mot-clé implementation tandis que si vous utilisez une version inférieure à 3, utilisez toujours le mot-clé compile.

Une fois que vous avez modifié ce fichier build.gradle, vous devez synchroniser votre projet. Android Studio va en effet vous demander de le faire.

apply plugin: 'com.android.application'

apply plugin: 'kotlin-android'

apply plugin: 'kotlin-android-extensions'

android {
    compileSdkVersion 28
    defaultConfig {
        applicationId "info.camposha.kotlindialogfragment"
        minSdkVersion 15
        targetSdkVersion 28
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    implementation fileTree(dir: 'libs', include: ['*.jar'])
    implementation"org.jetbrains.kotlin:kotlin-stdlib-jre7:$kotlin_version"
    implementation 'com.android.support:appcompat-v7:28.0.0-rc01'
}

Vous pouvez également voir que nous avons commencé par appliquer deux plugins spécifiques à kotlin dans notre fichier build.gradle :

apply plugin: 'kotlin-android'
apply plugin: 'kotlin-android-extensions'

c'est-à-dire kotlin-android et kotlin-android-extensions.

Code Kotlin

Les applications Android peuvent être principalement écrites en Java ou en Kotlin. De nos jours, il existe cependant de nombreux frameworks comme Flutter qui utilisent des langages comme Dart.

Dans ce cours, nous utilisons le langage de programmation Kotlin.

Nous aurons ces classes dans notre projet.

(a). PioneersFragment.kt

Représente notre FragmentDialog et sera en fait dérivé de celui-ci.

1. Création d'un DialogFragment.

Nous commençons par créer une classe Kotlin qui dérive de android.support.v4.app.DialogFragment. Nous utilisons la bibliothèque de support fragment puisque android.app.DialogFragment est déprécié.

class PioneersFragment : DialogFragment() {..}

Notez que la déclaration ci-dessus a inclus un constructeur vide par défaut pour notre DialogFragment. Nous le faisons en utilisant les parenthèses(()) en Kotlin.

2. Surcharge de la fonction OnCreateView() de DialogFragment.

Nous allons ensuite surcharger la méthode onCreateView() de la classe Fragment.

 override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {..}

Nous avons passé trois paramètres :

1. Un objet LayoutInflater.
2. Objet ViewGroup.
3. Objet Bundle.

3. Gonfler une mise en page dans un DialogFragment.

Dans la méthode, nous gonflons d'abord le layout R.layout.fraglayout via la méthode inflate, en utilisant l'instance LayoutInflater.

        val rootView = inflater.inflate(R.layout.fraglayout, container)

4. Création d'un tableau Kotlin

Créez ensuite un tableau Kotlin en utilisant la méthode arrayOf(). Cela agira comme notre source de données pour héberger les pionniers. C'est ce que nous lierons à la ListView que nous montrerons dans notre DialogFragment.

var pioneers = arrayOf("Dennis Ritchie", "Rodney Brooks", "Sergey Brin", "Larry Page", "Cynthia Breazeal", "Jeffrey Bezos", "Berners-Lee Tim", "Centaurus A", "Virgo Stellar Stream")

5. Lier une ListView à un tableau Kotlin en utilisant ArrayAdapter.

Nous faisons ensuite référence à notre [ListView] (https://camposha.info/android/listview) et définissons son adaptateur. Nous utiliserons arrayadapter.

        val myListView = rootView.findViewById(R.id.myListView) as ListView
        myListView!!.adapter = ArrayAdapter<String>(activity, android.R.layout.simple_list_item_1, pioneers)

6. Définir le titre d'un DialogFragment .

Nous définissons le titre du DialogFragment en utilisant la méthode setTitle(), vous passez un String à cette méthode.

        this.dialog.setTitle("Tech Pioneers")

7. Écouter les événements Click de ListView en Kotlin

Disons que nous voulons afficher un message Toast lorsqu'une ListView est cliquée, en montrant l'élément cliqué :

        myListView.setOnItemClickListener {
            adapterView,
            view,
            position,
            l
            -> Toast.makeText(activity, pioneers[position], Toast.LENGTH_SHORT).show()
        }

Voici le code complet de la classe PioneersFragment :

package info.camposha.kotlindialogfragment

import android.os.Bundle
import android.support.v4.app.DialogFragment
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.ArrayAdapter
import android.widget.ListView
import android.widget.Toast

class PioneersFragment : DialogFragment() {

    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
        val rootView = inflater.inflate(R.layout.fraglayout, container)
        var pioneers = arrayOf("Dennis Ritchie", "Rodney Brooks", "Sergey Brin", "Larry Page", "Cynthia Breazeal", "Jeffrey Bezos", "Berners-Lee Tim", "Centaurus A", "Virgo Stellar Stream")

        val myListView = rootView.findViewById(R.id.myListView) as ListView
        //with arrayadapter you have to pass a textview as a resource, and that is simple_list_item_1
        myListView!!.adapter = ArrayAdapter<String>(activity, android.R.layout.simple_list_item_1, pioneers)

        this.dialog.setTitle("Tech Pioneers")

        myListView.setOnItemClickListener {
            adapterView,
            view,
            position,
            l
            -> Toast.makeText(activity, pioneers[position], Toast.LENGTH_SHORT).show()
        }

        return rootView
    }
}

(c). MainActivity.kt

Ceci est notre MainActivity. Elle contiendra un bouton qui, lorsqu'il sera cliqué, affichera ou ouvrira notre DialogFragment.

1. Créer une activité en Kotlin

Vous devez juste créer une classe, lui donner un identifiant puis la faire dériver de android.support.v7.app.AppCompatActivity :

class MainActivity : AppCompatActivity() {..}

2. Surchargez la méthode onCreate() de l'Activity.

La méthode onCreate() est une méthode qui est levée lorsque notre activité est créée.

Ici, nous appelons la méthode onCreate() de la super class. Ensuite, nous utilisons la méthode setContentView() pour gonfler notre activity_main.xml :

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

3. Référencement des widgets en Kotlin

Vous pouvez référencer les widgets depuis leur layout respectif en utilisant la méthode findViewById() de l'activité.

Comme nous le faisons avec notre bouton.

        val openFragmentBtn = findViewById(R.id.openFragmentID) as Button

4. Obtenir le FragmentManager d'une activité

Les fragments sont hébergés par les activités. Par conséquent, une activité maintient un supportFragmentManager comme propriété.

Nous pouvons l'obtenir de cette façon :

        val fm = supportFragmentManager

5. Ouvrir/Montrer un Fragment.

Nous pouvons ouvrir un Fragment ou le montrer. Mais d'abord, nous devons instancier ce Fragment :

        val pioneersFragment = PioneersFragment()

Ensuite, nous pouvons l'ouvrir lorsque l'utilisateur clique sur un bouton en invoquant la méthode show() de la classe Fragment :

        openFragmentBtn.setOnClickListener(object : View.OnClickListener {
            override fun onClick(view: View) {
                pioneersFragment.show(fm, "PioneersFragment_tag")
            }
        })

Voici le code complet de la MainActivity :

package info.camposha.kotlindialogfragment

import android.support.v7.app.AppCompatActivity
import android.os.Bundle
import android.view.View
import android.widget.Button

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val openFragmentBtn = findViewById(R.id.openFragmentID) as Button

        val fm = supportFragmentManager
        val pioneersFragment = PioneersFragment()

        openFragmentBtn.setOnClickListener(object : View.OnClickListener {
            override fun onClick(view: View) {
                pioneersFragment.show(fm, "PioneersFragment_tag")
            }
        })
    }
}
//end

Ressources de mise en page

(a). activité_main.xml

Ceci est le layout de notre activité principale. Il contiendra notre bouton qui, lorsqu'il sera cliqué, ouvrira notre DialogFragment.

Ce layout sera gonflé dans l'interface utilisateur de l'activité principale. Cela se fera via la méthode setContentView() de l'activité qui nous demandera de lui passer le layout.

Nous le ferons dans la méthode onCreate() de Activity.

Nous utilisons les éléments suivants :

1. RelativeLayout
2. Bouton

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

    android_layout_width="match_parent"
    android_layout_height="match_parent"
    tools_context=".MainActivity">

    <Button
        android_id="@+id/openFragmentID"
        android_text="Open Fragment"
        android_background="@color/colorAccent"
        android_layout_centerInParent="true"
        android_layout_width="wrap_content"
        android_layout_height="wrap_content" />

</RelativeLayout>

(b). fraglayout.xml

Notre layout DialogFragment. Ce layout sera gonflé en interface utilisateur pour notre Fragment de dialogue.

Il contiendra une simple ListView.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    android_orientation="vertical" android_layout_width="match_parent"
    android_layout_height="match_parent">

    <ListView
        android_id="@+id/myListView"
        android_layout_width="match_parent"
        android_layout_height="wrap_content"/>

</LinearLayout>

Ressources de valeur

(a). colors.xml

Les couleurs de notre design matériel :

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#FF4081</color>
    <color name="material_amber_700">#ffffa000</color>
    <color name="material_amber_800">#ffff8f00</color>
    <color name="material_amber_900">#ffff6f00</color>
    <color name="material_amber_A100">#ffffe57f</color>
    <color name="material_amber_A200">#ffffd740</color>
    <color name="material_amber_A400">#ffffc400</color>

</resources>

(b). styles.xml

Le style de notre application.

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/material_amber_A400</item>
        <item name="colorPrimaryDark">@color/material_amber_900</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

</resources>

(b). Android DialogFragment - Show RecyclerView

Cet exemple va montrer une recyclerview dans diaogfragment..

Lorsque l'utilisateur clique sur un bouton show, nous ouvrons un dialogfragment, en y affichant un RecyclerView.

Résumé du projet

1. Créer un projet d'activité de base

1. Tout d'abord créer un projet vide dans android studio. Allez à File --> New Project.
2. Tapez le nom de l'application et choisissez le nom de l'entreprise.
3. Choisissez le SDK minimum.
4. Choisissez l'activité de base.
5. Cliquez sur Terminer.

L'"activité" de base aura une barre d'outils et un bouton d'action flottant déjà ajoutés dans le modèle.

Normalement, deux mises en page sont générées avec cette option :

Dans cet exemple, j'ai utilisé une activity de base.

Cette activité sera automatiquement enregistrée dans le fichier android_manifest.xml. Les activités Android sont des composants et doivent normalement être enregistrées comme un composant d'application.

Si vous avez créé le vôtre manuellement, alors enregistrez-le à l'intérieur du <application>...<application> comme suit, en remplaçant le MainActivity par le nom de votre activity :

        <activity android_name=".MainActivity">

            <intent-filter>

                <action android_name="android.intent.action.MAIN" />

                <category android_name="android.intent.category.LAUNCHER" />

            </intent-filter>

        </activity>

Vous pouvez voir qu'une action et une catégorie sont spécifiées comme filtres d'intention. La catégorie fait de notre MainActivity une activité de lancement. Les activités de lancement sont exécutées en premier lorsque l'application android est lancée.

3. Créer l'interface utilisateur

Voici nos mises en page pour ce projet :

activity_main.xml

• Ce layout est gonflé en interface utilisateur MainActivity.
• Il inclut le content_main.xml.

Voici quelques-uns des widgets, vues et groupes de vues qui sont utilisés".

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout

    android_layout_width="match_parent"
    android_layout_height="match_parent"
    android_fitsSystemWindows="true"
    tools_context="com.tutorials.hp.dialogfragmentrecyclerview.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="?attr/colorPrimary"
            app_popupTheme="@style/AppTheme.PopupOverlay" />

    </android.support.design.widget.AppBarLayout>

    <include layout="@layout/content_main" />

    <android.support.design.widget.FloatingActionButton
        android_id="@+id/fab"
        android_layout_width="wrap_content"
        android_layout_height="wrap_content"
        android_layout_gravity="bottom|end"
        android_layout_margin="@dimen/fab_margin"
        android_src="@android:drawable/ic_dialog_email" />

</android.support.design.widget.CoordinatorLayout>

contenu_main.xml

Ce layout est inclus dans votre activity_main.xml.
Vous définissez vos widgets d'interface utilisateur ici même.

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

    android_layout_width="match_parent"
    android_layout_height="match_parent"
    android_paddingBottom="@dimen/activity_vertical_margin"
    android_paddingLeft="@dimen/activity_horizontal_margin"
    android_paddingRight="@dimen/activity_horizontal_margin"
    android_paddingTop="@dimen/activity_vertical_margin"
    app_layout_behavior="@string/appbar_scrolling_view_behavior"
    tools_context="com.tutorials.hp.dialogfragmentrecyclerview.MainActivity"
    tools_showIn="@layout/activity_main">

    <TextView
        android_layout_width="wrap_content"
        android_layout_height="wrap_content"
        android_text="Hello World!" />
</RelativeLayout>

fraglayout.xml

Ce layout sera gonflé à notre DialogFragment.

Il contiendra notre RecyclerView comme notre adapterview :

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    android_orientation="vertical" android_layout_width="match_parent"
    android_layout_height="match_parent">

    <android.support.v7.widget.RecyclerView
        android_id="@+id/mRecyerID"
        android_layout_width="match_parent"
        android_layout_height="wrap_content"></android.support.v7.widget.RecyclerView>

</LinearLayout>

model.xml

Cette mise en page sera gonflée dans les éléments de vue pour notre RecyclerView.

Fondamentalement, une CardView pour chaque élément de RecyclerView.

Contient un simple TextView :

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
    android_id="@+id/mCard"
    android_orientation="horizontal"
    android_layout_width="match_parent"

    android_layout_margin="10dp"
    card_view_cardCornerRadius="10dp"
    card_view_cardElevation="10dp"

    android_layout_height="wrap_content">

    <RelativeLayout
        android_layout_width="match_parent"
        android_layout_height="match_parent">

        <TextView
            android_layout_width="wrap_content"
            android_layout_height="wrap_content"
            android_textAppearance="?android:attr/textAppearanceLarge"
            android_text="Name"
            android_id="@+id/nameTxt"
            android_padding="10dp"
            android_layout_alignParentLeft="true"
             />

    </RelativeLayout>
</android.support.v7.widget.CardView>

4. Créer des classes Java

Les applications Android sont écrites en langage de programmation Java, alors créons quelques classes.

1. MonDossier.java

Notre classe ViewHolder.

package com.tutorials.hp.dialogfragmentrecyclerview.mRecycler;

import android.support.v7.widget.RecyclerView;
import android.view.View;
import android.widget.TextView;
import com.tutorials.hp.dialogfragmentrecyclerview.R;

public class MyHolder extends RecyclerView.ViewHolder {

    TextView nameTxt;

    public MyHolder(View itemView) {
        super(itemView);
        nameTxt= (TextView) itemView.findViewById(R.id.nameTxt);
    }
}

2. MonAdaptateur.java

Notre classe d'adaptateur de vue recyclée :

package com.tutorials.hp.dialogfragmentrecyclerview.mRecycler;

import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import com.tutorials.hp.dialogfragmentrecyclerview.R;

public class MyAdapter extends RecyclerView.Adapter<MyHolder> {

    Context c;
    String[] tvshows;

    public MyAdapter(Context c, String[] tvshows) {
        this.c = c;
        this.tvshows = tvshows;
    }

    //INITIALIE VH
    @Override
    public MyHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View v= LayoutInflater.from(parent.getContext()).inflate(R.layout.model,parent,false);
        MyHolder holder=new MyHolder(v);
        return holder;
    }

    //BIND DATA
    @Override
    public void onBindViewHolder(MyHolder holder, int position) {
       holder.nameTxt.setText(tvshows[position]);
    }

    @Override
    public int getItemCount() {
        return tvshows.length;
    }
}

TVShowFragment.java

Ceci est notre DialogFragment. Il dérive de android.app.DiloagFragment.

Cette classe va montrer notre RecyclerView :

package com.tutorials.hp.dialogfragmentrecyclerview;

import android.app.DialogFragment;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import com.tutorials.hp.dialogfragmentrecyclerview.mRecycler.MyAdapter;

public class TVShowFragment extends DialogFragment {

    String[] tvshows={"Crisis","Blindspot","BlackList","Game of Thrones","Gotham","Banshee"};
    RecyclerView rv;
    MyAdapter adapter;

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

        View rootView=inflater.inflate(R.layout.fraglayout,container);

        //RECYCER
        rv= (RecyclerView) rootView.findViewById(R.id.mRecyerID);
        rv.setLayoutManager(new LinearLayoutManager(this.getActivity()));

        //ADAPTER
        adapter=new MyAdapter(this.getActivity(),tvshows);
        rv.setAdapter(adapter);

        this.getDialog().setTitle("TV Shows");

        return rootView;
    }
}

4. MainActivity.java

Notre MainActivity.
Elle contiendra un bouton qui, lorsqu'il sera cliqué, affichera notre DialogFragment :

package com.tutorials.hp.dialogfragmentrecyclerview;

import android.app.FragmentManager;
import android.os.Bundle;
import android.support.design.widget.FloatingActionButton;
import android.support.design.widget.Snackbar;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.View;
import android.view.Menu;
import android.view.MenuItem;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
        FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);

         final FragmentManager fm=getFragmentManager();
        final  TVShowFragment tv=new TVShowFragment();

        fab.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
              tv.show(fm,"TV_tag");
            }
        });
    }

}

Exemple 2 - Android DialogFragment - Recherche/Filtre ListView

L'idée des dialogues est géniale car nous pouvons les faire surgir de nulle part. L'utilisateur peut alors faire ce qu'il veut et quitter la boîte de dialogue.

Dans cet exemple, nous créons un segment de dialogue qui s'affiche lorsqu'un simple bouton est cliqué dans notre [activité] principale (https://camposha.info/android/activity).

Notre segment de dialogue contient une simple ListView et une SearchView. La ListView contiendra une liste de joueurs.

Le searchView peut alors être utilisé pour rechercher les joueurs dans la liste.

1. Notre classe MainActivity

C'est notre principale activité.

En tant que classe, c'est une [activité] (https://camposha.info/android/activity) puisqu'elle dérive de android.app.Activity.

package com.tutorials.dialogfragmenter;

import android.app.Activity;
import android.app.FragmentManager;
import android.os.Bundle;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;

public class MainActivity extends Activity {

  Button btn;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        final FragmentManager fm=getFragmentManager();
        final PlayersFragment p=new PlayersFragment();

        btn=(Button) findViewById(R.id.button1);
        btn.setOnClickListener(new OnClickListener() {

      @Override
      public void onClick(View arg0) {
        // TODO Auto-generated method stub
        p.show(fm, "Best Players");
      }
    });
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }

}

2. Notre classe PlayerFragment.

Voici notre classe PlayerFragment.

package com.tutorials.dialogfragmenter;

import android.app.DialogFragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.Button;
import android.widget.ListView;
import android.widget.SearchView;
import android.widget.SearchView.OnQueryTextListener;

public class PlayersFragment extends DialogFragment {

  Button btn;
  ListView lv;
  SearchView sv;
  ArrayAdapter<String> adapter;
  String[] players={"Lionel Messi","Christiano Ronaldo","Neymar","Gareth Bale"};

  @Override
  public View onCreateView(LayoutInflater inflater, ViewGroup container,
      Bundle savedInstanceState) {
    // TODO Auto-generated method stub
    View rootView=inflater.inflate(R.layout.sports, null);

    //SET TITLE DIALOG TITLE
    getDialog().setTitle("Best Players In The World");

    //BUTTON,LISTVIEW,SEARCHVIEW INITIALIZATIONS
    lv=(ListView) rootView.findViewById(R.id.listView1);
    sv=(SearchView) rootView.findViewById(R.id.searchView1);
    btn=(Button) rootView.findViewById(R.id.dismiss);

    //CREATE AND SET ADAPTER TO LISTVIEW
    adapter=new ArrayAdapter<String>(getActivity(), android.R.layout.simple_list_item_1,players);
    lv.setAdapter(adapter);

    //SEARCH
    sv.setQueryHint("Search..");
    sv.setOnQueryTextListener(new OnQueryTextListener() {

      @Override
      public boolean onQueryTextSubmit(String txt) {
        // TODO Auto-generated method stub
        return false;
      }

      @Override
      public boolean onQueryTextChange(String txt) {
        // TODO Auto-generated method stub

        adapter.getFilter().filter(txt);
        return false;
      }
    });

    //BUTTON
    btn.setOnClickListener(new OnClickListener() {

      @Override
      public void onClick(View arg0) {
        // TODO Auto-generated method stub
        dismiss();
      }
    });

    return rootView;
  }

}

3. Notre mise en page principale de l'activité

Voici la disposition de notre activité principale.

<RelativeLayout

    android_layout_width="match_parent"
    android_layout_height="match_parent"
    android_paddingBottom="@dimen/activity_vertical_margin"
    android_paddingLeft="@dimen/activity_horizontal_margin"
    android_paddingRight="@dimen/activity_horizontal_margin"
    android_paddingTop="@dimen/activity_vertical_margin"
    tools_context=".MainActivity" >

    <Button
        android_id="@+id/button1"
        android_layout_width="wrap_content"
        android_layout_height="wrap_content"
        android_layout_alignParentLeft="true"
        android_layout_alignParentTop="true"
        android_layout_marginLeft="97dp"
        android_layout_marginTop="163dp"
        android_text="Show" />

</RelativeLayout>

4. Notre PlayerFragment Layout

Voici le layout de notre DialogFragment.

Voici ses rôles :

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    android_layout_width="match_parent"
    android_layout_height="match_parent"
    android_orientation="vertical" >

    <SearchView
        android_id="@+id/searchView1"
        android_layout_width="match_parent"
        android_layout_height="wrap_content" >
    </SearchView>

    <ListView
        android_id="@+id/listView1"
        android_layout_width="match_parent"
        android_layout_height="326dp" >
    </ListView>

    <Button
        android_id="@+id/dismiss"
        android_layout_width="match_parent"
        android_layout_height="wrap_content"
        android_text="Dismiss" />

</LinearLayout>

Notre manifeste

Notre android manifest.xml. Notre activité est enregistrée ici.

<?xml version="1.0" encoding="utf-8"?>
<manifest
    package="com.tutorials.dialogfragmenter"
    android_versionCode="1"
    android_versionName="1.0" >

    <uses-sdk
        android_minSdkVersion="19"
        android_targetSdkVersion="19" />

    <application
        android_allowBackup="true"
        android_icon="@drawable/ic_launcher"
        android_label="@string/app_name"
        android_theme="@style/AppTheme" >
        <activity
            android_name="com.tutorials.dialogfragmenter.MainActivity"
            android_label="@string/app_name" >
            <intent-filter>
                <action android_name="android.intent.action.MAIN" />

                <category android_name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>