Toolkit Pro - Ribbon colors customization -- How?

Print Page | Close Window

Ribbon colors customization -- How?

Printed From: Codejock Forums
Category: Codejock Products
Forum Name: Toolkit Pro
Forum Description: Topics Related to Codejock Toolkit Pro
URL: http://forum.codejock.com/forum_posts.asp?TID=17254
Printed Date: 20 June 2025 at 5:36am
Software Version: Web Wiz Forums 12.04 - http://www.webwizforums.com

Topic: Ribbon colors customization -- How?

Posted By: wssdev
Subject: Ribbon colors customization -- How?
Date Posted: 16 September 2010 at 3:40am

First off, I did not want to hijack this thread https://forum.codejock.com/forum_posts.asp?TID=17238 - https://forum.codejock.com/forum_posts.asp?TID=17238 , as my question will be a bit more precise.

I'm trying to build my own custom ribbon theme. As an exercise, I took Office2007Blue theme as a starting point. Even without documentation, the customization seemed to be fairly straightforward: all that was needed was to modify a number of .png images and a .ini file... Or at least I thought so. :)

There is a number of images in the 'res' folder that have 'Ribbon' in their names, so these were naturally the ones that I've modified first, changing the blue color to be slightly darker (see the picture below).

After I modified all those images, there were still some parts of the ribbon that simply refused to be displayed in my own colors.

First, I have created the Update button (on the picture below) like this:

CXTPRibbonGroup* groupApplications = tab->AddGroup(ID_RIBBONGROUP_APPLICATIONS);
groupApplications->SetControlsGrouping(TRUE);
...
CXTPControl* ctrlUpdate = groupApplications->Add(xtpControlButton, ID_UPDATE);
ctrlUpdate->SetBeginGroup(TRUE);
ctrlUpdate->SetStyle(xtpButtonIconAndCaption);
// set 16x16 icon...

It seems that the background of my button still has a color that comes from some part of the original Office2007Blue theme, some part that I did not modify. But which one?

I did change every single 'Ribbon'xxx.png image and even some other images (like, for example, PushButton.png), but none of them corresponds to that part of the ribbon. I also went and changed virtually all RGB values in the corresponding .ini file, but none of them affects this background.

[Edit: please ignore, this turned out to be the issue with our images.]
Another issue is the bottom part of the group frame. It appears that RibbonGroupCaption.png is the image that corresponds to that part of the ribbon. I don't have this light frame color anywhere in my customized image, and yet it somehow shows up at runtime.

It seems that the embedded theme images do not get displayed as-is, but instead some additional transformation gets applied to them at run-time.

Questions:

- where/what are the colors/images responsible for drawing the button ~~and the border frame~~ shown above?

More generally,

- is there a document that describes the customization process?
    - what images go where on the ribbon?
    - which colors from the .ini file affect ribbon (apart from those from the [Ribbon] section)?
    - what color transformations get applied at runtime?

Thanks in advance!