Having covered how to use the new Visio 2013 themes in the previous post, I’m now going to consider what’s happening from a shape developers perspective.
In this post, I’ll try and uncover how themes are structured and how they actually get surfaced in individual shapes and in the next post, I’m going to have a look at precisely what happens in the ShapeSheet when you select theme related controls in the UI.
Structure
Themes are basically an easy way of applying groups of properties to a shape in one go. Changes in the shape’s appearance occur because of changes within the shape’s ShapeSheet cells such as FillForegnd and LineColor. The way a particular cell receives its value is dynamic and it’s calculated using the THEMEVAL function. This function works out the appropriate theme property value based on a number of factors, the key ones being:
- the applied theme (or combination of applied components)
- the selected variant
- any locally applied quick styles
- the cell in which it is hosted
In looking for these values Visio examines the shape’s Theme Properties ShapeSheet section, which holds the respective component scheme, variation (color and style) and theme index cells.
Under normal conditions each of these cells will display a value of 65534 and, when they are in this state, Visio looks at the corresponding ShapeSheet section in the containing page, to find their values. In this way, when the user applies a theme to the page in the UI, each shape automatically inherits the page’s theme. (Of course, if you want to design your shape to have a local theme, independent from the page on which it sits, then you can set your own values either within the ShapeSheet or via code.)
The Theme Properties section doesn’t appear to do anything other than hold the respective index values, and it’s only when used in combination with the THEMEVAL function that the theme values are actually carried through to the shape.
Here’s an illustration that demonstrates how other ShapeSheet sections use the THEMEVAL function and look at the shape’s Theme Properties section, which in turn, derives its index values from the same section in the containing page:
So that’s how cells receive their values, but where did all of those THEMEVAL() formulae come from?
The return of [master-based] Styles
Master-based styles, which receded into the background in Visio 2007 (at least as far as the UI is concerned), actually play a key part in gluing the new themes architecture together. Before I go into how that works, here’s a quick overview of how shapes inherit values via styles.
Master-based styles are a way of defining sets of Fill, Line and Text formatting. These values are stored in a special shape that can be seen under the ‘Styles’ folder in the Drawing Explorer. Just as, in the normal course of things, a shape inherits the majority of its ShapeSheet formulae and values from its master, it can also inherit from an applied master-based style. This inheritance can happen either via a master, or directly from a style.
In the above three scenarios, the most common is the middle one where you create a master, which is based on a style. The instance shapes then either receive local values or inherit from their master which, as described, inherits from the style. In fact, styles have a special power that masters do not and that is that they can inherit from each other. At the top of this hierarchy is a style called ‘No style’. Even though ‘No Style’ does not appear in the UI it is the base from which all other styles are descended.
In Visio 2013 there is a new master-based style included in all documents named ‘Theme’ and as you can see from the following screenshot, all of the other styles inherit from this new item:
If you open the ShapeSheet for the ‘Theme’ master-based style you can now see where all those THEMEVAL formulae are defined. It’s for this reason that even if you draw a rectangle shape on the page (ie a shape with no master) it automatically takes part in theming as its master-based style, ‘Normal’, which comes from the document’s default style, inherits from ‘Theme’.
I think this offers an interesting alternative method to toggle in and out of the theming functionality, by including another custom master-based style that inherits directly from ‘No Style’, rather than ‘Theme’, and then toggle between the two types. For example:
If shpIn.Style = "Normal" Then
shpIn.Style = "NoTheme"
Else
shpIn.Style = "Normal"
End If
Maybe that’s something to investigate a little further…
Review
So, to recap – the value of a themed cell is dynamically calculated based on a range of inputs that are taken into consideration by the THEMEVAL function. This function exists in all standard shapes because it is defined in a new master-based style called ‘Theme’ and all other standard master-based styles inherit from ‘Theme’.
Now we’ve uncovered how a shape receives its themed values, in the next post, I’ll look at what values changes in the UI send through to the individual ShapeSheet cells.
