Learn how to use Sprite Sheets with ShiVa:
This blog post contains full source code available on GitHub.
It looks like the download page of JPSprite is down and that the project was abandoned. I'd currently NOT recommend to use this.
The most likely better way to use sprites and UI assets is following this post in Shiva's Knowledge Base
What is a sprite sheet
Why you should use sprite sheets
Creating sprite sheets with TexturePacker
Loading sprite sheets with JPSprite
Using sprites (free)
A sprite sheet is simply a big image containing many sprites which would otherwise be single images. There's also information in a separate file that describes where the sprites are located so that they can be cut from the sheet and be used individually.
You are right - adding single sprites to your game is in many cases the easier way to go... but: Using sprite sheets is quite easy if you have the right tools. And the benefit you get from it is immense!
There are 3 main reasons to use sprite sheets:
Memory reduction happens in 3 ways:
Using only a single file reduces the work required to load a file into memory to opening 1 file and loading it as a complete block into memory.
This speeds up things dramatically compared to loading many small files. Even if you are in flash memory or on an SSD the load time will be significantly reduced.
A sprite sheet reduces the draw calls required to render your game scenes. Instead of setting source texture, coordinates and target space for each single sprite setting all coordinates as a list at once is possible.
This increases the framerate of your game - especially if you have many game objects in your scenes.
As I already said: Using a sprite sheet requires some overhead. But with the right tools it's easy to handle.
TexturePacker is such a tool that makes it easy for you.
Open TexturePacker and select ShiVa3D + JPSprite extension as framework.
Drag and Drop your sprites inside TexturePacker, enter a location to store the texture and data file.
Press Publish sprite sheet to create the sprite sheet.
![img/shiva-select-framework.png](TexturePacker: Selecting shiva Framework)
![img/texturepacker2.png](TexturePacker packing sprites for ShiVa)
JPSprite is an importer for ShiVa that takes the texture and description file and assigns the sprites to an HUD component or object material.
Additionally a paid version of JPSprite also allows you easily play animations located on sprite sheets.
First of all you have to add the generated XML and texture file to ShiVa.
In the Data Explorer
use Import > Texture and select the image file
use Import > XML and select the description file
You now have 2 new files that you can add to your project. Open the Game Editor's Resources tab. Drag & drop the 2 files from the Data Explorer into the Game Editor. See image on the right side.
You are now ready to use the atlas in your code.
![img/reference-resources.png](Adding resources to ShiVa)
First of all you have to load the atlas inside the code:
JPSprite.setupAtlas ( "jpspritesample_sprites" )
All you have to do to add a sprite to an HUD component is give JPSprite the component's handle and the sprite's name:
local hPlaneComponent = hud.getComponent ( this.getUser ( ), "JPSpriteSample.Plane" ) JPSprite.setComponentSprite ( hPlaneComponent, "plane" )
This adds the sprite to the component and resizes it to match the sprite.
JPSprite also allows to flip sprites:
local hPlaneComponent = hud.getComponent ( this.getUser ( ), "JPSpriteSample.Plane" ) local bFlipX = true JPSprite.setComponentSprite ( hPlaneComponent, "plane", bFlipX )