Android Programming

Android Dialog Fragment - ListView Search/Filter

The idea of dialogs is great because we can pop them out from nowhere. The user can then perform his thing then dismiss the dialog.

In this example we create a dialogfragment that gets displayed when a simple button is clicked from our main activity.

Our dialogfragment will contain a simple ListView and a SearchView. The ListView will contain a List of players.

The searchview can then be used to search the players from the list.

1. Our MainActivity Class

This is our main activity.

As a class it's an activity since it derives from android.app.Activity.

No. Responsibility
1. It is our launcher and only activity.
2. It will contain a button which when clicked we show a dialogfragment.
3. It maintains a FragmentManager which helps in showing of our dialogfragment.
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. Our PlayerFragment class.

This is our PlayerFragment class.

No. Responsibility
1. Derives from android.app.DialogFragment hence making it a DialogFragment.
2. We'll reference a ListView and SearchView here. ListView will be our adapterview while we'll use a searchview for inputting our search terms.
3. We'll dismiss our dialogfragment when the dismiss button is clicked.
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. Our MainActivity Layout

This is our main activity layout.

No. Responsibility
1. Contains a button that when clicked will open our dialogfragment.
<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: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. OUR PlayerFragment Layout

This is our dialog fragment's layout.

Here are it's roles:

No. Responsibility
1. Define a ListView which will display of list of items.
2. Define a SearchView for searching/filtering our data.
3. Define a button for dismissing our dialogfragment.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    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>

Our Manifest

Our android manifest.xml. Our activity is registered here.

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    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>

Best Regards, Oclemy.