IBus Theme Tools

Welcome to contribute your translation on Weblate!

中文 Chinese

Python Library Dependency

Pre-knowledge

IBus has its front-end based on GTK, and GNOME replace that front-end with its GJS version to make it more unified with GNOME.

As a result, in non-GNOME Shell desktop environment, the display effect of IBus is determined by the current GTK theme.

$HOME/.config/gtk-3.0/settings.ini defines the current GTK3 theme and font size.

Example of the content of the file is as follows:

[Settings]
gtk-theme-name=Materia-light
gtk-font-name=更纱黑体 SC 12

In the above content, gtk-theme-name specifies that the current GTK theme is material-light, gtk-font-name specifies that the current font is 更纱黑体 SC and the font size is `12 '.

The IBus font and font size can be changed by modifying the above documents.

As for the color scheme of IBus, you can specify that it uses specific GTK theme when IBus starts, and then customize the color matching of IBus.

Installation

You can directly use pip to install:

pip install ibus-theme-tools
ibus-theme-tools

Or just install manually:

git clone https://github.com/openSUSE/IBus-Theme-Tools.git
cd IBus-Theme-Tools && python3 setup.py install
ibus-theme-tools

If you use Arch Linux, you can also use AUR to install as a system extension:

yay -S ibus-theme-tools

Ubuntu PPA

Functionality

Non-GNOME desktop

Generate the IBus GTK theme in a non-GNOME Shell desktop environment and supporting to select a background picture or configure border radius.

Run ibus_theme_tools.py script, operate according to prompted message.

After generating the new theme, just select the theme in the system theme configuration.

If you install themes that support GNOME shell style, you can also choose to extract IBus style, but you can only use it on GNOME desktop.

Customize IBus colors (Create a GTK theme)

Create a GTK3 theme called ibus-custom-theme by running:

mkdir -p $HOME/.themes/ibus-custom-theme/gtk-3.0
$EDITOR $HOME/.themes/ibus-custom-theme/gtk-3.0/gtk.css

then edit the file content. An example can be:

* {
  color: #0b141a; /* Font Color */
  background-color: #ffffff; /* Background Color */
  -gtk-secondary-caret-color: #d4d4d4; /* Highlight Background Color */
}

After that, run the program, then select the theme ibus-custom-theme which you just created.

GNOME desktop

Extracting IBus style from GNOME Shell theme, implement it using CSS parser library tinycss2 in Python. Additional IBus style sheets are generated for users to modify and test.

Run ibus_theme_tools.py script, operate according to prompted message.

When user chooses a theme from the list, this script will first read the theme CSS file, extract the IBus related style classes (.candidate-*), then write it to stylesheet.

Then use the Customize IBus GNOME Shell extension to import and apply themes.

Note: If your IBus style sheet has changed after application, please close and reopen the corresponding custom IME theme to make it effective. Starting from v69, now this extension support stylesheets hot reload, CSS changes will reflect in real-time.

Sample extracted stylesheet: exportedIBusTheme.css

Note

This project was part of the achievement of @HollowMan6 partipating the Google Summer of Code 2021 at OpenSUSE.