WAB Custom Widget Size

1616
5
Jump to solution
05-02-2018 11:40 PM
JerryStafurik
New Contributor II

Hi,

I've developed a custom widget for WAB, that I need to change the default size of.  How can I change the default widget panel height?  I need to make the panel smaller, so that it doesn't take up as much screen space.

Thanks

Tags (1)
0 Kudos
1 Solution

Accepted Solutions
RobertScheitlin__GISP
MVP Esteemed Contributor

Jerry,

   There is not a absolute way to do this. There are going to be times when the widget is in a panel that will not be resized. If the widget is in a onScreenWidgetPanel then this will work:

      onOpen: function() {
        this.getPanel().resize({w:200,h:200});
      },

View solution in original post

0 Kudos
5 Replies
RobertScheitlin__GISP
MVP Esteemed Contributor

Jerry,

   The widget size can be set in the apps main config.json by adding a height and width property to the widgets position object:

      {
        "position": {
          "left": 55,
          "top": 45,
          "width": 200,
          "height": 200,
          "relativeTo": "map"
        },
        "placeholderIndex": 1,
        "id": "_5",
        "closeable": true,
        "uri": "widgets/eSearch/Widget",
        "openAtStart": true,
        "name": "eSearch",
        "config": "configs/eSearch/config__5.json",
        "version": "2.5.0.1"
      },
0 Kudos
JerryStafurik
New Contributor II

Thanks for your response Robert.  This is a global setting in the app for the widget; I was wondering whether it's possible to apply this to the widget itself.  The widget I'm developing is going to be used in ArcGIS Portal 10.5.1 apps as well, and I would like to make sure that where ever the widget is used, the dimension settings are shipped with the widget.  Is this possible?

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

Jerry,

   There is not a absolute way to do this. There are going to be times when the widget is in a panel that will not be resized. If the widget is in a onScreenWidgetPanel then this will work:

      onOpen: function() {
        this.getPanel().resize({w:200,h:200});
      },
0 Kudos
JerryStafurik
New Contributor II

Thanks Robert, this worked for me.

0 Kudos
AdamGebhart
Occasional Contributor III

@RobertScheitlin__GISP 

Should the addition of the height and width work for the Legend widget too?  I have an app in which users have requested it be on at startup (I personally don't like any other than the Popup Panel on at startup but that's me).  I tried adding the height and width to the Legend and as onScreen widget and it didn't seem to take.  This app is 2.13 and in Foldable theme.

0 Kudos