Getting started

Getting started with Omega Theme Maker

Summary

• Interface basics
  • Color editor
  • Toolbar
  • Simulator canvas
  • History console
  • Other useful things
• Making your own theme
  • About the JSON file

Interface basics

The main view is divided into two main parts :

• The color editor
• The side panel, which includes :
  • The toolbar
  • The simulator canvas
  • The history console

Color editor

The color editor is itself divided into two tabs :

• The visual color editor
• The JSON editor

The visual color editor is pretty simple to use, enter your theme's name, and also the icon's folder name (or path), then you can edit your colors :
Simply select the color you want with the color picker next to the color name to change its value.
There are also three useful buttons next to it :

• Copy: Copy the color value into your clipboard
• Paste: Paste your clipboard content into the color value
• Reset: Clicking on this will reset the color value to its original state
  (Note: Importing a new theme will change the original state to the new one)

Toolbar

The toolbar has 5 buttons :

• Run: Run the simulator
• Import: Import a new JSON theme
• Save: Save the current theme as a JSON file, ready to be used at compilation
• Screenshot: Take a screenshot of the canvas
  (Filename format: screenshot-YYYYMMDD-HHMNSC.png)
• Fullscreen: Make the canvas larger (Not available with mobile version)

Simulator canvas

The simulator is pretty much the same as the official one, simply click on it to control the calculator. Shortcuts are the same as usual :

• Shift : ⇧
• Capslock : ⇪
• Toolbox : Tab
• Varbox : ⌥ + V

History console

(Not available with mobile version)
Here you can a history of your actions and also error logs, which comes in handy when creating a custom theme.

Other useful things

• Menubar :
  • File menu: Open, save and close.
• Touch Bar (MacBook Pro) :
  • Open, save, run, fullscreen, and screenshot. There's also a cool color picker.

Making your own theme

Before Omega Theme Maker, you had to edit your theme JSON to modify it, but now simply use the color pickers, then run the simulator!

About the JSON file

The JSON file is organized as such :

.
├── name # Your theme's name. (the filename will be generated based on this)
├── icons # Icons folder name or path.
├── version # Specify your theme JSON version, do not touch if you don't need to.
└── colors # Colors
    ├── # Your colors (Format: RRGGBB)
    └── ...

When compilating

A python script will take the selected JSON theme and convert it to a C++ header, replacing Escher's palette with the new one.
Your colors will be converted as such :

constexpr static KDColor ColorGroupSubColorName = KDColor::RGB24(0xRRGGBB);

For example, the Toolbar Text color with a value of #ff00ff will be :

constexpr static KDColor ToolbarText = KDColor::RGB24(0xff00ff);