Ceci est une ancienne révision du document !
This month’s Bodhi Corner is written by Stefan (aka @the_waiter).
I will try to introduce my way of theming for Moksha desktop.
First important facts:
• Moksha or E themes are based on edje layer which is a part of EFL widget tool. • It is almost impossible to create a theme from scratch! The theme structure is predefined and strictly related to Moksha or modules code! • Moksha theme covers only Moksha widgets! • Edje theme has nothing to do with GTK or other themes, so applications like Thunar can not be themed with Moksha theme. Thunar is a GTK app so it needs the GTK theme.
Let's get started
The script is saved as an edc file. An EDC (Edje data collection) file is a text file that contains the code describing the position, size, and other parameters of graphical elements that compose the visual aspect of your application. In addition to graphical elements, it can also handle sounds. EDC is a description language where the objects of an interface are described by using a text description. Basic EDC file structure:
color_classes {} styles {} collections {
group { name: "my_group"; parts {} programs {} }
}
OK, enough theory. My workflow now. The best practice of modifying themes is to choose one you like and want to change. The theme is compiled as an edj file and you need to decompile it:
edje_decc theme_name.edj
This command will decompile the whole theme and create a folder with edc files, png or jpg pictures, and sound files. It is great to try to compile theme back if no warnings or errors this way:
Use ./build.sh bash with predefined compiling commands (example: Zentithal theme):
edje_cc $@ -id . -fd . default-dm.edc -o ../MokshaZenithal.edj
This command will build the theme according to the default-dm.edc file where there’s a list of other referenced edc files.
If the compilation process is successful, you need to change the part you need. For example, we can start with the theme background. Look up the background.edc file where the BG picture should be included. If not, you need to grep “e/desktop/background“ group. Once you find the suitable file, look at the picture name that is used as wallpaper. In the case of the Zenithal theme, it is “e_wallpaper.png”. Use another wallpaper picture you like and save as e_wallpaper.png. That's all. Compile the theme and copy the edj file to folder .e/e/themes. Check the result.
In case you need to change windows decorators (borders), look up border.edc file or find e/widgets/border/default/border group in edc files. Change the top part, bottom part, controls, etc, and compile the theme again. This method applies to any widget you want to change. Of course there is much more info about GROUP, PARTS and PROGRAM parts. For example, a part block consists of many other components like RECT, IMAGE, CLIP, TEXTBLOCK, TEXT with their parameters like: visibility, rel adjust, offset, color, min/max limits, align, etc, etc. More info here:
https://docs.tizen.org/application/native/guides/ui/efl/learn-edc-intro/
https://docs.tizen.org/application/native/guides/ui/efl/learn-edc-part/
This was just a brief introduction to Moksha theming. For more info study EDC reference.