Problema com rolagem infinita background

  • I know that there are many ways to do this, after tetting a lot, I got it that way.

    But I only partially succeeded. At the moment I have a ground and a mountain in the background. Here is an image of the layout and the event sheet:

    I put bullet behavior on the ground and on the mountain with speeds equal to -400. Until then, infinite scrolling normally works. But if I just slow down the mountain a little bit to create the illusion of parallax, then there will be an error in the rolling of the ground, appearing a white gap where I didn't have it before, as in the image below:

    Why does it happen?

    I've been trying to get the perfect background scroll for a while and I'm not going to stop until I get it perfectly, because I have a simple project that depends on it. I appreciate anyone who can help. My goal is to have 5 layers of parallax that way. I have also tried to do, instead of using bullet, set x of the object in every tick, but the same thing also happened. I'm using the bullet for now, since the same in your speed already comes with the right delta time, as the manual says? Thanks.

  • Try Construct 3

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

    Try Now Construct 3 users don't see these ads
  • Quick fix -

    Make the image for the mountain go all the way to the bottom of the screen.

    Simply set the ground sprite on top of the mountain sprite in Z settings. (Right click the sprite - Z Order)

    When creating the Images make sure you are not using white for backgrounds, but instead transparent backgrounds.

    Should work :)

  • The images do have transparent backgrounds, that's not it. The rolling of the mountain with the ground happens normally, only the error when I change the speed of the bullet property of one of the two. It only works if the ground and the mountain are at the same speed. This is weird. If I put 6 layers all at the same speed it will work, but I need different speeds to simulate the parallax

  • The problem is that objects tend to jump more than 1 pixel in a tick, causing the gap.

    You need to set X from the object's current X position and add double the width.

    -> Sprite: Set X to Sprite.X + 510

    Take a look at this video... specifically, time stamp 5:00...

    Subscribe to Construct videos now
  • Okay, I was actually researching a lot of videos and tutorials, seeing various ways to do this, I saw that I was really forgetting to multiply by dt (delta time). Nor was I referring to the set x the object's own position. Now it worked and see how my code is now: (I'm not able to post the photo)

    System - Every tick / BG - Set x to BG.x-400 * dt

                        / chao - Set x to chao.x-400 * dt

       BG - x- <512 / BG - Setx to BG.x + 1024

                        / chao - Setx to chao.x + 1024

    As you can see, I just didn't create the variable, I used the normal engine speed and it worked. It worked ok. But it had worked out before in other ways. But a problem remains.

    See that I have two layers, the floor and the BG (bottom). If I just change the speed of one of them to simulate a parallax, then it causes an error in everything and the type of a bug, which is all disconnected and becomes a huge white hole. If I return the two equal speeds it will be fine. I'm still trying to work this out.

    Thank you for your help. Now I have to resolve the speed difference issue, because I want 5 layers. But it is not working even with two.

  • Even if I use variable for speed x, and put different speeds for each element, it still gives an error.

  • Hey lincolnsalles, most probably, the problem is on this code:

    BG - x- <512 / BG - Setx to BG.x + 1024

    / chao - Setx to chao.x + 1024

    You are telling the program to Set the X for both objects whenever the BG's X position meets the desired condition.

    So, for example: if you change the "chao" speed to be slower than "BG", when "BG" X position is lower than 512, both ("BG" and "chao") will have their positions changed.

    To fix that, you will have to check the condition for each object individually. For example:

    BG - x-< 512 / BG - Set X to BG.x + 1024

    chao - x-< 512 / chao - Set X to chao.x + 1024

    Note: To avoid repeating yourself to every single object, you can make use of Families.

  • Na verdade eu postei o código faltando um pedaço realmente eu coloquei a posição dos dois objetos conforme você falou e não só do BG. Então o problema não é esse. Mas o uso da família sim é uma boa ideia obrigado. Mas mesmo no seu exemplo, que já é o mesmo que o meu, só postei faltando, se alterar a velocidade de um só da erro. Eu procurei bastante e não encontrei um só tutorial que trate de background infinito tendo paralaxe no meio. Nenhum tem parallax. apenas o background rolando eu consigo fazer mas se eu tentar simular o parallax já era. Obrigado pela resposta. Ainda estou pesquisando.

  • Entendi... estranho, porque eu já criei um jogo antigamente com parallax (vou ver se consigo achar por aqui). Se você puder compartilhar um pedaço maior do seu código ou até mesmo o projeto poderia te ajudar melhor.

  • Agora que lembrei, você pode utilizar uma outra técnica que é criar um Tiled Background ao invés de um Sprite, e aplicar o movimento alterando o "Image offset" dele.

    Eu criei um jogo utilizando essa técnica (é só clicar em Live Preview). Você pode ver isso aplicado no movimento do fundo.

    Pra programar isso é praticamente a mesma coisa, só que ao invés de modificar a posição X, você modificar o ImageOffsetX:

    System | Every tick -> BG | Set image X offset to Self.ImageOffsetX + ("valor da velocidade") * dt

    E pra checar o loop você chama "System - Compare two values":

    System | BG.ImageOffsetX < "valor da largura da sua imagem" -> BG | Set image X offset to 0

    Vê se isso funciona pra você.

  • Dude, you're good lol. In fact I had gotten this answer from an experienced person a day ago, but I still hadn't posted it here on the forum because I waited to see if anyone had anything different. But the set offset really worked and it is an action only for the tiled background, it does not work for sprite, because the object does not move on the x axis, only the image inside the object. I'm using this and thanks for the reply.

    In that case I had to take my background drawings and open them as a tiled background. But in my project, he is an infinity runner and I expected to change the scenarios after a while with this scroll, without stopping the game. I imagine that this would be done by scrolling the x-axis of the background elements and everything. With this offset set I will have to replace the images to change the levels, instead of scrolling the scenarios. I'm still wondering what that would be like. But with his answer the topic came to an end of doubt. Thank you for the answer, you are right. Thanks.

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