Constrain HUD while camera zoom

djmoyadjmoya Member Posts: 16
edited November -1 in Working with GS (Mac)
Is there a way to keep the HUD the same size and position while zooming the camera in or out? I tried constraining the width and height to the cameras and the devices screen size but it still doesnt work.

Comments

  • gsmetzergsmetzer Member Posts: 31
    Ok, I am going to tackle this today as I need this too.

    I have a pause button and Game Score as my HUD that I want to always maintain the same size during gameplay. I have a side scroller game that when a character flies above a certain height the camera zooms out of the scene to reveal more sky and scenery. This shrinks my HUD Buttons and they are hard to see and press.

    I believe the solution is to constrain the self.width and self.height to the camera width and height. However my lack of math skills keeps me from figuring out an equation that always maintains the HUD size while the Cam size is moving up and down....?

    Also, Im concerned that 5 constraints on each number of my Game Score plus another on my Pause button will slow down performance too much.

    I will keep posted.
  • DizkoDizko Member Posts: 498
    Have you tried simply making the layer that contains the HUD elements to be not scrollable?

    I know this works for camera movements, but not sure how it works with zooming.
  • SparkyidrSparkyidr Member Posts: 2,033
    @dizko, that won't work.
    The camera zoom and rotate looks at the scene as a whole, not as a series of layers.
    I would think it is totally possible to do with constrains, as a test a while ago, I fixed the rotation of an object whilst rotating the camera. But the maths for that was very very easy, I just rotated the object in the opposite direction to the camera, and the same speed.

    look at the end of the intro here


    I am using the camera to zoom and rotate to get the effect.

    I think, in theory, you could use a similar technique to negate the effects of a zoom, so as the camera zooms in, you zoom out at the same rate the objects you want to remain fixed.
  • ChaserChaser Member Posts: 1,453
    I was going to tackle this myself a couple weeks back on my current game and noticed the image of my buttons move when I zoomed out but the touch area was still in the same position as if it did not zoom the touch areas. I thought maybe when zoomed out interpolate size and location of buttons when zoomed out, but I went another route and never tried it.
  • gsmetzergsmetzer Member Posts: 31
    Welp, got distracted today.

    It seems a relatively simple fix for someone with solid math knowledge...I will have to tackle for another day and request it as a feature in the next GS update.

    Cheers.
  • gsmetzergsmetzer Member Posts: 31
    OK Here is how you can constrain your HUD while the camera is zooming out.

    1st. Determine the ratio of your HUD size to your Screen Size: Screen Size Width/Hud Size and Screen Size Height/HUD Size (In my case my HUD is 32x32 So I divided 480/32=15 and 320/32=10)

    2nd. Add two Constrain Attributes to you HUD actor.

    3rd. In the first Constrain Attribute I put:

    Self.Size.Width To: scene.Camera.Size.Width /15

    and in the second constrain I put:

    Self.Size.Height To: scene.Camera.Size.Height /10

    Walla!

    However now I need to constrain the position as well as a camera offset to maintain the functionality.

    Anyone know of a more elegant fix than adding a bunch of constraints?
  • scitunesscitunes Member, Sous Chef Posts: 4,047
    gsmetzer said:
    OK Here is how you can constrain your HUD while the camera is zooming out.

    1st. Determine the ratio of your HUD size to your Screen Size: Screen Size Width/Hud Size and Screen Size Height/HUD Size (In my case my HUD is 32x32 So I divided 480/32=15 and 320/32=10)

    2nd. Add two Constrain Attributes to you HUD actor.

    3rd. In the first Constrain Attribute I put:

    Self.Size.Width To: scene.Camera.Size.Width /15

    and in the second constrain I put:

    Self.Size.Height To: scene.Camera.Size.Height /10

    Walla!

    However now I need to constrain the position as well as a camera offset to maintain the functionality.

    Anyone know of a more elegant fix than adding a bunch of constraints?

    there's another huge issue with zoom which you alluded to - the touch coordinates do not line up with the game elements when zoomed. What I had to do was create touch actors like the ones in codemonkey's joystick demo and check to see if they were overlapping with the hud elements. Just be sure to put the camera zoom ratio and offset in the touch actors. You may want to check out the shared project called "camera to world coordinates" made by Orbz. It will show you how to do the zoom ratio and offset. Just search for it in the new section of the gs creator start screen.
  • StormyStudioStormyStudio United KingdomMember Posts: 3,989
    I had this problem with my Dark Asylum game... in the end I found the easiest thing was to animate my HUD off screen during any zoom, and then back on when it can. This is a bit of a cop out but a lot less complicated. Obviously this can only work in certain scenarios.
  • scitunesscitunes Member, Sous Chef Posts: 4,047
    stormystudio said:
    I had this problem with my Dark Asylum game... in the end I found the easiest thing was to animate my HUD off screen during any zoom, and then back on when it can. This is a bit of a cop out but a lot less complicated. Obviously this can only work in certain scenarios.

    Me too!
  • Rob2Rob2 Member Posts: 2,402
    This does the position of the hud (in this case starting at 50,50) but it 'jiggles' around during the zoom :/

    image
  • gsmetzergsmetzer Member Posts: 31
    Yes this brings up several issues. Ill take a look at the joystick tut.

    There needs to be a way that you can place a graphic on the device screen that is not influenced by the scene Camera....This would be a simple and easy fix! But it seems there is no GS option for that. Just scrollable and non-scrollable....

    I just added a suggestion for a zoom option added to the scroll/non-scroll Layers. Please chime in too!

    http://gamesalad.com/forums/topic.php?id=21853&replies=1#post-165912
  • crapscraps Member Posts: 353
    Check out these two photos. The white boxes on the wall are the zoom to areas. The first shows the scene before zoom.
    http://i53.tinypic.com/1j8aw5.png

    See the small square in the left lower corner - remember its size.

    Now look at the second "zoomed" image. You can see the "reset" button actor has increased in size - not good - and there appears to be no fix.
    http://i52.tinypic.com/2qdqydf.png

    But if you remember the size of the small sqwuare - I can assure you the the original area
    ( that the the mouse can click on or touch ) is still its original size. It appears the image increased NOT the attribute area.

    I have measured this and its true.
    So with that in mind maybe there is something we can figure out that will work.
Sign In or Register to comment.

© Vanilla Keystone Theme 2025