Inventory Example - 3 Sprites and a Text Object - No Arrays

  • 15 favourites


Attached Files

The following files have been attached to this tutorial:



Download now 186.02 KB


3,696 visits, 6,689 views



This tutorial hasn't been translated.


This tutorial is licensed under CC BY 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Fairly new to C2, picked it up about 4 months ago and am loving it. I've been working on various ways to do a basic Inventory system and thought I would share some of what I have

learned so far.

First we are going to need a sprite to represent the inventory slots or grid. I use individual sprites here rather than a tiled background simply for the flexibility. Say you wanted more

slots on one row then the other or need spaces between slots. The individual sprite just seems better.

So lets create a sprite and call it grid. Like I said the only purpose of this sprite is to be the

background of our inventory slots. Here's what mine looks like.

Set C2 grid to snap to grid, show grid and 40 x 40. Very useful when lining up sprites.

make 10 copies of the grid sprite and form the inventory image.

We are going to need another sprite named "inv_item". Give this sprite 6 animation frames.

0 - 6 / 0 will be blank. 1 thru 5 will be 40 x 40 squares, each a different color. Set animation speed to 0 and loop to no to keep from scrolling through the frames. Now add 3 different instance variables to "inv_item". 1. item_id 2. item_count 3. inv_slot

Lets size the inv_item sprite to 30,30 so it will fit nicely in your grid.

For now go ahead and set the initial frame to 1 so you can easily see it. Ok now duplicate this sprite until you have 10 instances of it. Note: you want the origin point to be in the center for your grid sprite and your inv_item sprite on all animation frames. Place each sprite on top of a different grid sprite until all grid sprites have an inv_sprite on top of them.

on the top row, set the instance variable "inv_slot" for the inv_item sprite from 1 to 5 then 6 to 10 on the bottom row.

As the picture above shows we need to create another sprite named "item_found", this will be what we simulate picking up. This sprite needs to be a clone (not a copy) of the inv_item sprite. Go ahead and make a clone and rename it item_found. We don't need the inv_slot instance variable for this sprite so go ahead and delete it from Item_found.

Lets make 4 more copies of item_found giving us a total of 5. Set each ones initial frame from 1 to 5. Make sure animation speed is zero and loop is no. We should now have 5 instances of item_found all different colors. Lets add some different amounts for each one. Set the instance variable item_count different on each one. This represents how many we will pick up each time we click on the item. For this example we haven't set up a display for this when we run the layout, but this is where we stored it.

For the inventory we will set up a display to show the amount stored. Go ahead and add a text object to your layout. Set the font to 12 / black / center vertical ,horizontal and hotspot. resize it to 40,40. We need to add an instance variable named inv_slot to the text object in order to sync with each inv_item. Also set text to 0. Ok after adding the variable, make 9 more copies of text for a total of 10. Place one on top of each inv_item. You should now have 10 grids, then 10 inv_items, then 10 text all on top of each other in that order. Now set inv_slot in text from 1 to 10. make sure they are in the same order as inv_item below. This way text with inv_slot 10 will be displaying amounts for inv_item with inv_slot



  • Order by
Want to leave a comment? Login or Register an account!