Font preview setup

To make the text preview look more correct in the editor, copy this font file:

into this folder:

AoE2DE UI Layout Editor – Quick Start

This app is for editing AoE2DE widgetui JSON files visually instead of by hand.

Basic mode

Basic mode is meant for direct file editing.

Use it when you want to open UI files, make changes, save them back, and see those changes update in-game right away.

Basic workflow

1. Import JSON
   Load one or more UI JSON files. The widget tree appears on the left. The layout appears in the center canvas.
2. Find and edit an item
   • Click it in the canvas, or find it in the widget tree on the left
   • Move it by dragging
   • Resize it with the selection handles
   • Change anchor/scale point
   • Edit layout values in the property panel on the right
   • Middle mouse drag = pan
   • Zoom controls / mouse wheel = zoom
   • Fit canvas = frame the layout
3. Export or save
   Write the edited files back out. Use them directly in your game files or test setup.

Advanced mode

Advanced mode is meant more for full mod loading and editing.

Use it when you want to work on a whole mod setup instead of just directly editing a few files. It also includes more advanced tools and features that are not needed for simple live file editing.

Advanced workflow

1. Load the base game and mod
   • Open the app
   • Switch to Advanced mode
   • Use Load Base Game
   • Use Import Mod
2. Navigate
   • Show or hide images, text, and boxes
   • Load a background image
3. Edit the mod
   • Use the normal basic editing features
   • Group items together
   • Copy images to the mod folder for manual editing
   • Edit text size, color, and alignment
4. Export the mod
   Use Export Mod. Export it to the general AoE2DE mod folder.
5. Copy and test
   • Manually copy the exported mod to your local mods folder
   • Reboot the game so the mod loads correctly
   • Test the result in-game

Good habits

• make small changes
• test in-game often
• when exporting a mod, the app automatically increases the mod number by 1 and then immediately loads that newly exported mod again, so you can continue working on the latest version
• if something behaves strangely, keep in mind that the game has its own behavior limits, so the editor cannot preview every case perfectly