Load Game Resources

In this tutorial, you will learn how to load some game resources

Resource Types

When you go to your project folder, you will find a folder named resource. This folder contains all the resources needed by your game.

Inside the resource folder, you have one sub-folder for each type of resource the Engine is able to handle.

  • Font
  • Texture
  • Animation
  • Sound
  • Music
  • Shader
  • Script

How to load resources ?

Load resources is pretty easy, you just have to copy the resources in the right folder and the Engine will load them automatically when it starts up. For example, if you want to load some sounds just copy your them into the sound folder, if you want to load to images copy them inside the texture folder.

If you put a resource in the wrong folder nothing will happen, the Engine will ignore that resource.

How to load Sprite Sheets

A Sprite Sheet is made of two files. An image/texture file containing all your Sprites and a JSON file explaining how to extract the Sprite Sheet. Once you have a Sprite Sheet you simply need to copy the image file and the JSON file into the resource/texture folder. The two files have to have the same name. The Engine only accepts Sprite Sheets created with Texture Packer.

Learn how to create Sprites Sheets here.

How to load Animations

Like a Sprite Sheet, an Animation is made of two files. An image/texture file containing all the Animation’s Frames and a JSON file explaining how to extract the Animation. Once you have an Animation you simply need to copy the image file and the JSON file into the resource/animation folder. The two files have to have the same name. The Engine only accepts Animations created with Texture Packer.

Learn how to create Sprite Animation here.

Resource Configuration

The Engine uses a configuration file to filter resources and to allow you to change some parameters used when loading resources.

{
   "animation": {
      "extension": [
         "png",
         "jpg",
         "bmp",
         "dds",
         "tga",
         "psd"
      ],
      "folder": "resource/animation"
   },
   "font": {
      "default": "Sansation",
      "extension": [
         "ttf",
         "otf"
      ],
      "folder": "resource/font"
   },
   "music": {
      "extension": [
         "wav",
         "ogg",
         "flac"
      ],
      "folder": "resource/music"
   },
   "script": {
      "extension": [
         "lua"
      ],
      "folder": "resource/script"
   },
   "shader": {
      "descriptor": "resource/shader/shader.json",
      "extension": [
         "vert",
         "frag"
      ],
      "folder": "resource/shader"
   },
   "sound": {
      "extension": [
         "wav",
         "ogg",
         "flac"
      ],
      "folder": "resource/sound"
   },
   "texture": {
      "extension": [
         "png",
         "jpg",
         "bmp",
         "dds",
         "tga",
         "psd"
      ],
      "folder": "resource/texture",
      "separator": "-"
   }
}

The Default Font

The Engine needs one mandatory resource which is the Default Font. You can choose any font to be the default font, but you have to have one. If you want to select a certain font a the default one, simply copy that font in the folder resource/font, then go to the configuration file and set the name of that font without the extension. If your font is named my_font.ttf you simply need to set “default” : “my_font”.

{
   "font": {
      "default": "my_font",
      "extension": [
         "ttf",
         "otf"
      ],
      "folder": "resource/font"
   },
}

Loaded Sprites

Once you have loaded your Images, Textures, or Sprite Sheets, the individual Sprites will appear on the left of the Editor inside the Sprite Tab. The Sprites appear in the form of buttons that we call Sprite Buttons.

  • Sprite Preview : When you hover the mouse on a Sprite Button, a preview of the Sprite will appear on the Canvas. You can Zoom In and Zoom Out the preview using the mouse wheel.

Loaded Animations

Once you have loaded your Animations they will appear on the left of the Editor inside the Animation Tab. The Animations appear in the form of buttons that we call Animation Buttons.

  • Animation Preview : When you hover the mouse on an Animation Button, a preview will appear on the Canvas. You can Zoom In and Zoom Out the preview using the mouse wheel.

Load Sounds & Music

Once you have loaded your Sounds and Music, they will appear on the top-left of the Editor inside the Music Tab.

Loaded Fonts

Once you have loaded your Fonts, they will appear on the left of the Editor inside the Text Tab.