Customized StickyGridHeaders

• Download source - 2.1 MB

Introduction

I customized StickyGridHeaders to group any type of data and group by any data.

Using the Code

I will explain every part of the code and classes that need to be changed in order to make it work as required.

We will change in the following classes:

1. StickyGridHeadersSimpleArrayAdapter
2. StickyGridHeadersSimpleAdapter
3. StickyGridHeadersSimpleWrapper

1. StickyGridHeadersSimpleArrayAdapter

1. Let's get our class ready to hold our ArrayList data by changing the constructor and init() functions.

       //Initialize an ArrayList that holds the data received by constructor
       private ArrayList<HashMap<String, String>> DataArray;
   
       //Added a new parameter to both constructors of type ArrayList that holds our data
       public StickyGridHeadersSimpleArrayAdapter(Context context,
       int headerResId, int itemResId , ArrayList<HashMap<String, String>> data) {
            init(context, headerResId, itemResId, data);
       }
   
       //Passing the data to our prive ArrayList DataArray
       private void init(Context context, int headerResId, 
       int itemResId, ArrayList<HashMap<String, String>> data) {
            this.mHeaderResId = headerResId;
            this.mItemResId = itemResId;
            this.DataArray = data;
            mInflater = LayoutInflater.from(context);
       }

2. Change getCount() function to return the right count of our data ArrayList.

       @Override
       public int getCount() {
            return DataArray.size();
       }

3. Change getItem() function to return a specific Item of our data ArrayList depending on position parameter.

       @Override
       public HashMap<string> getItem(int position) {
            return DataArray.get(position);
       }

4. Change getHeaderId() function to work with an element inside ArrayList. In my example, it's "Name" .

       public CharSequence getHeaderId(int position) {
       //Change Item Type from "T" to "HashMap"
         HashMap<string> item  = getItem(position);
         CharSequence value;
         //get the string that you want to group by.Here i would like to group by "Name"
         if (item.get("Name") instanceof CharSequence) {
               //Insert it inside value variable
               value = (CharSequence) item.get("Name");
         } else {
               //Insert it inside value variable
               value = item.get("Name").toString();
         }
   
         return value.subSequence(0, 1);
       }

5. Change getHeaderView() function. One of the most important functions that will return the string that will appear on the Header.

       @SuppressWarnings("unchecked")
       public View getHeaderView(int position, View convertView, ViewGroup parent) {
           HeaderViewHolder holder;
           if (convertView == null) {
               convertView = mInflater.inflate(mHeaderResId, parent, false);
               holder = new HeaderViewHolder();
               holder.textView = (TextView) convertView.findViewById(android.R.id.text1);
               convertView.setTag(holder);
           } else {
               holder = (HeaderViewHolder) convertView.getTag();
           }
   
           HashMap<string> item = getItem(position);
           CharSequence string;
           if (item.get("Name") instanceof CharSequence) {
               string = (CharSequence) item.get("Name");
           } else {
               string = item.get("Name").toString();
           }
   
           // set header text as first char in string
   
           //HERE the Text that will appear on header ,you can change the subSequence to any character
           //like display 1 character as below link or 2 or ( item.get("Name").length - 1 )
           holder.textView.setText(string.subSequence(0, 1));
   
           return convertView;
       }

6. Change getView() function. One of the most important functions that will return the data that will appear.
   You can check More Information field below to change the header and data style or add an imageview to display.

       @Override
       @SuppressWarnings("unchecked")
       public View getView(int position, View convertView, ViewGroup parent) {
           ViewHolder holder;
           if (convertView == null) {
                convertView = mInflater.inflate(mItemResId, parent, false);
                holder = new ViewHolder();
                holder.textView = (TextView) convertView.findViewById(android.R.id.text1);
                convertView.setTag(holder);
           } else {
                holder = (ViewHolder) convertView.getTag();
           }
   
           HashMap<String, String> item = getItem(position);
           if (item.get("Name") instanceof CharSequence) {
                holder.textView.setText((CharSequence) item.get("Name"));
           } else {
                holder.textView.setText(item.get("Name").toString());
           }
   
           return convertView;
       }

2. StickyGridHeadersSimpleAdapter

1. Change the type of returned data from long to CharSequence.

       CharSequence getHeaderId(int position);

3. StickyGridHeadersSimpleWrapper

1. Change the type of "mapping" from long to CharSequence.

       protected HeaderData[] generateHeaderList(StickyGridHeadersSimpleAdapter adapter) {
   
          //Change Map from long to CharSequence
          Map<CharSequence, HeaderData> mapping = new HashMap<CharSequence, HeaderData>();
          List<HeaderData> headers = new ArrayList<HeaderData>();
   
          for (int i = 0; i < adapter.getCount(); i++) {
              CharSequence headerId = adapter.getHeaderId(i);
              HeaderData headerData = mapping.get(headerId);
              if (headerData == null) {
                  headerData = new HeaderData(i);
                  headers.add(headerData);
              }
              headerData.incrementCount();
              mapping.put(headerId, headerData);
          }
   
          return headers.toArray(new HeaderData[headers.size()]);
       }

More Information

• You can change the Header Style from header.xml.
• You can change the item data to display from item.xml.
• You must include the gridview com.example.stickyheadertest.StickyGridHeadersGridView to get it work.

Thank you everyone for reading this tip, and hopefully it helps everyone out.