Alignment Issues with Widget Controller

903
2
Jump to solution
06-27-2022 12:15 PM
JamesMadden1
Occasional Contributor

Hello,

I am new to Experience Builder and I am having trouble getting a widget icon aligned properly in the widget controller.  The widget controller consists of a single filter widget.  The icon for the filter widget is aligned in the center of the controller but it does not display when the controller is resized below 100px.  Is there anyway to get the icon aligned on the left of the controller?

 

Using Experience Builder Developer Edition 1.8.  Including two pics that illustrate the issue.

0 Kudos
1 Solution

Accepted Solutions
TonghuiMing
Esri Regular Contributor

Hi @JamesMadden1 - unfortunately, this is the current behavior due to a known tech limit. We will log it in for a future discussion but not sure when a solution will be provided.

 

However, if you are using only one stand-alone Filter widget, maybe it is possible to utilize the Icon arrangement style, as a workaround:

TonghuiMing_0-1656387920261.png

This way, you can add the background color and then style it using Auto to center-align the icon button. Hope it helps.

View solution in original post

0 Kudos
2 Replies
TonghuiMing
Esri Regular Contributor

Hi @JamesMadden1 - unfortunately, this is the current behavior due to a known tech limit. We will log it in for a future discussion but not sure when a solution will be provided.

 

However, if you are using only one stand-alone Filter widget, maybe it is possible to utilize the Icon arrangement style, as a workaround:

TonghuiMing_0-1656387920261.png

This way, you can add the background color and then style it using Auto to center-align the icon button. Hope it helps.

0 Kudos
JamesMadden1
Occasional Contributor

Tonghui,

 

Thanks for the helpful info.  I've actually developed a custom group filter widget that works like WAB's " but with a simplified UI.  We are trying to mimic WAB's Plateau theme with a search bar, layer list and filter up in the panel on the right-hand side of the app.  We were able to get a similar UI in Experience Builder but we had to use a sidebar on the right with a layer list, search bar up on the top right and filter off on the left with the general map controls.  The alignment issue we were having was when we tried to dock the filter icon up in the fixed panel on the right with the search tool.  The attached image illustrates the issue.  Notice how the widget controller overlaps with the search tool in order to get the filter icon to display.

0 Kudos