Your own preview icons
How to add custom preview images by using a custom .inkatlas file
Summary
Created by mana vortex Updated July 27. 2023
The guide below will teach you how to make preview icons. While it's a technically a subsection of the ArchiveXL item additions guide, you can use the steps below to make any kind of preview item.
Difficulty Level: You know how to read and can either edit images or make use of the corresponding guide. It's easy!
The required files
If you downloaded the example project (Getting the files), the preview is already hooked up. Otherwise, download the template archive (kindly provided by Apart).
Go away with your examples, I'll do everything by hand!
Okay, you do you. Here's how:
You should now have a structure like this:
tutorial
ops
- my_tshirt_factory.csv
- translation_strings.json
- preview_icons.inkatlas <<<
- preview_icons.xbm <<<
Taking preview pictures
You have two options on taking preview pictures. Both are relatively tedious, since you have to do it by hand. This is not a step-by-step, but you can find a few pointers here:
Blender
You can export your mesh with all its materials to Blender and take your preview pictures there.
In-game
Make sure V isn't on the screenshots with Appearance Menu Mod's
invisible V
toggle, Invisible Character, or the ArchiveXL Invisibility CloakGet an outfit manager like Wardrobe to create outfits where V is wearing nothing but the item
Optional: Use AMM Photo Studio Props for backgrounds — it has black, white, or greenscreen
Fixing up your texture
Export the original .xbm file via Tools -> Export Tool
Find the resulting file under "raw"
Open it in your image editor
Edit it to your heart's content
Overwrite the png file with your edited one. Mind the transparency!
Hooking up the inkatlas
Open the file in WolvenKit.
Open the list
slots
.For the first two
inkTextureSlot
items, set the value forDepotPath
to the relative path of your xbm (tutorial\torso\my_custom_shirt\ops\preview_icons.xbm
):Save the file. If it doesn't update, close and re-open it.
Congratulations! You now have a preview icon!
Using it
You can now hook up your preview icon(s) to whatever mod you are making.
ArchiveXL: Add it to the .yaml
Check the code box below — the last three lines add a preview icon.
Items.my_custom_shirt_redwhite:
$base: Items.GenericInnerChestClothing
entityName: my_custom_shirt_factory_name
appearanceName: appearance_root_entity_white_red
displayName: my_shirt_localization_name_white_red
localizedDescription: my_shirt_localization_desc
quality: Quality.Legendary
appearanceSuffixes: []
icon:
atlasResourcePath: tutorial\torso\my_custom_shirt\ops\preview_icons.inkatlas
atlasPartName: slot_01
Please refer to the ArchiveXL guide for an explanation of the other properties, as this page will only hold information about preview icons.
atlasResourcePath
: relative path to your .inkatlas fileatlasPartName
: slot name in your .inkatlas file (which you can see in thePartsMapping
tab)
Again, please note that indent is crucial here, as it determines the node structure. The first line needs to have an indent of 0, the lines from $base
to icon
need to have two spaces, and the lines atlasResourcePath
and atlasPartName
need to have four.
That's it! Time to test!
If you run into any issues with your texture's transparency, please check the textures import/export guide!
Last updated