Welcome, Guest. Please login or register. Did you miss your activation email?

Author Topic: Best way to make tiles not have borders in between them?  (Read 2352 times)

0 Members and 1 Guest are viewing this topic.

Fyuchanick

  • Newbie
  • *
  • Posts: 8
    • View Profile
Best way to make tiles not have borders in between them?
« on: August 21, 2017, 03:37:37 pm »
So I am trying to make a game using SFML and visual c++. Currently I have different sprites without borders on certain sides for every combination of tiles that could be bordering each other, then used nested if statements to check which sprite to use. However, this slows down my game to the point where I can't even play it. Is there a better way to do this?

eXpl0it3r

  • SFML Team
  • Hero Member
  • *****
  • Posts: 11028
    • View Profile
    • development blog
    • Email
Re: Best way to make tiles not have borders in between them?
« Reply #1 on: August 21, 2017, 04:04:43 pm »
A bunch of if-statements won't make your game run noticeably slower, instead you're probably copying or even loading some image every frame iteration, which is an expensive operation and will slow things.

Without code, we however can't help you much further.
Official FAQ: https://www.sfml-dev.org/faq.php
Official Discord Server: https://discord.gg/nr4X7Fh
——————————————————————
Dev Blog: https://duerrenberger.dev/blog/

Fyuchanick

  • Newbie
  • *
  • Posts: 8
    • View Profile
Re: Best way to make tiles not have borders in between them?
« Reply #2 on: August 22, 2017, 12:55:40 am »
This is the code:
//Render tiles
                for (int i = 0; i < blockX.size(); i++) {
                        block.setPosition(float(blockX[i]), float(blockY[i]));
                        if (blockType[i] == "metal") {
                                //if block is metal tile
                                block.setTexture(metalBlockSingle);
                                if (doesBlockExist(blockX[i] + 20, blockY[i])) {
                                        //if block is to right
                                        if (doesBlockExist(blockX[i], blockY[i] + 20)) {
                                                //if block is below
                                                if (doesBlockExist(blockX[i] - 20, blockY[i])) {
                                                        //if block is to left
                                                        if (doesBlockExist(blockX[i], blockY[i] - 20)) {
                                                                //if block is above
                                                                block.setTexture(metalBlockCenter);
                                                        }
                                                        else {
                                                                block.setTexture(metalBlockBottomRightLeft);
                                                        }
                                                }
                                                else if (doesBlockExist(blockX[i], blockY[i] - 20)) {
                                                        //if block is above
                                                        block.setTexture(metalBlockTopBottomRight);
                                                }
                                                else {
                                                        //if block is neither above nor to left
                                                        block.setTexture(metalBlockBottomRight);
                                                }
                                        }
                                        else if (doesBlockExist(blockX[i] - 20, blockY[i])) {
                                                //if block is to left
                                                if (doesBlockExist(blockX[i], blockY[i] - 20)) {
                                                        //if block is above
                                                        block.setTexture(metalBlockTopRightLeft);
                                                }
                                                else {
                                                        block.setTexture(metalBlockRightLeft);
                                                }
                                        }
                                        else if (doesBlockExist(blockX[i], blockY[i] - 20)) {
                                                //if block is above
                                                block.setTexture(metalBlockTopRight);
                                        }
                                        else {
                                                //if block is only right
                                                block.setTexture(metalBlockRight);
                                        }
                                }
                                else if (doesBlockExist(blockX[i], blockY[i] + 20)) {
                                        //if block is below
                                        if (doesBlockExist(blockX[i] - 20, blockY[i])) {
                                                //if block is to left
                                                if (doesBlockExist(blockX[i], blockY[i] - 20)) {
                                                        //if block is above
                                                        block.setTexture(metalBlockTopBottomLeft);
                                                }
                                                else {
                                                        //if block is not above
                                                        block.setTexture(metalBlockBottomLeft);
                                                }
                                        }
                                        else {
                                                //if block is not to left
                                                if (doesBlockExist(blockX[i], blockY[i] - 20)) {
                                                        //if block is above
                                                        block.setTexture(metalBlockTopBottom);
                                                }
                                                else {
                                                        //if metal block is not above
                                                        block.setTexture(metalBlockBottom);
                                                }
                                        }
                                }
                                else if (doesBlockExist(blockX[i] - 20, blockY[i])) {
                                        //if block is to left
                                        if (doesBlockExist(blockX[i], blockY[i] - 20)) {
                                                //if block is above
                                                block.setTexture(metalBlockTopLeft);
                                        }
                                        else {
                                                block.setTexture(metalBlockLeft);
                                        }
                                }
                                else if (doesBlockExist(blockX[i], blockY[i] - 20)) {
                                        //if block is above
                                        block.setTexture(metalBlockTop);
                                }
                        }
                        window.draw(block);
                }

Phanoo

  • Full Member
  • ***
  • Posts: 136
    • View Profile
Re: Best way to make tiles not have borders in between them?
« Reply #3 on: August 31, 2017, 10:08:24 am »
Never use SetTexture in loops it's very costly. Store the texture pointer (and maybe the subRect if u have multiple sprites per texture) directly into your block when you load your level

Hapax

  • Hero Member
  • *****
  • Posts: 3379
  • My number of posts is shown in hexadecimal.
    • View Profile
    • Links
Re: Best way to make tiles not have borders in between them?
« Reply #4 on: August 31, 2017, 10:12:07 pm »
I think the recommendation there is to place all block textures in one sf::Texture, set it once and then just change the texture rect instead.

That said, what is block?

Looks like you have a lot of those blocks being drawn separately. You may want to consider using a form of tile map (which draws everything at once). There is an example of a simple tile map in the vertex array tutorial. However, make sure you read the entire tutorial ;)

This, though, still draws each block as a separate 'quad' so the gaps (or 'borders' as you called them) between tiles can still appear. This has been discussed a lot in these forums. The most basic way is to use strict values. That is, round all positions, lock rotations to 90° steps, use scales of multiples of 2 and the same applies for the view (position, rotation, size). A more robust and flexible (but slightly more complicated) way would to be to render to a render texture first (with strict values as above) and then draw the render texture to window with more free values (offset positions and scales, for example, can be non-integer). This removes the gaps.

Just as a footnote, Selba Ward's Tilemap does all this automatically ;)
Selba Ward -SFML drawables
Cheese Map -Drawable Layered Tile Map
Kairos -Timing Library
Grambol
 *Hapaxia Links*