How do I center an object to variable window size?

Not favoritedFavorited Favorited 0 favourites
  • 5 posts
From the Asset Store
Hand-painted tiles, objects, animated objects, and background to build a colorful Mayan civilization environment.
  • I got this to work before. But now I am at the point if I don't know if I broke something or something got broken with construct 3 update.

    I want to center the panel on X axis on screen. I used int(ViewportWidth("UI") / 2) before, but it does not work anymore. Also getting the window inner width via PlatfromInfo and setting it based on that value does not work. It all worked before, until it did not... It is all off to the left side of window a bit, kind of odd.

    Switching the "unbounded scrolling" option on layout on/off does not affect the behaviour.

    I am also trying to account for screen scaling, most of the 4k monitors are set to 200% scale, but can also be set to 175% etc, which messes up the rendering. -- How do I account for that?

    Can someone also explain to me in which cases ViewportWidth can be something other than Window inner width, it is supposed to be viewport..? I presume if layer is scaled up?

  • I got it to work with ViewportMidX("UI"), but I am still wondering how could I calculate it manually.

  • I got it to work with ViewportMidX("UI"), but I am still wondering how could I calculate it manually.

    Hi. The old method should also work.

    Perhaps you forgot to take into account the beginning of the screen.

    ViewportLeft("UI")+ ViewportWidth("UI") / 2

  • Manually in what way? In construct we deal with positions in layout coordinates, and construct converts those to canvas coordinates using scrollx/scrolly, layout scale, layout rotation, canvas size, and layer scale, parallax, etc… to draw.

    Well, maybe you are asking how viewportMidX(“ui”) is calculated… that could also be calculated with:

    ViewportLeft(“ui”)+viewportWidth(“ui”)/2

    Or

    (ViewportRight(“ui”)-ViewportLeft(“ui”))/2

    Or presumably if the ui layer has a parallax of 0,0 then you could just use:

    viewportWidth(“ui”)/2

    If the ui had a parallax of 100,100, and the layout had unbounded scrolling checked, then you could also just use:

    Scrollx

    With bounded scrolling the scrollx gets clamped but you can also clamp it manually if you’re so inclined:

    Clamp(scrollx, viewportWidth/2, layoutWidth-viewportWidth/2)

    But it would behave oddly if the view was smaller than the layout.

    If you set the canvas width the the window.innerWidth and had no layer or layout scaling then you could use:

    PlatformInfo.InnerWidth/2

    Of course all of those could be used with int() to round away the 0.5s from odd sizes. Also to manually handle the transformations that layers let you have then the formulas would get more involved and you may as well just use the expressions construct offers.

    Anyways, based on your previous posts you could get an unscaled pixel perfect viewport covering the window by setting the fullscreen scaling in your project properties to “none”, the set the canvas size in events to the innerWidth/height of the window. As long as the canvas is the only thing on the window there shouldn’t be any page scrolling. Then you’d just center with viewportMidX like you did above. There really isn’t a whole lot of benefit to calculating it more manually unless you encounter something that the engine doesn’t recalculate until drawing.

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • "Or presumably if the ui layer has a parallax of 0,0 then you could just use:

    viewportWidth(“ui”)/2"

    That is precisely what I have, but somehow the viewportWidth(“ui”)/2 stopped working somehow. I did change viewport size...

    So as of now I assume it should be viewportLeft("UI") + (viewportWidth(“ui”)/2), but I don't understand why.

Jump to:
Active Users
There are 0 visitors browsing this topic (0 users and 0 guests)