How to set the sidebar widget to be adapted of different size of screen ?

[JasonBOCQUET]

Hi community,

I have an issue with the sidebar widget. It seems to not be able to auto-sized depending of the screen resolution of the user.

I'll explain. I set the width to 30% and the height to 26.5% (I need to set this height because I insert a layer list widget on the sidebar widget with 3 layers). Then I set the button to reduce the panel to be in center of the list widget.

My List widget is setted to be auto sized on lentgh and width.

Her is the rendering on my first screen : 

It's very nice.

And here is the screen on my second screen (more larger) :

Holy S. my text jump and the reduce button moved. WHY ???

What I have to do to make this coherent when the screen size changed ?

Thanks for your help.

Here is the screen of my settings :

[ZhenZhang22]

Hi JasonBOCQUET,

Thanks for your message!

I tried with your settings but couldn’t see the same issue on my side. Could you please share a simple sample app to help us check?

Thanks!

Zhen

[JasonBOCQUET]

Hi @ZhenZhang22 I'm working on Experience Builder Dev Edition 1.17 and export my apps on Enterprise 1.11.  The problem is observed when I'm on localhost to my dev edition.

I don't know how can I share you something because all is blocked by my organization to do not share outside 😞

Did you got the exact same result as my first screen ? And if you try on another screen nothing move ?

[ZhenZhang22]

Hi JasonBOCQUET,

If possible, could you please share a short video showing your configuration and how the issue happens? This will help us avoid missing any key steps when reproducing it.

You can send it to my email: zhenzhang@esri.com.

Thanks a lot!

Zhen

[JasonBOCQUET]

@ZhenZhang22  i have send a mail to you a few second ago. The video is 8MB size, i hope it can be join to a mail. Tell me if you receive nothing. thanks !

[ZhenZhang22 · Accepted solution]

Hi JasonBOCQUET,

Thanks for the video!

I suggest setting the width and height of the Map Layers widget inside the Sidebar to Custom 100%. This should help prevent the button shifting issue when you resize the window.

Please give it a try and let us know if you run into any other problems.

Thanks again!

Zhen

[JasonBOCQUET]

Thanks @ZhenZhang22 it's clearly better when i resize my windows page, the size adapt automatically.

I have not my second screen today, i will try tomorrow to see in a bigger screen how it's rendering.

[JasonBOCQUET]

I'm back @ZhenZhang22 and i tried with a bigger screen : 

I do not why the tool do that ?? i don't want to have this blank space under my "Offres" layer. 

Maybe it's because the List Widget is not entirely adaptative of the screen size changes ?

Do you have any idea of what can I set to have a best rendering if the screen is bigger ? 

The good point is that the button to deploy/reduce the sidebar is now always in the center !

[ZhenZhang22 · Accepted solution]

Hi JasonBOCQUET,

Try setting the Sidebar widget’s height to px instead of %. This prevents empty space below the "Offres" layer on larger screens.

Thanks,
Zhen

[JasonBOCQUET]

Yeah it's better thanks !!

Finally i see another problem, but in smaller screen :

The cursor button to reduce the sidebar seems to disapear. I tried with setting the size on % but it changes nothing. Do you have any idea ?