Align to sides issue on Android and CocoonJS

0 favourites
  • Hello,

    how, via code, you can align the 4 squares in .capx at to the 4 sides of the square?

    I need this:

    <img src="" border="0" />

    I need that the 4 squares remains attached to the 4 sides even if I resize the screen.

    Someone can tell me how I can do this, please?



  • if you set their hot spots to the corner of each sprite that is relative to where you want the sprite to be (ie the top left sprite would have the hot spot in the top left)

    then is it not a case of saying

    sprite(top left) position 0,0

    sprite (top right) position (screen width,0)

    sprite (bottom left) position screen height,0

    sprite (bottom right) position (screen width,screen height)

  • RamPackWobble

    Thanks for the reply...

    Like this?

    I've not achieved the solution!

  • Try Construct 3

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

    Try Now Construct 3 users don't see these ads
  • sorry sprite 3 should be (0,screen height) not as I had above

  • RamPackWobble

    I've done this: Alignment_03.capx

    It works.

    It this a good solution?

  • Or you could use the anchor behavior.

  • Really depends on what it is for! if you want to do it with events and not behaviors, and the origin is in the center, you can do:

    Spawn BoxObj

    Set position to X: (Self.Width/2), Y: (Self.Height/2)

    Spawn BoxObj

    Set position to X: WindowWidth-(Self.Width/2), Y: (Self.Height/2)

    Spawn BoxObj

    Set position to X: (Self.Width/2), Y: WindowHeight-(Self.Height/2)

    Spawn BoxObj

    Set position to X: WindowWidth-(Self.Width/2), Y: WindowHeight-(Self.Height/2)

  • Ok, I've tried with anchor behavior.

    On PC, all is ok.

    But with CocoonJS and Android, I see the buttons that are not aligned and a flicker effect when I change Layout.

    HTML Example (working good):

    APK for Android signed with debug key(not working good):

    ZipFile for use with CocoonJS Launcher on Android:

  • I've written to CocoonJS, I hope they reply...

    I need a solution, I've invested some money in my project and I can't stop it for alignment issues!

  • You need to use the viewport functions.

    CocoonJS adjusts the screen for a few ticks, so best is to check if it has changed and if it has then set the positions again.

    On start of layout:

    <img src="" border="0" />

    Then set your x,y of the images to (0,0); (0,ScreenHeight); (ScreenWidth,0);(ScreenWidth,ScreenHeight).

    Then every tick you have a condition to check if the variable is still equal to the viewport function.

    if it has changed then redo this:

    Then set your x,y of the images to (0,0); (0,ScreenHeight); (ScreenWidth,0);(ScreenWidth,ScreenHeight).

  • Remember that you should use a layer that doesn't use parallax for the viewport function.

  • superkew

    Hello, I'll try soon!!!



  • But ScreenWidth and ScreenHeight in your example are global variables and not built-in functions, true???

  • Yes, they are global variables.

  • superkew

    No, it not works <img src="smileys/smiley19.gif" border="0" align="middle" />

    I've done this istructions:

    <img src="" border="0" />

    On browser is ok, but on Android the 2 right icons (Voce and btnAvanti) don't touch the right edge of the screen but are a bit more on the left as can you see on this (ugly) image:

    <img src="" border="0" />

    Any help, please?

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