Textures and UI

Three tools work together on the interface. Textures shows and edits the pictures, UI Image Sets edits which box of a picture is which icon, and UI Windows edits where those icons and texts sit in a window. If you have not opened a client yet, do First steps first.

How the pieces fit:

• A texture is a .dds picture in resource/texture. One texture often holds many icons.
• xml/uiimageset.xml lists image sets (one texture each) and the named images (boxes) on it. An icon is called Set#Image.
• A window is an XML file in xml/. It refers to images as set#image.

You want to	Use
Repaint or recolour a picture	Textures, then IOP Manager
Move or resize the box of an icon	UI Image Sets, then IOP Manager
Move a button or text in a window	UI Windows, then IOP Manager

1. Find a texture

1. Click Textures under 3D. The list shows the textures of your game folder (the footer reads Game folder: <name>): one row per name, the copy the client would load, with its type tag, name and size. Scrambled .dds and .lsc textures open too.
2. Type in Search. The list loads 300 rows at a time while you scroll.
3. Click a name. The picture opens with its size. 1:1 shows actual size, the fit button fits it to the view; wheel zooms, middle or right drag (or Space) moves.

To learn which pack and folder a texture is in, search its name in IOP Manager (for example ui_icon_event1.dds). You need the path later. A mesh shows its texture names in the Mesh card of Models, and missing there means the texture is not in the packs.

To read pictures from a folder on your PC, use Other folder…. Open file… opens a single picture; you can also drop it on the view.

2. Find an icon

1. Start from the icon name. Find an item shows it under the item’s name as Set#Image.
2. Click UI Image Sets under Interface. With your game folder open, xml/uiimageset.xml opens by itself and its textures come from the packs.
3. Type the set name in Search imagesets and click the set. The texture shows with every box outlined (All boxes). The Imageset card has its Name and its Texture, the file name of the picture it is cut from. Open that file in Textures.
4. In the Images card use Search images and click the image. Selected image shows its X, Y, Width, Height, OffsetX and OffsetY and the picture at real size.
5. To take just that icon out as a picture, open the Save menu and choose Export this image as PNG….

3. Find a window

1. Click UI Windows under Interface. Search window files filters the file names; double-click a file in the list (xml/…wnd.xml) to open it.
2. Choose the game screen size (800×600 up to 1920×1080) for windows that align to the screen, and the button state to show: Normal, Over, Push or Disable.
3. The toggles show or hide images, texts, Bounds (window outlines) and Hidden (windows that start hidden). Preview draws the window the way the game does, without outlines and without hidden windows.
4. The Windows card on the right is the tree of windows. Click one in the view or in the tree and its elements and attributes appear below, and every one of them can be edited. An image reference there is a set#image; look it up in UI Image Sets.

4. Change a picture

Textures edits the picture and writes a new .dds.

1. Open the texture. Choose what to change with Magic wand (the area of similar colour), Colour range (every pixel of that colour), Lasso or Rectangle. Shift adds to the selection, Alt takes away. Tolerance, Close gaps and Feather fine-tune it; All, None, Invert, Grow and Shrink change the whole selection. With nothing selected, a recolour changes the whole picture.
2. In Recolour, Colourise gives the selection a new colour and keeps its light and dark (Colour, Strength, Brightness, Contrast; the dropper takes a colour from the picture). Hue / Sat / Light shifts the existing colours.
3. Click Apply to keep it or Cancel to drop the preview. Undo and redo are next to them.
4. To paint something new in your own editor, use Save as… and choose PNG, edit the PNG outside the browser, then open it again with Open file….

Then set Save as .dds:

• Format: Auto (DXT1, and DXT5 when there is transparency), DXT1, DXT3, DXT5 or A8R8G8B8 (uncompressed, four times bigger). A .dds you opened keeps its own format and its mip maps when you save it again.
• Size: leave Keep. The tool rounds sizes to powers of two and tells you when it resizes. Image set boxes use pixel positions on the texture, so a texture with another size breaks every box on it.
• Mip maps: keep them on like the game’s own textures.
• In skin textures, transparent black (DXT1) or alpha 0 is where the game shows the skin colour (#MODEL_COLOR). Do not paint over it.

Click Save .dds. The browser downloads <name>.dds. If you opened a .dds, the tool asks “Replace files?” first; nothing in your client is replaced by this, only your download. For the rest of the visit the list opens your edited copy of that texture.

Convert folder to .dds… converts every .png, .jpg, .tga and .bmp of a folder you opened with Other folder…, using the same format settings; untick the files you do not want. Each result is a separate download, so the browser may ask to allow several downloads.

5. Change an image set or a window

UI Image Sets:

• Click a box to select it. Drag it to move, drag its handles to resize, use the arrow keys to nudge it (Shift moves ten times as far), Delete removes it. Or type numbers into the image fields.
• Draw turns on drawing: drag on the texture to add a new image. The Imageset and Image buttons add, the copy button duplicates, the bin deletes (with a confirmation for a whole set).
• Names take letters, digits and _ only, an image name must be unique in its set, and Texture must be a plain file name.
• Windows refer to images as set#image, so renaming a box breaks every window that uses it. Check with UI Windows.
• Undo and redo are in the top bar.

UI Windows: click selects, drag moves, handles resize, arrow keys nudge (Shift ×10), Del removes a child window, and undo and redo are in the top bar. Korean text is shown decoded and written back as CP949.

Open the Save menu of either tool. Use Save as file…, which downloads the XML (uiimageset.xml or the window file). The entries Save into the pack and Save into rs.iop are there, but the web version answers “Saving into packs is not available yet.”

A dot next to the title shows unsaved changes. Close the tab and they are gone.

6. Put the result into the pack

You now have a .dds or an .xml as a download. Put it into the pack with IOP Manager, as in Extract and replace a file:

1. In IOP Manager, search the name of the entry (the texture name, uiimageset.xml or the window file). Note the pack and the folder. A texture is normally in map.iop under resource/texture; the XML files are normally in rs.iop under xml/.
2. Select the entry and click Replace…. Pick your file. The entry keeps its name, so the pack ends up with the name the game looks for.
3. Check Pack info: Changes must read what you expect. Click Verify.
4. Download pack and put it into a client copy: game closed, backup of the original pack kept, same file name.
5. Start the client and look at the changed screen.

If the same path is also in another pack, change the pack where you found the entry and test it in the client.

What stays on your PC

The tools give you a download and you put it into the client yourself. Nothing is uploaded, and nothing is written into your game folder.

Things to know

• Textures writes a plain .dds. A texture that was stored scrambled, or as .lsc, opens in Textures but saves as <name>.dds. Whether the client accepts a plain .dds in its place: not confirmed yet.
• Edit the uiimageset.xml of your own client. The sets and boxes differ between clients.
• Several windows may use one image. Preview the windows that matter after you change a box.