collision tileset

178 views
Skip to first unread message

emailchuckjr

unread,
May 21, 2010, 11:18:40 PM5/21/10
to ReplicaIsland Coding Community
First I want to say thanks to Chris for your code and your responses
to the group. You guys will be able to tell we(me and my college age
son, who is the graphic artist) are Noobs when it comes to games, but
we can code in Java and we wanted to try and get something going using
your engine.

We are having trouble understanding collision tileset and tile set
maps. I read your blog on Tile-Based Line Segment Collision. I think
understand it, however, I am not sure how the image and tilesets are
tied together.
I realize your binary file contains data for each level. And you have
one collision.bin file. I guess you store all collision information
for the whole game in there?
We are new to collision Tileset creation any pointers here would be
appreciated.

Is there a Tile Editor you recommend, that would go closely with what
you did?
Maybe we need to use photoshop as you did. What do you think?

We tried a tile editor called TaT Tile Editor, which created our
Tileset and created an xml file. However, it looks like nothing your
engine would take as binary.

We don't mind researching and reading since a lot of this is new.
However, there isn't too much available when it comes to Tilesets for
Android.

We have spent quite a bit of time on the sprites since that was
straightforward.
Thanks for any info you can provide, we appreciate any time you guys
spend helping us with this.
Chuck and Zeke

Bart Hirst

unread,
May 22, 2010, 7:19:20 AM5/22/10
to replica-island-...@googlegroups.com

Chuck & Zeke – I’ve been working on this too.  You are correct that collision.bin has all the collision segments used in the game (see screenshot below.)  The collision segment tile indexes are stored in the collision layer of the level so that each tile in the game has a collision tile index referencing back to collision.bin. 

As for tile editors I took a look at several – I liked Tiled (www.mapeditor.org) but there’s hardly any sample code / documentation for writing plugins so I didn’t venture down that path – I guess I could have figured it out, but I was looking for something a little more agile.  After all, level designers and the integration into the game engine is a whole project unto itself! 

I really wanted to roll my own tile editor but didn’t want to start from scratch so I found some code floating around out there.  I contacted the dev and asked him if he wanted to help extend the code but never heard back from him.  In the meantime I modified the code enough to read at least one layer of Chris’s level format.  At this time I still don’t have an editor that will write back because as I said a tile editor is quite a project.

replica Map Utility.jpg

Chris Pruett

unread,
May 22, 2010, 9:46:28 PM5/22/10
to replica-island-...@googlegroups.com
Hi guys,

Sorry this is a little confusing. I'm attaching the Photoshop file
that I used to set up the collision tiles. That, in conjunction with
the javascript code in tools/, is the the source of the data that Bart
is playing with.

At a basic level, the collision system in Replica Island is just line
segments with normals. Those line segments are organized into tiles
for two reasons:

1) It is fast to index into a 2D array of tiles, which makes ray
casting easy, and
2) I already had a level editor that was tile-based.

There's no reason you have to maintain the tile-ness of this engine.
If you can organize the collision world some other way, and just
maintain the ray-based interface of CollisionSystem, then it doesn't
really matter how the line segments are organized.

If you want to continue to use tiles, but you want to use different
shapes than I used, here's what you need to do:

1) Make a new tile map, like the one I am attaching.
2) In Photoshop, make paths around each collision shape. Make a new
path for each shape. Make sure each shape is closed!
3) Run the ExtractPoints.js script in Photoshop. When prompted, enter
the size of your tiles (probably 32x32). This script takes a while,
so be patient. The output is a new file with a text layer containing
all of the line segments and normals, organized by tile.
4) Convert that to a binary file. The format is pretty simple. At
the bottom of this post is the PHP code I used to take the text output
of ExtractPoints.js and generate collision.bin for the Replica Island.

Now what you have is a new collision.bin, which is a definition of
each collision tile used in the game. It's the equivalent of a tile
texture map.

If you use your new tile map image with your tile editor, you can lay
out floors and walls like regular tiles. Store the indexes in the map
file just like regular tiles, but mark the layer as collision, and the
collision system will use the data in collision.bin and your map file
to build the runtime collision world.

That's sort of a simple overview but hopefully gives you an idea of
how the collision world and tile map fit together!

Chris
collision tiles and paths.psd

emailchuckjr

unread,
May 23, 2010, 1:09:58 AM5/23/10
to ReplicaIsland Coding Community
Thanks Guys for your quick responses! The explanations helped with
understanding the collision file and it's purpose. To start with we
will use the collision.bin provided.

We are really trying to learn from the replica project and we are only
trying to change the levels look/feel and player images.

Chris, you mention our map file from our map editor. We are confused
about the map image and the map file.
Here's what we did:
We imported your collision image into a tile editor(Tiled) and created
it as a object layer. Then I create another tile layer over it which
contain my tileset images. The editor saves the map in csv or xml
format base64 encoded.

I am not sure how to mark a layer as collision with Tiled. Secondly,
I am not sure of the format of the file the engine would read for
loading the level. I see LevelSystem.loadLevel() use the bin file to
determine the background layer and the png to use(such as cave.png).
I also see a type 2 for Objects. So it looks like a lot of info is in
the *level*.bin file. Of which I am not sure how to provide.

In short, I have a Tile editor however, it doesn't look like it will
create a file that will match the signature required for loadlevel().
Are we on the right track?

Thanks,
Chuck and Zeke
> ---
> Here's the point serialization code I used in PHP:
>
> function exportCollisionEdges($name, $edges)
> {
>         $edge_array = explode("\n", $edges);
>
>         $tiles_array = array();
>
>         for ($x = 0; $x < count($edge_array); $x++)
>         {
>                 sscanf($edge_array[$x], "%d:%f,%f:%f,%f:%f,%f", $tile_id, $startX,  
> $startY, $endX, $endY, $normalX, $normalY);
>
>                 if (!isset($tiles_array[$tile_id]))
>                 {
>                         $tiles_array[$tile_id] = array();
>                 }
>
>                 $nextIndex = count($tiles_array[$tile_id]);
>
>                 $tiles_array[$tile_id][$nextIndex]['startX'] = $startX;
>                 $tiles_array[$tile_id][$nextIndex]['startY'] = $startY;
>                 $tiles_array[$tile_id][$nextIndex]['endX'] = $endX;
>                 $tiles_array[$tile_id][$nextIndex]['endY'] = $endY;
>                 $tiles_array[$tile_id][$nextIndex]['normalX'] = $normalX;
>                 $tiles_array[$tile_id][$nextIndex]['normalY'] = $normalY;
>         }
>
>         $fileName = tempnam("tmp", "bin");
>
>         $file = fopen($fileName, "wb");
>         if ($file != false)
>         {      
>                 $output = "";
>
>                 // collision tile files start with 52
>                 $output .= chr(52);
>                 $output .= chr(count($tiles_array));
>
>                 foreach ($tiles_array as $index => $edge_list)
>                 {
>                         $output .= chr($index);
>                         $output .= chr(count($edge_list));
>                         foreach ($edge_list as $edge)
>                         {
>                                 $output .= pack("ffffff", $edge['startX'], $edge['startY'],  
> $edge['endX'],
>                                         $edge['endY'], $edge['normalX'], $edge['normalY']);
>                         }
>                 }
>                 fwrite($file, $output);
>                 fclose($file);
>
>                 // Stream the file to the client
>                 header("Content-Type: application/bin");
>                 header("Content-Length: " . filesize($fileName));
>                 header("Content-Disposition: attachment; filename=\"".$name.".bin\"");
>                 readfile($fileName);
>
>                 unlink($fileName);
>                 exit();
>         }
>
>
>
> }
>
>
>
>  collision tiles and paths.psd
> 156KViewDownload

Bart Hirst

unread,
May 23, 2010, 6:43:27 AM5/23/10
to replica-island-...@googlegroups.com

That sounds good.  You guys are definitely on the right track. 

-          If you’re planning on reusing Chris’s LevelSystem and TiledWorld  Loaders (loadLevel & parseInput) to read your level data then you’re going to have to write a Tiled plug-in to export in that format.

-          Or you could re-write the level loaders within replicaIsland to accept Tiled csv / xml formats

In order to mark a layer as collision set its layer type=1.  It’s hardcoded in loadLevel.

Here is some additional information on the level.bin file format If it would help (see image below)

level_format.JPG

emailchuckjr

unread,
May 23, 2010, 10:26:01 AM5/23/10
to ReplicaIsland Coding Community
Bart, thanks. Thats a nice breakdown of what the leveloader interface
is. You mention setting the layer as type=1. Is that as simple as
setting a property and value on the layer to property=type and
value=1? We are really new to this Tile creation stuff We will give
it a try.

I guess I will need to spend some time understanding the format from
Tiled then I could reformat it output they way the game engine is
expecting it. I just downloaded the Tiled Java version and it seems
to have more functionality than the QT version.

As you can tell, we are having most of the problems with meta data for
the game engine. I can't wait to get past this! And get back into
the Java.

Thanks again for your help,
C and Z

On May 23, 3:43 am, Bart Hirst <louisbhi...@gmail.com> wrote:
> That sounds good.  You guys are definitely on the right track.
>
> -          If you’re planning on reusing Chris’s LevelSystem and TiledWorld
> Loaders (loadLevel & parseInput) to read your level data then you’re going
> to have to write a Tiled plug-in to export in that format.
>
> -          Or you could re-write the level loaders within replicaIsland to
> accept Tiled csv / xml formats
>
> In order to mark a layer as collision set its layer type=1.  It’s hardcoded
> in loadLevel.
>
> Here is some additional information on the level.bin file format If it would
> help (see image below)
>  level_format.JPG
> 99KViewDownload

Bart Hirst

unread,
May 23, 2010, 11:14:29 AM5/23/10
to replica-island-...@googlegroups.com
About layer type = 1 - remember that replica's map file format is binary.  When it reads the file (in binary) it reads the first byte of the layer and interprets that as the type.  If you open a level in a hex editor you'll see the fourth byte is type of the first layer...  then the layer data... etc.

Chris Pruett

unread,
May 23, 2010, 12:53:48 PM5/23/10
to replica-island-...@googlegroups.com
Just to add to what Bart said: there's nothing requiring you to use the same binary format that I've defined.  If you have a tool that outputs XML, you could write an XML loader; you'd just do the parsing in some new code and fill out the same structures (TiledWorld et al) that I've already defined.  That might be easier than writing a binary exporter for the tile editor tool.

Chris

emailchuckjr

unread,
May 23, 2010, 8:36:57 PM5/23/10
to ReplicaIsland Coding Community
Chris that sounds like a good idea.
Bart, I would write a XML loader if could send a sample "tmx" file
from Tiled with the definitions and mapping. That way I could
understand the tile editor better and it's output.

I have quite a learning curve with Tile editor.

Thanks,
Chuck

Bart Hirst

unread,
May 23, 2010, 9:08:35 PM5/23/10
to replica-island-...@googlegroups.com
Chuck I don't follow - are you asking for a Tiled file?  Or are you creating one?

emailchuckjr

unread,
May 23, 2010, 11:23:41 PM5/23/10
to ReplicaIsland Coding Community
Bart,
I am very new to Tile Editors. I don't think I know how to create a
tile map correctly. I was hoping by loading one that you created,
into the LoadLevel() call, I could learn more about them. So I am
willing to write a loader, as Chris suggested, of the output from your
tile editor. I wasn't sure if you are still using Tiled. I have been
playing around with Tiled and do not see all the data required. Like
I said I am very new to Tile Editors if you have a recommendation for
a different one that would be great.

Chuck

On May 23, 6:08 pm, Bart Hirst <louisbhi...@gmail.com> wrote:
> Chuck I don't follow - are you asking for a Tiled file?  Or are you creating
> one?
>
> ...
>
> read more »

Bart Hirst

unread,
May 24, 2010, 8:57:24 AM5/24/10
to replica-island-...@googlegroups.com

Ok I though that’s what you meant.  Just to clarify – I’m not using Tiled – I’m using a different much smaller tile editor implementation – and it’s only handling one layer at the moment.  I’m also keeping with the Binary format so I don’t have anything that’s “human” readable for you to look at – sorry about that.

Chuck if you do a detailed code review of LevelSystem and TiledWorld that’s all you need.  The lights will start going on.

Thanh Tai Vuong

unread,
May 29, 2014, 3:11:33 AM5/29/14
to replica-island-...@googlegroups.com
Hi,

I can't find out PHP code in your post. Can you help me export text output to collision.bin ?
Thank for source.

Bart Hirst

unread,
May 29, 2014, 7:50:22 AM5/29/14
to ReplicaIsland Coding Community
it was inline ... re-posting here:

function exportCollisionEdges($name, $edges)
{
        $edge_array = explode("\n", $edges);
        
        $tiles_array = array();
        
        for ($x = 0; $x < count($edge_array); $x++)
        {
                sscanf($edge_array[$x], "%d:%f,%f:%f,%f:%f,%f", $tile_id, $startX, $startY, $endX, $endY, $normalX, $normalY);

                
                if (!isset($tiles_array[$tile_id]))
                {
                        $tiles_array[$tile_id] = array();
                }
                
                $nextIndex = count($tiles_array[$tile_id]);
                
                $tiles_array[$tile_id][$nextIndex]['startX'] = $startX;
                $tiles_array[$tile_id][$nextIndex]['startY'] = $startY;
                $tiles_array[$tile_id][$nextIndex]['endX'] = $endX;
                $tiles_array[$tile_id][$nextIndex]['endY'] = $endY;
                $tiles_array[$tile_id][$nextIndex]['normalX'] = $normalX;
                $tiles_array[$tile_id][$nextIndex]['normalY'] = $normalY;
        }
        
        $fileName = tempnam("tmp", "bin");
        
        $file = fopen($fileName, "wb");
        if ($file != false)
        {       
                $output = "";
                
                // collision tile files start with 52
                $output .= chr(52);
                $output .= chr(count($tiles_array));
                
                
                foreach ($tiles_array as $index => $edge_list)
                {
                        $output .= chr($index);
                        $output .= chr(count($edge_list));
                        foreach ($edge_list as $edge)
                        {
                                $output .= pack("ffffff", $edge['startX'], $edge['startY'], $edge['endX'],

                                        $edge['endY'], $edge['normalX'], $edge['normalY']);
                        }
                }
                fwrite($file, $output);
                fclose($file);
                
                // Stream the file to the client
                header("Content-Type: application/bin");
                header("Content-Length: " . filesize($fileName));
                header("Content-Disposition: attachment; filename=\"".$name.".bin\"");
                readfile($fileName);
                
                unlink($fileName);
                exit();
        }
}

--
You received this message because you are subscribed to the Google Groups "ReplicaIsland Coding Community" group.
To unsubscribe from this group and stop receiving emails from it, send an email to replica-island-coding...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Message has been deleted

Thanh Tai Vuong

unread,
May 29, 2014, 9:07:44 AM5/29/14
to replica-island-...@googlegroups.com
Thank you :)

Reply all
Reply to author
Forward
0 new messages