Setup Items

Learn how to setup in-game items!

1. Creating item hotbar

This will help create a hotbar for your game like minecraft that lets you see and use different items in your game. To create the hotbar you will start in the game.js file. Using the useItemBar function in the init method we can create this hotbar with the number being the amount of spaces that you want to put items in.

init() {
	g.useItemBar(8);
}

This allows you to create 8 spots in your item bar to place items.

2. Creating the item

Now we need to create the items that the player can use in the room.js file. In the room.js file we will create the item with the createNewItem function in the onInit method. We can pass in the item name, image name, and what you want to happen when you use the item.

onInit() {
	g.createNewItem('pickaxe', 'pickaxe.png', (player, data, actions) => {
		actions.swingItem();
	})
}

This would swing the item when this item is used.

3. Adding the item to the hotbar

Once we have created the item we need to choose which items to add to which players hotbar. In this example we will add it to the players hotbar when the game starts, but you can add it at anytime during the game. To add it on start we will use the addItemToCharacter function in the room.js file inside of the onJoin method.

onJoin(client,data) {
	const  player = g.getACharacter('players', client.sessionId);
	g.addItemToCharacter(player, 'pickaxe');
}

This gets the player that joined and adds the pickaxe item that we created to their hotbar.

4. Attaching items to character

After adding the item to the hotbar we can also attach it to the player. First we need to add the image of the item to our game in the game.js file with the loadImage function inside of the preload method.

preload() {
	g.loadImage('pickaxe', 'pickaxe.png');
}

Then we will go back to the room.js and attach it to the player with the attachTo function. If we add this function in the onJoin method we can attach this item to the character so he is holding it as he moves along. To do this we tell the function which item to attach, how far right to move it from the center of the player, how far down to move it, and how big it should be on the player.

onJoin(client,data) {
	...
	g.attachTo('players', client.sessionId, {item:g.getItem('pickaxe'), x:-50, y:-100, scale:0.5});
}

Need Help?

Proofread your code, check with your team and classmates, and if you’re still stuck!

Join us on Google Meet