I created a working example like what you have asked Annina Rupe - each one of these layers are actually separate services. SAGIS Property Map Viewer I made the groups closed but the ones with only one legend symbol, have the symbol line up and no duplicate layer name rows.
I used dynamic layers. The issue is that ArcGIS Online will not let you add a sublayer as a dynamic map service. This capability will hopefully be added when they release the update enabling grouping layers. When you add a layer with a /0 it adds as a featureLayer but that can be substantially slower than dynamic map image layers, and also may limit the number of features. While that limit can be increased it is usually a good thing to protect the server from overflowing. featureLayers send more data over the wire and use more server resources from my experience.
For this little demo, I used CSS to effectively accomplish this. (With Web App Builder Developer)
I remove the sublayer, move the legend symbol up a row, and hide the little > v expander buttons. I also programmatically open some of the rows strategically and also removed a few sublayers with the option to do so in the LayerList configuration. So for example I removed many unuseful things in Traffic layer. Also, made a few layers like Wetlands and LOMAs expanded programmatically so if you expand it, they already are showing their legend. Voila. This is more a working demo than to go for production, as since it is CSS anything changing the layer list like Add Data will conflict with it. But it shows the usefulness of this as a proof of concept:
SAGIS Property Map Viewer
I propose Esri consider making LayerList behave more this way or at least easier to configure in this manner, so it looks and feels more like AGS JS TOC to end users. Icing on the cake is when I have enough time to go and make layers auto-expand their legend if they're clicked On (to display, by turning them on with the checkbox). Then it will fully replicate AGS JS TOC, with the exception that clicking a sublayer it won't auto-turn on the parent(s) layers. That I imagine will one day make its way into the layerList logic and if not... my workaround is having all parent layers turned on, or the sublayers on and hiding them like above, so one click, turns them on, by turning on the parent. Again, if this seems confusing, imagine what users are thinking. Mirroring the AGS JS TOC logic and Arc Earth GUI (with partial check boxes) would fix this. I created an idea, if you would like to vote for it!
web app builder layer list - make it like AGS JS TOC
