Android alphabets section Listview like contacts app listview

Question

now can any one help me how to look my view something like this. please help me i am too confusing.

here my code:-------

phonebooklistview.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <EditText
        android:id="@+id/searchTxtBox"
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:layout_marginTop="65dp"
        android:hint="@string/searchHintTxt"
        android:singleLine="true"
        android:drawableLeft="@android:drawable/ic_search_category_default"
        android:drawablePadding="0dp"
        android:text="" />

    <ListView
        android:id="@android:id/list"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fadingEdge="vertical"
        android:fastScrollEnabled="true"
        android:padding="2dp"
        android:layout_below="@+id/searchTxtBox" >
    </ListView>

    <TextView
        android:id="@+id/phoneBookEmptyView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center_horizontal"
        android:layout_gravity="center_horizontal"
        android:text="@string/phoneBookEmptyMsg"
        android:textColor="@color/white"
        android:layout_below="@+id/searchTxtBox"
        android:layout_marginTop="5dp"
        android:textAppearance="?android:attr/textAppearanceMedium" />

</RelativeLayout>

and in PhoneBookList.java file

protected void onCreate(Bundle savedInstanceState) {
    // TODO Auto-generated method stub
    super.onCreate(savedInstanceState);
    setContentView(R.layout.phonebooklistview);

    listView = getListView();
    adapter = new ItemsAdapter(this);
    adapter.notifyDataSetChanged();
    listView.setAdapter(adapter);
    listView.setTextFilterEnabled(true);
    //listView.setFastScrollEnabled(true);
    listView.setOnItemLongClickListener(this);
    listView.setItemsCanFocus(false);
    listView.setEmptyView(findViewById(R.id.phoneBookEmptyView));
    registerForContextMenu(listView);

}



private class ItemsAdapter extends BaseAdapter implements SectionIndexer
{
    HashMap<String, Integer> alphaIndexer;
    String[] sections;
      private LayoutInflater inflater;
      String[][] items;

      public ItemsAdapter(Context context)
      {
          inflater = LayoutInflater.from(context);
          this.items = phoneBookDataArr;

            alphaIndexer = new HashMap<String, Integer>();
            int size = items.length;

            for (int x = 0; x < size; x++)
            {
                String name=items[x][2];
                String ch =  name.substring(0, 1);
                ch = ch.toUpperCase();
                alphaIndexer.put(ch, x);

                Log.e(TAG,"alphaIndexer="+ch);
            }

            Set<String> sectionLetters = alphaIndexer.keySet();
            ArrayList<String> sectionList = new ArrayList<String>(sectionLetters); 
            Collections.sort(sectionList);
            sections = new String[sectionList.size()];
            sectionList.toArray(sections);
      }

      //@Override
      public View getView(final int position, View convertView, ViewGroup parent)
      {
    // here my custom listviewcontentview goes.
      }

      public int getCount()
      {
          return items.length;
      }

      public Object getItem(int position)
      {
          return position;
      }

      public long getItemId(int position)
      {
          return 0;
      }

      public int getPositionForSection(int section)
      {
          Log.e(TAG,"getPositionForSection="+section);
          return alphaIndexer.get(sections[section]);
      }

      public int getSectionForPosition(int position)
      {
          Log.e(TAG,"getSectionForPosition="+position);
          return 1;
      }

      public Object[] getSections()
      {
          Log.e(TAG,"getSections="+sections.length);
          for (String str : sections)
          {
            Log.e(TAG,str);
          }
          return sections;
      }
}

Answer 1

Adding a searchbar

1: Use EditText for the search bar
2: Register it to addTextChangedListener
3: Implement onTextChanged(...) method to keep track of the character sequence entered by the user 4: Fetch the currentSearchName using getText() method. Iterate over the contact list to find the matching searches. Store the matched results in a list and use Content Adapter to display the list.

Detailed implementation is provided in the following link
http://www.androidpeople.com/android-listview-searchbox-sort-items

Adding labels and sidebar:

1: To add a sidebar implement SectionIndexer in your ContentAdapter class
2: Iterate over the Contacts list to fetch the initials of all the names
3: Implement setSection(..) method to the set the labels
4: Implement getPositionForSection(..) to go the label corresponding to initials when user clicks on the sidebar.

Implementation of the SideBar can be found on the following link. http://codelikes.blogspot.com/2012/04/android-alphabet-listview-like-contacts.html?