topic Re: How to make an on screen widget foldable in tab theme? in Web AppBuilder Custom Widgets Questions

How to make an on screen widget foldable in tab theme?

MartinOwens1 — Fri, 23 Mar 2018 19:24:20 GMT

So I've been trying to make one of my onScreen widgets foldable in the tab theme with no luck. In OnScreenWidgetPanel.js I've been able to add the html foldable nodes the application uses when in the mobile view but I'm having a heck of a time changing the Desktop UI to get it to collapse the widget. Any help would be great!

Re: How to make an on screen widget foldable in tab theme?

RobertScheitlin__GISP — Sun, 12 Dec 2021 09:39:30 GMT

Martin,

You will have to do more work figuring the positioning of the panel in the _setMobilePostion function but to get the panel to fold in desktop mode you need to modify the jimu\OnScreenWidgetPanel.js _onFoldableBtnClicked function like this:

      _onFoldableBtnClicked: function(evt) {
        evt.stopPropagation();
        var posInfo = this._getPositionInfo();
        //if (posInfo.isRunInMobile) {
          if (this.windowState === 'minimized') {
            html.removeClass(this.foldableNode, 'fold-up');
            html.addClass(this.foldableNode, 'fold-down');
            this.panelManager.normalizePanel(this);
          } else {
            html.removeClass(this.foldableNode, 'fold-down');
            html.addClass(this.foldableNode, 'fold-up');
            this.panelManager.minimizePanel(this);
          }
          this._setMobilePosition();
        //}
      },‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: How to make an on screen widget foldable in tab theme?

MartinOwens1 — Wed, 28 Mar 2018 16:57:23 GMT

Thanks Robert!