Saturday, July 25, 2009

Creating a dark theme (and exporting and importing Eclipse preferences)

Usually I use my colors with the default settings that Eclipse provides, but I know many people that like alternative appearances for Eclipse (usually using a dark theme), so, I decided to give it a try...

For changing the default colors, there are some places that you have to look through in the window > preferences menu:
  • General > Editors > Text Editors (to set the background color / selection color, etc. for all editors)
  • General > Editors > Text Editors > Annotations (to set the colors for the occurrences highlight, tasks, etc.)
  • Pydev > Editor (to set the pydev editor-related colors)
  • General > Appearance > Colors an Fonts (to set what's not available in the other places)
Now, after you've properly set those colors, one thing you should really do is export the preferences you've just changed so that you can import them later.

To do that, go to File > Export > Preferences and export all the preferences to a file, then, open that file and remove all the non-color related preferences (except the file_export_version, which Eclipse requires when doing the import) -- note that you can keep other preferences you enter all the time too, and it might be easier doing it with a clean Eclipse install just with what you want to config (so that you don't have too many preferences in that preferences file).

Later, you can import those preferences in Eclipse through File > Import > Preferences.

The preferences for the dark theme I'm using gives the result below (note that you may have to restart Eclipse so that the left ruler looks correct):



This can be reproduced by saving the contents below in a 'dark_theme.epf' file (the extension stands for eclipse preferences file) and importing it.


file_export_version=3.0
/instance/org.python.pydev/BACKQUOTES_COLOR=255,255,255
/instance/org.python.pydev/COMMENT_COLOR=153,51,204
/instance/org.python.pydev/CODE_COLOR=255,255,255
/instance/org.python.pydev/NUMBER_COLOR=204,255,51
/instance/org.python.pydev/CLASS_NAME_COLOR=255,204,0
/instance/org.python.pydev/KEYWORD_COLOR=255,102,0
/instance/org.python.pydev/SELF_COLOR=255,255,0
/instance/org.python.pydev/FUNC_NAME_COLOR=255,204,0
/instance/org.eclipse.ui.editors/AbstractTextEditor.Color.SelectionForeground.SystemDefault=false
/instance/org.eclipse.ui.editors/AbstractTextEditor.Color.Background.SystemDefault=false
/instance/org.eclipse.ui.editors/AbstractTextEditor.Color.Background=0,0,0
/instance/org.eclipse.ui.editors/AbstractTextEditor.Color.Foreground.SystemDefault=false
/instance/org.eclipse.ui.editors/AbstractTextEditor.Color.Foreground=255,255,255
/instance/org.eclipse.ui.editors/AbstractTextEditor.Color.SelectionBackground.SystemDefault=false
/instance/org.eclipse.ui.editors/AbstractTextEditor.Color.SelectionBackground=0,0,136
/instance/org.eclipse.ui.editors/pydevOccurrenceIndicationColor=128,64,0
/instance/org.eclipse.ui.editors/lineNumberColor=255,255,255
/instance/org.eclipse.ui.editors/printMargin=true
/instance/org.eclipse.ui.editors/printMarginColor=255,0,0
/instance/org.eclipse.ui.editors/currentLineColor=70,70,70
/instance/org.eclipse.ui.editors/currentIPTextStyle=BOX
/instance/org.eclipse.ui.editors/currentIPIndication=true
/instance/org.eclipse.ui.editors/currentIPHighlight=false
/instance/org.eclipse.ui.editors/secondaryIPTextStyle=DASHED_BOX
/instance/org.eclipse.ui.editors/secondaryIPHighlight=false
/instance/org.eclipse.ui.editors/secondaryIPIndication=true



Update: Added the debug call stack and debug current line annotations to appear as dashed box and box.
at

15 comments:

  1. Unknown1:04 PM

    Thanks for sharing this Fabio.

    In my Eclipse 3.5 the background of the code folding vertical area is still white after applying the .epf file. Is there another line to add to these settings?

    ReplyDelete
  2. Fabio Zadrozny2:37 PM

    Just to confirm, did you restart Eclipse after that? (as I pointed in the blog post, here it has only shown things correctly after I've restarted)

    ReplyDelete
  3. Unknown7:51 PM

    Ah, my bad. I Didn't read your post carefully. After restarting everything works great.

    ReplyDelete
  4. Anonymous1:15 PM

    truly awesome! I was looking for such dark theme long time, thanks for sharing!!! Just one thing bothers me:( its when debugging, highlighted line is too light

    http://img222.imageshack.us/img222/2369/snap1v.png

    I can't seem to find where to adjust it:( can you help me please?
    Alec

    ReplyDelete
  5. Fabio Zadrozny5:42 PM

    Those can be found at the annotations (the blog post has details on getting to those). It's the "Debug Call Stack" and "Debug Current Instruction Pointer" -- I'm going to update the post so that the post so that the theme has those as "Dashed Box" and "Box" (instead of highlighted)

    ReplyDelete
  6. Anonymous4:00 AM

    thank you very much! awesome theme with every day I like it more and more;)

    ReplyDelete
  7. prabir4:28 AM

    check out my dark eclipse theme http://blog.prabir.me/post/Dark-Eclipse-Theme.aspx

    ReplyDelete
  8. bpedman2:41 PM

    nice...i like the theme...just one problem...the highlighting foreground color on my system was black and with the background being dark blue it was impossible to read what I was highlighting...I set the selection foreground color to white and looks great

    ReplyDelete
  9. andro4:41 AM

    i have eclipse 3.5.1...
    i dont have pydev.
    how do i import preferences. I seem to be doing something wrong because this doesnt work for me... :(

    ReplyDelete
  10. Fabio Zadrozny7:50 AM

    If file > import > preferences is not working for you I'm not sure what could be wrong... Asking at the eclipse forum/bugs might yield a better response for that.

    ReplyDelete
  11. Anonymous8:49 AM

    Thank you very much

    ReplyDelete
  12. Anonymous12:34 PM

    As File | Export | Preferences did not work well for me on Eclipse 3.8 and 4.1, here's what I found helpful:

    Code Color Prefs of pydev are in:
    workspace/.metadata/.plugins/org.eclipse.core.runtime/.settings/org.python.pydev.prefs

    Related variables ending on _COLOR -- just go there, edit the file (saving a backuo for any case) and put there your stuff. Missing entries will get default values. My favorite theme is this:

    CODE_COLOR=79,79,79
    DECORATOR_COLOR=127,159,191
    NUMBER_COLOR=63,127,95
    EDITOR_MATCHING_BRACKETS_COLOR=165,42,42
    KEYWORD_COLOR=136,3,91
    SELF_COLOR=10,10,10
    STRING_COLOR=63,95,191
    COMMENT_COLOR=154,154,184
    BACKQUOTES_COLOR=165,42,42
    PARENS_COLOR=127,0,85
    OPERATORS_COLOR=47,47,47

    Have fun!
    Yassen

    ReplyDelete
  13. The 3068 Group9:48 PM

    Hi Fabio,
    In the package explorer some of the filenames and the arrows are too dark to see.
    Do you know where I can change the colours?
    None of the eclipse-color-themes seems to have any impact on the PyDev Package explorer.

    I have uploaded a screenshot here

    https://github.com/guari/eclipse-ui-theme/issues/63

    Regards, Chris

    ReplyDelete
  14. Fabio Zadrozny4:15 AM

    Hi Chris,

    Regarding the package explorer, that's an issue in the moonrise theme (actually, it's an issue on SWT/windows OS which the moonrise theme exposes).

    Eclipse 4.4 (still release candidate) also integrated a dark theme but it has the same issue...

    I think that if you're on windows the only thing that'll work properly is LiClipse: http://brainwy.github.io/liclipse/

    i.e.: in LiClipse besides applying the theme with a new background I create a custom painter to overcome that... see: http://liclipse.blogspot.com.br/2014/05/eclipse-and-dark-theme-shortcomings.html for more details on what LiClipse does that the default themes don't -- and for which I've already reported issues on Eclipse itself.

    ReplyDelete
  15. The 3068 Group5:37 AM

    Thanks Fabio,
    Yes, I am on windows.
    I will have a look at liclipse.
    Regards, Chris

    ReplyDelete