According to the "Controller widget" post posted at Controller widget—Web AppBuilder for ArcGIS | ArcGIS, developers cannot define custom group widget icons.
"Tip:
If you want to change a group widget name, go back to the group widget and click the samll edit icon to change it. The group widget icon however cannot be changed currently."
However, this is not accurate. There are two ways to define your own icon for a group widget. I tried both ways in the Lauchpad and foldable themes with success.
The easier way is to edit the app config and simply define the image to be used for the group widget.
Just add line 4 below.
"groups": [
{
"label": "Layers Info",
"icon":"images/tools.png",
"widgets": [
{
"uri": "widgets/Legend/Widget",
"version": "2.4",
"id": "widgets_Legend_Widget_17",
"name": "Legend",
"index": 2
},
Or you can modify the ConfigManager.js that resides under app#\jimu.js and add the else conditions at line 19 for as many group icons you may want to use.
_addDefaultOfWidgetGroup: function(config){
jimuUtils.visitElement(config, lang.hitch(this, function(e, info){
e.isOnScreen = info.isOnScreen;
if(e.widgets){
e.gid = e.id;
if(e.widgets.length === 1){
if(!e.label){
e.label = e.widgets[0].label? e.widgets[0].label: 'Group';
}
if(!e.icon){
if(e.widgets[0].uri){
e.icon = this._getDefaultIconFromUri(e.widgets[0].uri);
}else{
e.icon = 'jimu.js/images/group_icon.png';
}
}
}else{
if (e.label === "my group"){
e.icon = 'jimu.js/images/mylogo.png';
} else if (e.label === "my group1") {
e.icon = 'jimu.js/images/mylogo1.png';
}
else {
e.icon = e.icon? e.icon: 'jimu.js/images/group_icon.png';
e.label = e.label? e.label: 'Group_' + info.index;
}
}
}else{
e.gid = info.groupId;
}
}));
},
