Games [XUI2D] Designer variable mixed up?

Discussion in 'Game Development' started by Gunther, Sep 27, 2018.

  1. Gunther

    Gunther Active Member Licensed User

    Dear Erel,

    well I saw in all your examples that left and right from the pricture the background is always visible? Is this intendet or just by design or wrong scaling?

    May be a typo in the designer script:

    When GameRatio replaced by ScreenRatio - this spaces are gone! (here modified setting)

    'All variants script
    GameRatio = 1.333 'width / height
    ScreenRatio = 100%x / 100%y
    If ScreenRatio < GameRatio Then
     ivForeground.Height = ivForeground.Width / ScreenRatio
     ivForeground.VerticalCenter = 
     ivForeground.Width = ivForeground.Height * ScreenRatio
     ivForeground.HorizontalCenter = 
    End If
    ivBackground.SetLeftAndRight(ivForeground.Left, ivForeground.Right)
    ivBackground.SetTopAndBottom(ivForeground.Top, ivForeground.Bottom)
    lblStats.Left = ivForeground.Left
    Here Mario with GameRatio (original setting):
    Mario GameRatio.PNG

    and with ScreenRatio (modified setting):
    Mario ScreenRatio.PNG

    What you think about that Ratio? Is it locally at my phone or as one can see in your exapmle videos with spaces intendet?
  2. sorex

    sorex Expert Licensed User

    It depends on how you style the game or how you want that the game behaves.

    the difference here is 18 vs 25 tiles in width... read visibility.

    the lower screenshot might reveal too much and make the game easier as "surprises" appear faster on screen. (look at the 2nd pipe and cloud as proof)

    To make this eaqual on all devices the only way is having the black borders or put some game related images on the sides.

    the game ration Erel used is probably the ratio as what is seen on a real NES. (256x240?)
    Edit: it seem like 320x240 which is 1.33 (arcade) ratio
    Last edited: Sep 27, 2018
  3. Gunther

    Gunther Active Member Licensed User

    Dear sorex,

    Yes, I saw that too, but you see the screen is filled completely and the sizeof the characters is a little bigger.
    but if you apply that change to the 'Walking Charakter'-example you will have a fully filled background while top and bottom showing still the same areas.

    Unfortunately the objects are not on the same locations.

  4. sorex

    sorex Expert Licensed User

    then it's probably pushing things outside of the visible area.
  5. Erel

    Erel Administrator Staff Member Licensed User

    It is intended and the code is correct based on the scaling strategy that I chose.

    The strategy that I chose is:
    The game looks the same on all devices. It is linearly stretched based on the actual screen size.
    Graphics are not distorted. A square remains a square.

    The main advantage is that we don't need to worry about different screen sizes.
    The "price" we pay is that there will be borders at the sides when the selected ratio is not exactly the same as the device screen ratio.
    You can change the ratio. 1.333 is a common ratio.

    If you want to make the game fill the complete screen then remove all the designer script code and set the anchors to fill the screen.
  6. Gunther

    Gunther Active Member Licensed User

    Ah, ok. Than it is more understandable.
  7. ilan

    ilan Expert Licensed User

    at least for ios it is not the case:

    you can see that most ios devices has a ration of 1.78
    if you are targeting ipads then the ratio 1.33 is indeed the right choice.

    i dont know how the physics will be if you choose that approach but i do have experience with spritekit that the physics changes if you choose the wrong scale mode.
    it is very important to keep on all screensize the same physics experience otherwise you can be stuck in a game like you put 2m linear impulse to a body where in 1 screen it jumps above the obstacle and in another, it is not high enough and the player cannot get over that obstacle. so very important that the physics must be the same for all devices!!
  8. Gunther

    Gunther Active Member Licensed User

    Yes and by comparing the ScreenAABB output on the filled screenshot you will have that also on an Android HTC with 1.77 ratio.

    18.7/10.5 = 1.77
    18.7/14 = 1.333

    And as Erel wrote it is by design to have a square as a square.
    Last edited: Sep 28, 2018
  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice