joo
If you create your own loader, it really depends on your implementation.
Here are some possible ideas.
Probably, having a single .atlas is the easiest way. However, in that case, if you don't want to load the textures all together, you have to write your implementation of loadTextureAtlas that does not load the textures and consequently does not set the textures for the regions.
This implies that you have to load the textures on demand before they are used.
To do that, you can use loadTexture from the AssetManager. Then call the setTexture on the respective atlas page you just loaded. You can write a method that takes as input the atlas page for which you want to load the texture and does the two things mentioned above.
After that, you should be safe to use your animations/skins that use the atlas pages just loaded.
This is an example of what I'm saying.
Add a loadTextureAtlasButNoTextures method to AssetManagerBase (you can extend it):
loadTextureAtlasButNoTextures (path: string,
success: (path: string, atlas: TextureAtlas) => void = () => { },
error: (path: string, message: string) => void = () => { },
fileAlias?: { [keyword: string]: string }
) {
path = this.start(path);
this.downloader.downloadText(path, (atlasText: string): void => {
try {
this.success(success, path, new TextureAtlas(atlasText));
} catch (e) {
this.error(error, path, `Couldn't parse texture atlas ${path}: ${(e as any).message}`);
}
}, (status: number, responseText: string): void => {
this.error(error, path, `Couldn't load texture atlas ${path}: status ${status}, ${responseText}`);
});
}
This is the very same code of loadTextureAtlas without the texture loading.
Then, you can use this for example in a spine-webgl app.
async loadAssets(canvas) {
// Load the skeleton file.
canvas.assetManager.loadJson("assets/skeleton.json");
// Load the atlas and its pages.
// canvas.assetManager.loadTextureAtlas("assets/skeleton.atlas");
const atlas = await new Promise(resolve => {
canvas.assetManager.loadTextureAtlasButNoTextures("assets/skeleton.atlas", (_, atlas) => resolve(atlas));
});
// assuming we have two pages
const [page1, page2] = atlas.pages;
// load first page immeaditely
canvas.assetManager.loadTexture(`assets/${page1.name}`, (_, texture) => page1.setTexture(texture));
// load second page after two seconds
setTimeout(() => {
canvas.assetManager.loadTexture(`assets/${page2.name}`, (_, texture) => page2.setTexture(texture));
}, 2000);
}
I've used loadTexture in the loadAssets, but you can use it wherever you want.
If you want to use multiple .atlas files, the idea should be pretty similar. However, the AtlasAttachmentLoader is capable of using a single TextureAtlas. Consequently, you have to write your own.
