How to fix sprites to the edge of the screen?

Post reply
0 favourites
  • 7 posts
From the Asset Store
On the edge
$25 USD
On the Edge is a puzzle game where you have 40 levels to have fun with.
BassoGames's avatar
BassoGames

  • I have two sprites in my layout that are half the size of my screen. I'm using these as touch inputs, when I touch the one on the left side of the screen my player moves left, and vice versa for the right side sprite.

    The problem is, if I try to test the game on different screen sizes (or even just resize the preview window) the sprites don't stick to the edges of the screen, so the "buttons" are a bit unreliable.

    How would you do this in Construct 3? Or is there a better way to implement these input buttons?

  • I think you need to set their position to view port Left and Right of the screen.

    OR

    You can check the touch.X compare with center of your screen :

    touch.X < CENTER -> Turn Left

    touch.X > CENTER -> Turn Right

  • I recommend using TBGs instead of sprites. Place these on a layer with parallax 0, 0 and scale 0. Then use the event of the image. The abs()-values are meaningful only if your Fullscreen Mode is Scale inner/outer. With Letterbox scale you can omit it.

  • kriand I almost have it working using your method. Your math was a bit off, I had to use -ViewportRight instead of ViewportRight for the right side button's size, because otherwise the button would be displaying off the right side of the screen. But otherwise, it works!

    But I have another problem, my buttons overlap. See image attached.

    The right side button (purple) overlaps the left side button (green) whenever I try to scale the preview window below the original size. From what I understand, it should be calculating the viewport's scale every tick, so I'm not sure why this is happening. I am using the Scale Inner setting in my project properties.

    Anyone have any ideas?

  • I forgot to mention that the left buttons origin is top-left and the right buttons top-right. In my test file they dont overlap. If you want a little distance between the buttons, you can divide by 2.05 or similar instead of 2.

  • Try Construct 3

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

    Try Now Construct 3 users don't see these ads

  • Just changed the origin and now it works perfectly. Thanks!

  • You might also look into the Anchor behavior as it was made to assist with problems just like this one. Docs here:

    construct.net/make-games/manuals/construct-3/behavior-reference/anchor

    It sounds like you already have a good solution, but Anchor may prove useful for you at some point.

Post reply
  • 7 posts
Return to board index
Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)