topic Re: Web AppBuilder in Web AppBuilder Custom Widgets Questions

Web AppBuilder

CenterlineMapping — Thu, 24 Sep 2015 13:33:59 GMT

Is it possible to change the icons for WebApp Builder off-panel out-of-the-box widgets, such as the 'Home Button' widget?

Re: Web AppBuilder

TimWitt2 — Thu, 24 Sep 2015 13:40:27 GMT

You mean the "Home Button" icon that will be on your map?

Re: Web AppBuilder

RickeyFight — Thu, 24 Sep 2015 13:41:21 GMT

In developer navigate to arcgis-web-appbuilder-1.2\client\stemapp\widgets\HomeButton\images

Then replace the icon.png with your own

You can do this with any widget

Re: Web AppBuilder

TimWitt2 — Sun, 12 Dec 2021 09:37:31 GMT

If you want to change the icon of the actual home button, go to:

arcgis-web-appbuilder-1.2\client\stemapp\jimu.js\css and open the jimu.css with a text editor.

add the following

.HomeButton .home {
    background-image: url("../dijit/images/home.png"); //// Change this part to point to the image you would like
}

Re: Web AppBuilder

CenterlineMapping — Tue, 29 Sep 2015 19:22:52 GMT

Thanks for your help!

Re: Web AppBuilder

CenterlineMapping — Thu, 08 Oct 2015 19:18:57 GMT

I have another simple question. How is it possible to change the point symbol from the default Purple circle to something smaller? This functionality is being added to another widget where we do not want to provide all the marker symbols, but create a default.

Thanks,

Re: Web AppBuilder

TimWitt2 — Thu, 08 Oct 2015 19:43:00 GMT

What widget uses this purple marker?

Re: Web AppBuilder

CenterlineMapping — Fri, 09 Oct 2015 13:48:38 GMT

Tim, thanks for asking. If you open the Draw widget and click on the Point, it is the default purple circle. I would like to change the size and color of the default point symbol and add this function to another widget. A user will open a custom widget and be able to add a point to the map, something other than the large purple default symbol.

Re: Web AppBuilder

TimWitt2 — Sun, 12 Dec 2021 09:37:34 GMT

The default symbol can be changed in the following js file:

arcgis-web-appbuilder-1.2\client\stemapp\jimu.js\dijit\SymbolChooser.js

If you have already created an app, go here:

arcgis-web-appbuilder-1.2\server\apps\[Your app number]\jimu.js\dijit

Within this file the default point symbol is defined between line 338 & 348:

  var args = {
          "style": "esriSMSCircle",
          "color": [0, 0, 128, 128],
          "name": "Circle",
          "outline": {
            "color": [0, 0, 128, 255],
            "width": 1
          },
          "type": "esriSMS",
          "size": 18
        };

Just as an fyi in your new widget you would have to use the SymbolChooser to take advantage of those changes.

Hope this helps!

Tim

Re: Web AppBuilder

CenterlineMapping — Fri, 09 Oct 2015 14:37:56 GMT

Tim, thanks for your quick solution! I was able to modify based on your suggestion.

-Tyler

Re: Web AppBuilder

CenterlineMapping — Mon, 09 Nov 2015 18:25:10 GMT

Tim,

On the Web AppBuilder, Draw Widget, do you know if it is possible to hide all polygon shapes except for the Extent Icon, so that users can only draw extents on the map, rather than triangles and free hand polygon. I'm hoping to hide by ID or HTML so that this custom draw widget does not interfere with the normal OOTB draw widget.

Thanks!