Basically you have to set the default drawable as transparent, move the drawable into your group view as an ImageView and toggle the image in your adapter.
After that, go to your ExpandableListAdapter.java, and in the "getGroupView" section, do the following:
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.list_group, null);
}
TextView lblListHeader = convertView
.findViewById(R.id.lblListHeader); // this is your header
ImageView groupIndicator = convertView.findViewById(R.id.group_indicator); // this is the ImageView included in your xml to override the indicator
if (getChildrenCount(groupPosition) == 0) {
convertView.setVisibility(View.GONE);
lblListHeader.setVisibility(View.GONE);
convertView.setPadding(0,0,0,0); //try not to include padding on your xml, and instead define the padding here.
} else {
convertView.setVisibility(View.VISIBLE);
convertView.setPadding(8,8,8,0);
lblListHeader.setVisibility(View.VISIBLE);
lblListHeader.setTypeface(font);
lblListHeader.setText(headerTitle);
if (isExpanded) { //this is the part where we define our group indicator based on the expanded status of the adapter
groupIndicator.setImageResource(R.drawable.group_indicator_expanded);
} else {
groupIndicator.setImageResource(R.drawable.group_indicator_empty);
}
}
return convertView;
}