✅ | Button, Ui in general, resize

[uncut gazelle]

How do I make buttons and Ui (Images, models etc) become the same size of the screen when I'm in F11 mode? #1425988733533950003

[vapid bison]

I’m checking the FancyMenu docs for the right way to make UI elements scale with the screen in fullscreen 👀

[vapid bison]

Yep , in FancyMenu you usually do this in one of 3 ways:

1. For one element to fill the screen:

• Right-click the element
• Enable Stretch Horizontal
• Enable Stretch Vertical

That makes the element scale to the full screen size. If you enable both, it will fill the whole screen, but it can stretch the image/model/button visually a bit.

2. For the whole UI/layout to scale together:

• Right-click the empty editor background
• Set a GUI scale if needed
• Enable Auto-Scaling

That’s the better option if you want your whole menu to stay proportional when you press F11.

3. For exact control:
   Use Advanced Positioning & Sizing and size things based on screen width/height.

A good rule of thumb:

• Stretch = easiest for single elements
• Auto-Scaling = best for the whole menu
• Advanced Sizing = best if you want precise control

If you want, I can also give you a quick example setup for:

• a full-screen background image
• a button that stays centered and scales with the window
• a model that keeps its position in fullscreen 🙂

[uncut gazelle]

first one is when im in F11 and seconds one is when im in fullscreen

[vapid bison]

Quick update: I’m checking the size/scaling behavior so I can tell you exactly which FancyMenu setting matches your screenshots 👀

[vapid bison]

Yep, that makes sense , your screenshots look like the menu is being sized with fixed values, so it behaves differently when the window size changes.

If you want the UI to behave like this:

• same relative size in windowed and fullscreen → use Auto-Scaling
• one element to fill the whole screen → use Stretch Horizontal + Stretch Vertical

So the usual fix is:

1. Right-click the empty editor background
2. Set a fixed GUI Scale if needed
3. Enable Auto-Scaling

That makes the whole layout resize with the window instead of staying at a fixed pixel size. 📏

If it’s only the background/image/model you want to fill the screen, then on that element:

• right-click it
• enable Stretch Horizontal
• enable Stretch Vertical

If you want, I can help you set up:

• a full-screen background,
• a button that stays centered,
• or a layout that scales nicely in both windowed and fullscreen mode 🙂

[uncut gazelle]

this is autosizing :sob

[vapid bison]

Aha, that screenshot confirms it 😭 Auto-Scaling keeps the layout proportional, but it doesn’t make elements fill the screen. I’m switching to the resize/stretch way now.

[vapid bison]

Yep , that screenshot is Auto-Scaling 😅

And yeah, the important bit is:

• Auto-Scaling = keeps the layout proportions when the window size changes
• Stretch / Advanced Sizing = actually makes an element grow with the screen

So if you want buttons/images/models to become the size of the screen in F11, do this on the element itself:

1. Right-click the element
2. Turn on Stretch Horizontal
3. Turn on Stretch Vertical

If you want a specific percentage instead of full-screen, use Advanced Positioning & Sizing with guiwidth / guiheight.

So short version: auto-scaling is not the fix for full-screen fill. Use stretch or advanced sizing instead 🙂

If you want, I can tell you exactly which setting to use for:

• a background image
• a button
• a model
• or the whole menu layout 📌

[uncut gazelle]

its worked but the icon is the big problem here

[vapid bison]

Yep, I can see the logo is what’s exploding in size 😅 I’m checking the docs for the cleanest way to keep that one element smaller while the rest of the menu stays stretched.

[vapid bison]

Ahaaa yep, that’s the logo/icon getting stretched too 😭

So the fix is: don’t stretch the icon. Only stretch the stuff that should fill the screen.

Do this for the icon element:

1. Right-click it
2. Turn off Stretch Horizontal and Stretch Vertical
3. Resize it smaller manually
4. If it looks squished, enable Restore Aspect Ratio

If you want it to stay a certain size based on the screen instead of a fixed size, use Advanced Sizing on just that icon and give it a smaller value, like a percentage of guiwidth / guiheight.

So basically:

• background / big panels = stretch
• buttons = maybe stretch or advanced size
• logo/icon = no stretch, small fixed size, keep aspect ratio

If you want, I can show you the exact setup for a:

• full-screen background
• medium-sized logo in the top corner
• centered button row 🙂

[uncut gazelle]

stretch horitontal and vertical makes it look like this

[vapid bison]

Okay, I found the issue , stretching both directions is warping the logo, so I’m giving you the clean fix for keeping that one small and sharp 🙂

[vapid bison]

Yep , that’s expected 😭

When you turn on both Stretch Horizontal and Stretch Vertical, FancyMenu will force the image to fill the screen, so a logo/icon gets warped and blurry.

For that icon, do this instead:

• turn off both stretch options
• resize it manually to the size you want
• right-click it and use Restore Aspect Ratio so it stays proportional

If you want it to scale a bit with the window but not explode fullscreen, use Advanced Sizing on just that icon and give it a smaller value based on guiwidth / guiheight.

Also, if the image is small originally, stretching it will look pixelated no matter what , so a higher-res logo helps a lot. 🖼️

So basically:

• big background = stretch
• logo/icon = no stretch, keep aspect ratio, resize smaller

If you want, I can help you set the logo to a nice fixed spot like top-left or top-center too 🙂

[uncut gazelle]

i tried advanced sizing, it worked but moves the icon up there and idk why

[vapid bison]

I found the likely cause 💡 The advanced-sizing expression is broken, so the icon is snapping to a default spot. I’m putting together the clean fix now.

[vapid bison]

Yep , that jump is almost certainly because of the broken placeholder, not because advanced sizing itself is “moving” it 😅

Your screenshot shows this error:

Unable to get width of element via placeholder! Element not found: 43

So the icon’s size expression is trying to read the width of an element that doesn’t exist anymore. When that happens, FancyMenu can’t calculate the size properly, and the element can snap to a weird/default position.

What to do:

1. Open the icon’s Advanced Sizing
2. Remove the broken elementwidth / ElementWidthPlaceholder that points to 43
3. Replace it with either:
   • a fixed value like 100
   • or a screen-based value like:

     {"placeholder":"calc","values":{"expression":"{\"placeholder\":\"guiwidth\"} * 0.1","decimal":"false"}}
     

4. Then check the icon’s Anchor Point
   • Top-Left Corner if you want it in the corner
   • Center of Screen if you want it centered

Important bit:

• Auto-Scaling = scales the layout
• Stretch = fills space
• Advanced Sizing = controls size
• Anchor Point / Advanced Positioning = controls where it sits

So for your icon, the clean setup is usually:

• no stretch
• fixed or small Advanced Sizing
• correct anchor point

If you want, send me the exact advanced sizing text you entered and I can point out the exact line that’s breaking it 🙂

[uncut gazelle]

i fixed it with turning on trick anchor, but now the icon is somewhere up there lol

sticky*

[vapid bison]

Ahhh got it , you meant Sticky Anchors, not trick anchor 😅 I’m checking the screenshot so I can tell you the cleanest way to stop the icon from drifting upward.

[vapid bison]

Yeppp, Sticky Anchors 😅

That setting keeps the element tied to its anchor point, so if the anchor is wrong, the icon will sit too high or drift weirdly when its size changes.

What to do:

• If you want the icon in the top area:

  • set the Anchor Point to Top Center or Top Left
  • then nudge the icon down a bit with position if needed

• If you want the icon to stay centered:

  • set the Anchor Point to Center of Screen

• If Sticky Anchors is making it annoying:

  • just turn it off
  • then place the icon manually

So the main fix is: change the anchor point, not the size.

If you want, I can tell you the exact best anchor for:

• top-left logo
• top-center logo
• centered logo 🙂

[uncut gazelle]

ok now how do i turn original F11 mode from this to this, default

[vapid bison]

Got it , I’m lining up the default fullscreen behavior now. It looks like you want to undo FancyMenu’s extra scaling and get back to vanilla-style F11 scaling 🙂

[vapid bison]

Yep , if you want vanilla/default F11 behavior back, the main thing is:

1. Right-click the editor background
2. Set Auto-Scaling to Disabled
3. Set GUI Scale back to Auto or your normal Minecraft GUI scale

That removes FancyMenu’s extra layout scaling and lets fullscreen behave much more like default Minecraft.

If you also changed any individual elements with:

• Stretch
• Advanced Sizing
• Sticky Anchors

then those settings are only affecting those specific elements, so you may want to turn them off on the stuff you want to behave normally.

So the short version is:

• default F11 look = no FancyMenu auto-scaling, no forced GUI scale
• custom stretched look = auto-scaling / stretch / advanced sizing enabled

If you want, I can help you get it back to:

• fully default vanilla
  or
• custom menu but with normal F11 scaling 🙂

[vapid bison]

Thread Marked as Solved

This support thread has been marked as solved by @uncut gazelle.

The AI helper is now disabled.

Marked by xyz4