Change icons for a new Cabbage theme

[mauro]

Hi Rory, as you know, I like experimenting with Csound using Cabbage as its preferential IDE.
So, I’m trying to make a Cabbage theme that will make development more pleasant on my eyes.

My target is:

COLOURS SCHEME:

• pleasant pastel-like colours with the right amount of contrast and saturation (no excessive light/dark contrasts, no oversaturated colours);
• syntax highlighting should make a clear and nice distinction between keywords, identifiers, strings, numbers and comments;
• following latest trends, the overall look should be dark oriented but not too dark… Something like Ableton or Reaper default colour scheme;

Toolbar ICONS:

• the actual icons for the various options in the toolbar to me looks too blurred (maybe because they are too much detailed for their size). Cabbage is a light application that doesn’t use too many resources of your computer, so I would like its icons to reflect that: simple and linear icons with very few colours, designed to give a more architectural look.

Now, about the colours, I can change them in the Cabbage settings, and I made this look that I like very much:

But now how I can change the toolbar icons?

I noticed that there are some svg in the “Icons” dir on github and I tried to modify them in my local copy, but when I compile Cabbage, it will always use its original icons. How can I make so that Cabbage uses my icons instead of the current ones?

[rorywalsh]

I’m happy that you are trying to make it look better! I usually bundle binary versions of the PNGs into the application so one doesn’t need to concern themselves about including SVGs or PNGs. But you should be able to test with local files if you modify the CabbageToolbarFacory.h file. You’ll see in there how the images are loaded. It should be easy enough to swap them out. If it looks good we can add them to the build.

[rorywalsh]

Btw, I’m just about done with updating the graph. I see no more odd behaviour on my Windows machine and everything appears to be working just as it did before, only without the odd crash. This updated code relies almost entirely on the JUCE audio plugin host example code, so future updates to JUCE should be far easier to incorporate, and should present less of a headache.

One idea come to mind while doing this. It wouldn’t be that tricky to launch the audio graph in a separate process, and let it host Csound instead of the Cabbage host IDE. Communication to the Cabbage host could be made over some kind of of interprocess connection. So we would pipe Csound messages from plugins to the Cabbage host from the graph, and updating the graph from the Cabbage host. Everything less would stay as it is. The upside being that a crash in Csound would not pull down the entire host, just the graph, which would be launched the next time a user saves the file. We could even add an auto-save function so any complex graphs would automatically be reloaded after a crash.

[mauro]

[quote=“rorywalsh, post:3, topic:1248”]
Btw, I’m just about done with updating the graph. I see no more odd behaviour on my Windows machine and everything appears to be working just as it did before, only without the odd crash.
[/quote]Nice!

[quote=“rorywalsh, post:3, topic:1248”]
One idea come to mind while doing this. It wouldn’t be that tricky to launch the audio graph in a separate process, and let it host Csound instead of the Cabbage host IDE.
[/quote]It could be a good choice from a stability point of view, but I think if you implement this, you should make an option to let the user choice what he want:

1. one process that does all (faster, but unsafe for unstable plugins);
2. separated processes (slower, but much more stable… Very good during the development of a plugin).

[rorywalsh]

I don’t think I would bother with it unless it’s just as fast. It won’t happen soon, that’s for sure, but it could be an option.

[mauro]

After much work using Inkscape and Visual Studio, I managed to get this working:

In addition to the SVG icons (for which I made a new method to get a string from an SVG file), I changed the FileTab look&feel to make a flat style (more consistent with the new icons style).
Unfortunately all the colours used for the FileBar background, the FileTab button and related sub-buttons (and drawings inside them) are “hard-coded”, so the user cannot change them without modding the source code.

And being that the svg icons aren’t bundled with the Cabbage installation, for now the code points to a local path on my machine where are stored the new icons… It could be nice to have Cabbage installation make a directory in the program folder where are stored the svg icons, so that the application could point to them and the user could change these files if he want a customized look.

[rorywalsh]

This looks nice I feel/hope a pull request might be eminent? It would be easy to load these images from a resource file in the Cabbage directory. I can add that change if you wish?

[mauro]

I’ve spent a lot of hours working on it, so I’m glad you like it.

[quote=“rorywalsh, post:7, topic:1248”]
It would be easy to load these images from a resource file in the Cabbage directory. I can add that change if you wish?
[/quote]What should I write in the code as the path for the SVG icons (to make them work when you install Cabbage from the installer)? For now I replaced the relevant icons in my local “Icons” dir inside the Cabbage project dir, and then I made the functions load the SVGs from this local dir, but I don’t know what happens when Cabbage is installed from the regular installer. In my Windows machine, the Cabbage folder inside Program Files doesn’t have “Resources” nor “Icons” folder inside it…

I feel/hope a pull request might be eminent?

I worked on a local copy of Cabbage before your latest mods, so now I don’t know how to proceed… Maybe it’s better to syncronize my github master fork with yours (via github web), then redownload all the project in a different dir on my local PC, reapply all the mods on the syncronized local fork and check that all works before making a pull request… Anyway I will try it when I come back home.

P.S.: you updated the master branch for the audiograph mods?

[rorywalsh]

It might be best that you check out the dev branch and work from there. The audio graph has been updated. And all of your latest changes are there, as far as I can tell. If you make a PR with your changes to load local files, I will add the required magic required to load the resources from a folder in the Cabbage dir. I can also add a custom path in the settings for people who want to use their own icons.

Unfortunately all the colours used for the FileBar background, the FileTab button and related sub-buttons (and drawings inside them) are “hard-coded”, so the user cannot change them without modding the source code.

I’m also happy to use icons here too. I think I was more interested in learning how to paint components directly in JUCE at this point of the project. But I know how to do that now, so I’m happy to go back to using icons

I can also add a way to set those colours in the Cabbage colour settings. That should give users a fairly good platform for creating new themes.

[mauro]

[quote=“rorywalsh, post:9, topic:1248”]
I can also add a custom path in the settings for people who want to use their own icons.
[/quote]That would be cool for theme customization. I can make a “light background” version of my new SVG icons, so that the user can select them in combination with a light colour theme, if he doesn’t like dark themes.

I’m also happy to use icons here too. I think I was more interested in learning how to paint components directly in JUCE at this point of the project. But I know how to do that now, so I’m happy to go back to using icons

Yes, I agree. They should be replaced by SVG icons (for now they are still hard-coded).

[quote=“rorywalsh, post:9, topic:1248”]
I can also add a way to set those colours in the Cabbage colour settings. That should give users a fairly good platform for creating new themes.
[/quote]It would be very nice. Thanks to the simplicity of the flat style you should add only the following colour identifiers:

• fileBarBackground (the background colour of the bar under the fileTab buttons and under the Play sub-button);

• fileTabBackground (the background colour of each fileTab);

• fileTabText (the colour for the text inside the tab);

P.S.: I noticed that for some strange reason the colour of the menubar text doesn’t change when you change it in the Cabbage settings…