Using solidBrush: Addressable Colors

Usually for your UI you will have a color scheme which uses the same colors in different places. You can normally just set up a style element which everything inherits, like this:

<style id="lightBG" fill="#ADADAD"/>
<style id="myLightButton" inherits="#lightBG"/>
<style id="lightPanel" inherits="#lightBG" flex="1" padding="5"/>

but this doesn't work so well if you're using the same color across different style types, like fills, strokes and textColors. What you end up with is the color being used all over your style file:

<style id="myLightButton" fill="#ADADAD"/>
<style id="myTextButton" textColor="#ADADAD"/>
<style id="myPanel" fill="#FF0000" stroke="#ADADAD"/>

To do that, you can use a solidBrush:

<solidBrush id="lightColor" fill="#ADADAD"/>
<solidBrush id="darkColor" fill="#505050"/>
<style id="myLightButton" fill="url(#lightColor)"/>
<style id="myTextButton" textColor="url(#lightColor)"/>
<style id="myPanel" fill="#FF0000" stroke="url(#lightColor)"/>
<linearGradientBrush id="solidBrushGradient">
<rotateTransform center="50% 50%" angle="90"/>
<gradientStops>
<gradientStop color="url(#lightColor)" offset="0%"/>
<gradientStop color="url(#darkColor)" offset="100%"/>
</gradientStops>
</linearGradientBrush>
<style id="myGradientPanel" fill="url(#solidBrushGradient)"/>

This also lets you store all of our colors in a single place so colors can be updated more easily as well.