0

I have a custom expandable list view and I am trying to implement a feature so that I can add "tags" to a list view item by prompting the user to type in tag names. I want these tags to appear next to the title as textViews. Any ideas on how to do this? Each of the current list item contains a title and item children. Below is my code for a custom adapter:

public class CodeListExapandableListAdapter extends BaseExpandableListAdapter {
    private Context _context;
    private List<String> _listDataHeader; // header titles
    private List<String> _listDataHeaderOriginal; // used for search filter
    // child data in format of header title, child title
    private HashMap<String, List<String>> _listDataChild;

    public CodeListExapandableListAdapter(Context context, List<String> listDataHeader,
                                 HashMap<String, List<String>> listChildData) {
        this._context = context;
        this._listDataChild = listChildData;
        this._listDataHeader = listDataHeader;
        this._listDataHeaderOriginal = new ArrayList<>();
        this._listDataHeaderOriginal.addAll(listDataHeader);
    }

    @Override
    public int getGroupCount() {
        return this._listDataHeader.size();
    }

    @Override
    public int getChildrenCount(int groupPosition) {
        return this._listDataChild.get(this._listDataHeader.get(groupPosition))
                .size();
    }

    @Override
    public Object getGroup(int groupPosition) {
        return this._listDataHeader.get(groupPosition);
    }

    @Override
    public Object getChild(int groupPosition, int childPosition) {
        return this._listDataChild.get(this._listDataHeader.get(groupPosition))
                .get(childPosition);
    }

    @Override
    public long getGroupId(int groupPosition) {
        return groupPosition;
    }

    @Override
    public long getChildId(int groupPosition, int childPosition) {
        return childPosition;
    }

    @Override
    public boolean hasStableIds() {
        return false;
    }

    @Override
    public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {
        String headerTitle = (String) getGroup(groupPosition);
        if (convertView == null) {
            LayoutInflater infalInflater = (LayoutInflater) this._context
                    .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            convertView = infalInflater.inflate(R.layout.code_list_title, null);
        }

        TextView lblListHeader = (TextView) convertView
                .findViewById(R.id.codeListTitle);
        lblListHeader.setTypeface(null, Typeface.BOLD);
        lblListHeader.setText(headerTitle);

        if(isExpanded)
        {
            convertView.setBackgroundResource(R.color.blue_angel);
        }else {
            convertView.setBackgroundResource(R.color.app_blue);
        }

        return convertView;
    }

    @Override
    public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) {
        final String childText = (String) getChild(groupPosition, childPosition);

        if (convertView == null) {
            LayoutInflater infalInflater = (LayoutInflater) this._context
                    .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            convertView = infalInflater.inflate(R.layout.code_list_item, null);
        }

        TextView txtListChild = (TextView) convertView
                .findViewById(R.id.codeListItem);

        txtListChild.setText(childText);
        return convertView;
    }

    @Override
    public boolean isChildSelectable(int groupPosition, int childPosition) {
        return false;
    }

    //Required as this updates the list after an item delete!
    public void updateListsAfterDelete(List newList)
    {
        this._listDataHeaderOriginal.clear();
        this._listDataHeaderOriginal.addAll(newList);
    }

    //Need this to search inside the expandableListView
    public void filterData(String query){
        query = query.toLowerCase();
        this._listDataHeader.clear();
        if(query.isEmpty())
        {
            this._listDataHeader.addAll(this._listDataHeaderOriginal);
        }else
        {
            for(String str : this._listDataHeaderOriginal)
            {
                if(str.toLowerCase().contains(query))
                {
                    this._listDataHeader.add(str);
                }
            }
        }
        notifyDataSetChanged();
    }
}

XML for code_list_title:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <TextView
        android:id="@+id/codeListTitle"
        android:layout_width="0dp"
        android:layout_height="100dp"
        android:layout_weight="5"
        android:paddingLeft="?android:attr/expandableListPreferredItemPaddingLeft"
        android:paddingTop="10dp"
        android:paddingBottom="10dp"
        android:textColor="@color/white"
        android:textSize="22dp"/>
    <GridLayout
        android:layout_weight="5"
        android:layout_width="wrap_content"
        android:layout_height="100dp"
        android:columnCount="2"
        android:rowCount="2">
        <TextView
            android:id="@+id/tag1"
            android:layout_row="0"
            android:layout_column="0"
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_gravity="fill_horizontal"
            android:text="TAG 1"
            android:gravity="center">
        </TextView>
        <TextView
            android:id="@+id/tag2"
            android:layout_column="0"
            android:layout_row="1"
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_gravity="fill_horizontal"
            android:gravity="center"
            android:text="TAG 2">
        </TextView>
        <TextView
            android:id="@+id/tag3"
            android:layout_column="1"
            android:layout_row="0"
            android:gravity="center"
            android:layout_gravity="fill_horizontal"
            android:layout_columnWeight="1"
            android:layout_rowWeight="1"
            android:text="TAG 3">
        </TextView>
        <TextView
            android:layout_column="1"
            android:layout_row="1"
            android:gravity="center"
            android:layout_gravity="fill_horizontal"
            android:id="@+id/tag4"
            android:layout_columnWeight="1"
            android:layout_rowWeight="1"
            android:text="TAG 4">
        </TextView>
    </GridLayout>
</LinearLayout>

Below is the list item layout I want enter image description here

Maharshi
  • 106
  • 1
  • 9

1 Answers1

1

For an individual group, put the 4 tags into a List and put the list into a HashMap with header title as key [similar to the creation of children list]. Then make the following changes in the adapter:

private HashMap<String, List<String>> _listDataTag; //Added.

public CodeListExapandableListAdapter(Context context, List<String> listDataHeader,
                                      HashMap<String, List<String>> listChildData,
                                      HashMap<String, List<String>> listDataTag) {
    this._context = context;
    this._listDataChild = listChildData;
    this._listDataHeader = listDataHeader;
    this._listDataHeaderOriginal = new ArrayList<>();
    this._listDataHeaderOriginal.addAll(listDataHeader);
    this._listDataTag = listDataTag; // Added.
}

@Override
public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {
    String headerTitle = (String) getGroup(groupPosition);
    if (convertView == null) {
        LayoutInflater infalInflater = (LayoutInflater) this._context
                .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        convertView = infalInflater.inflate(R.layout.code_list_title, null);
    }

    TextView lblListHeader = (TextView) convertView.findViewById(R.id.codeListTitle);
    lblListHeader.setTypeface(null, Typeface.BOLD);
    lblListHeader.setText(headerTitle);

    if(isExpanded)
    {
        convertView.setBackgroundResource(R.color.blue_angel);
    } else {
        convertView.setBackgroundResource(R.color.app_blue);
    }

    // Added this code block.
    List<String> listTag = _listDataTag.get(getGroup(groupPosition));
    TextView lblTag1 = (TextView) convertView.findViewById(R.id.tag1);
    TextView lblTag2 = (TextView) convertView.findViewById(R.id.tag2);
    TextView lblTag3 = (TextView) convertView.findViewById(R.id.tag3);
    TextView lblTag4 = (TextView) convertView.findViewById(R.id.tag4);
    lblTag1.setText(listTag.get(0));
    lblTag2.setText(listTag.get(1));
    lblTag3.setText(listTag.get(2));
    lblTag4.setText(listTag.get(3));

    return convertView;
}

The above method is similar to my answer in this post: How made two or three textviews in ExpandableListView?

Instead of having many HashMap, custom/POJO class can be used to put data together. These post may help: Adding different options for Expandable listview, ExpandableListViewAdapter with List containing nested List, ExpandableListView: Get input values from childs

i_A_mok
  • 2,744
  • 2
  • 11
  • 15