Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Question on customizing IntelliJ theme through properties file #824

Open
SiboVG opened this issue Mar 19, 2024 · 5 comments
Open

Question on customizing IntelliJ theme through properties file #824

SiboVG opened this issue Mar 19, 2024 · 5 comments

Comments

@SiboVG
Copy link

SiboVG commented Mar 19, 2024

Hello,

I'm trying to customize my IntelliJ OneDark theme (com.formdev.flatlaf.intellijthemes.FlatOneDarkIJTheme) through a properties file, but it doesn't seem to work.

I have added 3 properties files in the a resources/themes directory:

  1. FlatLaf.properties to apply general theme changes
  2. FlatDarculaLaf.properties to apply changes to another dark theme of my application
  3. FlatOneDarkIJTheme.properties to apply changes to the IntelliJ OneDark theme

I noticed that changes to FlatOneDarkIJTheme.properties have no effect on my OneDark theme. I did notice that changing something in FlatDarculaLaf.properties affects the OneDark theme (maybe because OneDark extends that theme?).


Here's how I initialize my theme:

FlatLaf.registerCustomDefaultsSource("themes");

FlatOneDarkIJTheme.setup();

Here's some content from FlatDarculaLaf.properties:

Tree.hash = #FF0000

Here's content from FlatOneDarkIJTheme.properties:

Tree.hash = #00FF00

Which results in a red tree hash, even though it should be green...
image


Is it even possible to customize the FlatOneDarkIJTheme because it is a 3rd party plugin? I also noted that in the Theme Editor, the theme preview also remains the standard light theme instead of it switching to the OneDark theme, but maybe that's because only the core themes are supported in the Theme Editor?

Thanks for any help!

@DevCharly
Copy link
Collaborator

DevCharly commented Mar 29, 2024

The problem is that the IntelliJ themes work differently than the core themes:

  1. First the properties files of the base core theme are processed (either FlatIntelliJLaf or FlatDarculaLaf depending on whether IntelliJ themes is light or dark).
  2. IntelliJTheme$ThemeLaf.properties is processed.
  3. the IntelliJ theme .json file is loaded and the colors are applied to the UIDefaults table produced by the previous steps.

There is no processing of IntelliJ theme-specific property files.
This is the reason why the Theme Editor does not support IntelliJ themes.

I've tried to change the above processing by converting the JSON theme files to FlatLaf properties, but this causes some problems. This would allow customizing IntelliJ themes and probably also usage in Theme Editor preview. Maybe I'll continue work on this task in the future...

Currently, you could use a IntelliJTheme$ThemeLaf.properties file (since FlatLaf 3.4.1) to customize IntelliJ themes.
(for FlatLaf 3.4 and older use ThemeLaf.properties)

You need to prefix each property with the theme name. E.g.:

[One_Dark]Tree.paintLines = true
[One_Dark]Tree.hash = #00FF00

There is a IntelliJTheme$ThemeLaf.properties in core, which is used to fix issues in IntelliJ JSON themes:
https://github.com/JFormDesigner/FlatLaf/blob/main/flatlaf-core/src/main/resources/com/formdev/flatlaf/IntelliJTheme%24ThemeLaf.properties

DevCharly added a commit that referenced this issue Mar 29, 2024
…Theme$ThemeLaf.properties` instead of `ThemeLaf.properties`)

(see issue #824)
@SiboVG
Copy link
Author

SiboVG commented Apr 3, 2024

The problem is that the IntelliJ themes work differently than the core themes:

  1. First the properties files of the base core theme are processed (either FlatIntelliJLaf or FlatDarculaLaf depending on whether IntelliJ themes is light or dark).
  2. IntelliJTheme$ThemeLaf.properties is processed.
  3. the IntelliJ theme .json file is loaded and the colors are applied to the UIDefaults table produced by the previous steps.

There is no processing of IntelliJ theme-specific property files. This is the reason why the Theme Editor does not support IntelliJ themes.

I've tried to change the above processing by converting the JSON theme files to FlatLaf properties, but this causes some problems. This would allow customizing IntelliJ themes and probably also usage in Theme Editor preview. Maybe I'll continue work on this task in the future...

Currently, you could use a IntelliJTheme$ThemeLaf.properties file (since FlatLaf 3.4.1) to customize IntelliJ themes. (for FlatLaf 3.4 and older use ThemeLaf.properties)

You need to prefix each property with the theme name. E.g.:

[One_Dark]Tree.paintLines = true
[One_Dark]Tree.hash = #00FF00

There is a IntelliJTheme$ThemeLaf.properties in core, which is used to fix issues in IntelliJ JSON themes: https://github.com/JFormDesigner/FlatLaf/blob/main/flatlaf-core/src/main/resources/com/formdev/flatlaf/IntelliJTheme%24ThemeLaf.properties

Thanks a lot for the reply and the update in 3.4.1!

@cleancoda
Copy link

cleancoda commented May 21, 2024

The problem is that the IntelliJ themes work differently than the core themes:

1. First the properties files of the base core theme are processed (either `FlatIntelliJLaf` or `FlatDarculaLaf` depending on whether IntelliJ themes is light or dark).

2. `IntelliJTheme$ThemeLaf.properties` is processed.

3. the IntelliJ theme `.json` file is loaded and the colors are applied to the `UIDefaults` table produced by the previous steps.

There is no processing of IntelliJ theme-specific property files. This is the reason why the Theme Editor does not support IntelliJ themes.

I've tried to change the above processing by converting the JSON theme files to FlatLaf properties, but this causes some problems. This would allow customizing IntelliJ themes and probably also usage in Theme Editor preview. Maybe I'll continue work on this task in the future...

Currently, you could use a IntelliJTheme$ThemeLaf.properties file (since FlatLaf 3.4.1) to customize IntelliJ themes. (for FlatLaf 3.4 and older use ThemeLaf.properties)

You need to prefix each property with the theme name. E.g.:

[One_Dark]Tree.paintLines = true
[One_Dark]Tree.hash = #00FF00

There is a IntelliJTheme$ThemeLaf.properties in core, which is used to fix issues in IntelliJ JSON themes: https://github.com/JFormDesigner/FlatLaf/blob/main/flatlaf-core/src/main/resources/com/formdev/flatlaf/IntelliJTheme%24ThemeLaf.properties

Greetings!

I have a question related to this issue I hope.

I am trying to use as a theme from the theme-pack - specifically: Dracula com.formdev.flatlaf.intellijthemes.FlatDraculaIJTheme as seen here: https://github.com/JFormDesigner/FlatLaf/blob/main/flatlaf-intellij-themes/README.md

I have a similar challenge I believe, I have the properties file labeled as IntelliJTheme$ThemeLaf.properties per your instructions above, and added the name of the theme to each key inside the properties file like so:

[FlatDraculaIJTheme]Button.arc = 9999
[FlatDraculaIJTheme]Panel.background = #7469B6

however the properties file doesn't load.

I am using 3.4.1, here's my POM:

<dependency>
      <groupId>com.formdev</groupId>
      <artifactId>flatlaf</artifactId>
      <version>3.4.1</version>
    </dependency>
    <dependency>
      <groupId>com.formdev</groupId>
      <artifactId>flatlaf-intellij-themes</artifactId>
      <version>3.4.1</version>
    </dependency>
    <dependency>
      <groupId>com.formdev</groupId>
      <artifactId>flatlaf-extras</artifactId>
      <version>3.4.1</version>
    </dependency>

I confirmed the properties file loads if I use either of the main themes:

  • FlatLaf Light (class com.formdev.flatlaf.FlatLightLaf)
  • FlatLaf Dark (class com.formdev.flatlaf.FlatDarkLaf)

just not for the intellij type themes like the one I have in my example - FlatDraculaIJTheme.

Any suggestions would be greatly appreciated.

Hope you have a wonderful day!

Thank you for all your efforts and hard-work, keep it up!! :)

@DevCharly
Copy link
Collaborator

@cleancoda following should work:

[Dracula---Zihan_Ma]Button.arc = 9999
[Dracula---Zihan_Ma]Panel.background = #7469B6

The key prefix (enclosed in []) is the value of the name attribute in the theme JSON file:

Optionally the author attribute can be included in the prefix, which is necessary for Dracula because there is another Dracula theme in the "Metal UI" themes:

Here is the code that builds the supported prefixes:

String currentThemePrefix = '[' + name.replace( ' ', '_' ) + ']';
String currentThemeAndAuthorPrefix = '[' + name.replace( ' ', '_' ) + "---" + author.replace( ' ', '_' ) + ']';
String currentAuthorPrefix = "[author-" + author.replace( ' ', '_' ) + ']';
String allThemesPrefix = "[*]";

@cleancoda
Copy link

@cleancoda following should work:

[Dracula---Zihan_Ma]Button.arc = 9999
[Dracula---Zihan_Ma]Panel.background = #7469B6

The key prefix (enclosed in []) is the value of the name attribute in the theme JSON file:

Optionally the author attribute can be included in the prefix, which is necessary for Dracula because there is another Dracula theme in the "Metal UI" themes:

Here is the code that builds the supported prefixes:

String currentThemePrefix = '[' + name.replace( ' ', '_' ) + ']';
String currentThemeAndAuthorPrefix = '[' + name.replace( ' ', '_' ) + "---" + author.replace( ' ', '_' ) + ']';
String currentAuthorPrefix = "[author-" + author.replace( ' ', '_' ) + ']';
String allThemesPrefix = "[*]";

SUCCESS!! That worked beautifully! Thank you so much for such a quick response!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants