How to Create and Load Theme File


See ThemeBuilderForm inside the Demo App.

There are 2 types of Theme File Format that Ribbon can create.
  • INI Files and
  • XML
Example of creating an INI Theme File:

private void GenerateThemeIniFile()
{
    var ct = ((RibbonProfessionalRenderer)ribbon1.Renderer).ColorTable;
    ct.ThemeName = "RedWine";
    ct.ThemeAuthor = "Somebody";
    ct.ThemeAuthorEmail = "somebody@someweb.com";
    ct.ThemeAuthorWebsite = "www.somewebsite";
    ct.ThemeDateCreated = "DateTime.Now()";
    string content = ct.WriteThemeIniFile();
    System.IO.File.WriteAllText("C:\\MyTheme.ini", content);
}

Example of creating a XML Theme File:

private void GenerateThemeXmlFile()
{
    var ct = ((RibbonProfessionalRenderer)ribbon1.Renderer).ColorTable;
    ct.ThemeName = "RedWine";
    ct.ThemeAuthor = "Somebody";
    ct.ThemeAuthorEmail = "somebody@someweb.com";
    ct.ThemeAuthorWebsite = "www.somewebsite";
    ct.ThemeDateCreated = "DateTime.Now()";
    string content = ct.WriteThemeXmlFile();
    System.IO.File.WriteAllText("C:\\MyTheme.xml", content);
}

Example of loading an INI Theme File:

private void LoadThemeIni()
{
    string content = System.IO.File.ReadAllText("C:\\MyTheme.ini");
    Theme.ColorTable.ReadThemeIniFile(content);
    ribbon1.Refresh();
    this.Refresh();
}

Example of loading a XML Theme File:

private void LoadThemeXml()
{
    string content = System.IO.File.ReadAllText("C:\\MyTheme.xml");
    Theme.ColorTable.ReadThemeXmlFile(content);
    ribbon1.Refresh();
    this.Refresh();
}

An Example of an INI Theme File:

[Properties]
ThemeName = SilverBlack
Author = Jose Menendez Poo
AuthorEmail = menendezpoo@gmail.com
AuthorWebsite = http://ribbon.codeplex.com
DateCreated = 2008

[ColorTable]
OrbDropDownDarkBorder = #B1B1B1
OrbDropDownLightBorder = #FFFFFF
OrbDropDownBack = #D4D4D4
OrbDropDownNorthA = #E6E6E6
OrbDropDownNorthB = #E2E2E2
OrbDropDownNorthC = #D9D9D9
OrbDropDownNorthD = #CDCDCD
OrbDropDownSouthC = #CBCBCB
OrbDropDownSouthD = #E1E1E1
OrbDropDownContentbg = #EBEBEB
OrbDropDownContentbglight = #FAFAFA
OrbDropDownSeparatorlight = #F5F5F5
OrbDropDownSeparatordark = #C5C5C5
Caption1 = #ECECEC
Caption2 = #EAEAEA
Caption3 = #E6E6E6
Caption4 = #E8E8E8
Caption5 = #DFDFDF
Caption6 = #F0F0F0
Caption7 = #D2D2D2
QuickAccessBorderDark = #CBCBCB
QuickAccessBorderLight = #F6F6F6
QuickAccessUpper = #ECECEC
QuickAccessLower = #DADADA
OrbOptionBorder = #969696
OrbOptionBackground = #F1F1F1
OrbOptionShine = #E2E2E2
Arrow = #7C7C7C
ArrowLight = #EAF2F9
ArrowDisabled = #7C7C7C
Text = #000000
RibbonBackground = #535353
TabBorder = #BEBEBE
TabNorth = #F1F2F2
TabSouth = #D6D9DF
TabGlow = #D1FBFF
TabText = #FFFFFF
TabActiveText = #000000
TabContentNorth = #B6BCC6
TabContentSouth = #E6F0F1
TabSelectedGlow = #E1D2A5
PanelDarkBorder = #AEB0B4
PanelLightBorder = #E7E9ED
PanelTextBackground = #ABAEAE
PanelTextBackgroundSelected = #949495
PanelText = #FFFFFF
PanelBackgroundSelected = #F3F5F5
PanelOverflowBackground = #B9D1F0
PanelOverflowBackgroundPressed = #AAAEB3
PanelOverflowBackgroundSelectedNorth = #FFFFFF
PanelOverflowBackgroundSelectedSouth = #EBEBEB
ButtonBgOut = #B4B9C2
ButtonBgCenter = #CDD2D8
ButtonBorderOut = #A9B1B8
ButtonBorderIn = #DFE2E6
ButtonGlossyNorth = #DBDFE4
ButtonGlossySouth = #DFE2E8
ButtonDisabledBgOut = #E0E4E8
ButtonDisabledBgCenter = #E8EBEF
ButtonDisabledBorderOut = #C5D1DE
ButtonDisabledBorderIn = #F1F3F5
ButtonDisabledGlossyNorth = #F0F3F6
ButtonDisabledGlossySouth = #EAEDF1
ButtonSelectedBgOut = #FFD646
ButtonSelectedBgCenter = #FFEAAC
ButtonSelectedBorderOut = #C2A978
ButtonSelectedBorderIn = #FFF2C7
ButtonSelectedGlossyNorth = #FFFDDB
ButtonSelectedGlossySouth = #FFE793
ButtonPressedBgOut = #F88F2C
ButtonPressedBgCenter = #FDF1B0
ButtonPressedBorderOut = #8E8165
ButtonPressedBorderIn = #F9C65A
ButtonPressedGlossyNorth = #FDD5A8
ButtonPressedGlossySouth = #FBB062
ButtonCheckedBgOut = #F9AA45
ButtonCheckedBgCenter = #FDEA9D
ButtonCheckedBorderOut = #8E8165
ButtonCheckedBorderIn = #F9C65A
ButtonCheckedGlossyNorth = #F8DBB7
ButtonCheckedGlossySouth = #FED18E
ItemGroupOuterBorder = #ADB7BB
ItemGroupInnerBorder = #FFFFFF
ItemGroupSeparatorLight = #FFFFFF
ItemGroupSeparatorDark = #ADB7BB
ItemGroupBgNorth = #D9E0E1
ItemGroupBgSouth = #EDF0F1
ItemGroupBgGlossy = #D2D9DB
ButtonListBorder = #ACACAC
ButtonListBg = #DAE2E2
ButtonListBgSelected = #F7F7F7
DropDownBg = #FAFAFA
DropDownImageBg = #E9EEEE
DropDownImageSeparator = #C5C5C5
DropDownBorder = #868686
DropDownGripNorth = #FFFFFF
DropDownGripSouth = #DFE9EF
DropDownGripBorder = #DDE7EE
DropDownGripDark = #5574A7
DropDownGripLight = #FFFFFF
SeparatorLight = #E6E8EB
SeparatorDark = #C5C5C5
SeparatorBg = #EBEBEB
SeparatorLine = #C5C5C5
TextBoxUnselectedBg = #E8E8E8
TextBoxBorder = #898989
ToolTipContentNorth = #B6BCC6
ToolTipContentSouth = #E6F0F1
ToolTipDarkBorder = #AEB0B4
ToolTipLightBorder = #E7E9ED

Example of a XML Theme File:

<?xml version="1.0" encoding="utf-16"?>
<RibbonColorTheme>
	<Properties>
		<ThemeName>SilverBlack</ThemeName>
		<Author>Jose Menendez Poo</Author>
		<AuthorEmail>menendezpoo@gmail.com</AuthorEmail>
		<AuthorWebsite>http://ribbon.codeplex.com</AuthorWebsite>
		<DateCreated>2008</DateCreated>
	</Properties>
	<ColorTable>
		<OrbDropDownDarkBorder>#B1B1B1</OrbDropDownDarkBorder>
		<OrbDropDownLightBorder>#FFFFFF</OrbDropDownLightBorder>
		<OrbDropDownBack>#D4D4D4</OrbDropDownBack>
		<OrbDropDownNorthA>#E6E6E6</OrbDropDownNorthA>
		<OrbDropDownNorthB>#E2E2E2</OrbDropDownNorthB>
		<OrbDropDownNorthC>#D9D9D9</OrbDropDownNorthC>
		<OrbDropDownNorthD>#CDCDCD</OrbDropDownNorthD>
		<OrbDropDownSouthC>#CBCBCB</OrbDropDownSouthC>
		<OrbDropDownSouthD>#E1E1E1</OrbDropDownSouthD>
		<OrbDropDownContentbg>#EBEBEB</OrbDropDownContentbg>
		<OrbDropDownContentbglight>#FAFAFA</OrbDropDownContentbglight>
		<OrbDropDownSeparatorlight>#F5F5F5</OrbDropDownSeparatorlight>
		<OrbDropDownSeparatordark>#C5C5C5</OrbDropDownSeparatordark>
		<Caption1>#ECECEC</Caption1>
		<Caption2>#EAEAEA</Caption2>
		<Caption3>#E6E6E6</Caption3>
		<Caption4>#E8E8E8</Caption4>
		<Caption5>#DFDFDF</Caption5>
		<Caption6>#F0F0F0</Caption6>
		<Caption7>#D2D2D2</Caption7>
		<QuickAccessBorderDark>#CBCBCB</QuickAccessBorderDark>
		<QuickAccessBorderLight>#F6F6F6</QuickAccessBorderLight>
		<QuickAccessUpper>#ECECEC</QuickAccessUpper>
		<QuickAccessLower>#DADADA</QuickAccessLower>
		<OrbOptionBorder>#969696</OrbOptionBorder>
		<OrbOptionBackground>#F1F1F1</OrbOptionBackground>
		<OrbOptionShine>#E2E2E2</OrbOptionShine>
		<Arrow>#7C7C7C</Arrow>
		<ArrowLight>#EAF2F9</ArrowLight>
		<ArrowDisabled>#7C7C7C</ArrowDisabled>
		<Text>#000000</Text>
		<RibbonBackground>#535353</RibbonBackground>
		<TabBorder>#BEBEBE</TabBorder>
		<TabNorth>#F1F2F2</TabNorth>
		<TabSouth>#D6D9DF</TabSouth>
		<TabGlow>#D1FBFF</TabGlow>
		<TabText>#FFFFFF</TabText>
		<TabActiveText>#000000</TabActiveText>
		<TabContentNorth>#B6BCC6</TabContentNorth>
		<TabContentSouth>#E6F0F1</TabContentSouth>
		<TabSelectedGlow>#E1D2A5</TabSelectedGlow>
		<PanelDarkBorder>#AEB0B4</PanelDarkBorder>
		<PanelLightBorder>#E7E9ED</PanelLightBorder>
		<PanelTextBackground>#ABAEAE</PanelTextBackground>
		<PanelTextBackgroundSelected>#949495</PanelTextBackgroundSelected>
		<PanelText>#FFFFFF</PanelText>
		<PanelBackgroundSelected>#F3F5F5</PanelBackgroundSelected>
		<PanelOverflowBackground>#B9D1F0</PanelOverflowBackground>
		<PanelOverflowBackgroundPressed>#AAAEB3</PanelOverflowBackgroundPressed>
		<PanelOverflowBackgroundSelectedNorth>#FFFFFF</PanelOverflowBackgroundSelectedNorth>
		<PanelOverflowBackgroundSelectedSouth>#EBEBEB</PanelOverflowBackgroundSelectedSouth>
		<ButtonBgOut>#B4B9C2</ButtonBgOut>
		<ButtonBgCenter>#CDD2D8</ButtonBgCenter>
		<ButtonBorderOut>#A9B1B8</ButtonBorderOut>
		<ButtonBorderIn>#DFE2E6</ButtonBorderIn>
		<ButtonGlossyNorth>#DBDFE4</ButtonGlossyNorth>
		<ButtonGlossySouth>#DFE2E8</ButtonGlossySouth>
		<ButtonDisabledBgOut>#E0E4E8</ButtonDisabledBgOut>
		<ButtonDisabledBgCenter>#E8EBEF</ButtonDisabledBgCenter>
		<ButtonDisabledBorderOut>#C5D1DE</ButtonDisabledBorderOut>
		<ButtonDisabledBorderIn>#F1F3F5</ButtonDisabledBorderIn>
		<ButtonDisabledGlossyNorth>#F0F3F6</ButtonDisabledGlossyNorth>
		<ButtonDisabledGlossySouth>#EAEDF1</ButtonDisabledGlossySouth>
		<ButtonSelectedBgOut>#FFD646</ButtonSelectedBgOut>
		<ButtonSelectedBgCenter>#FFEAAC</ButtonSelectedBgCenter>
		<ButtonSelectedBorderOut>#C2A978</ButtonSelectedBorderOut>
		<ButtonSelectedBorderIn>#FFF2C7</ButtonSelectedBorderIn>
		<ButtonSelectedGlossyNorth>#FFFDDB</ButtonSelectedGlossyNorth>
		<ButtonSelectedGlossySouth>#FFE793</ButtonSelectedGlossySouth>
		<ButtonPressedBgOut>#F88F2C</ButtonPressedBgOut>
		<ButtonPressedBgCenter>#FDF1B0</ButtonPressedBgCenter>
		<ButtonPressedBorderOut>#8E8165</ButtonPressedBorderOut>
		<ButtonPressedBorderIn>#F9C65A</ButtonPressedBorderIn>
		<ButtonPressedGlossyNorth>#FDD5A8</ButtonPressedGlossyNorth>
		<ButtonPressedGlossySouth>#FBB062</ButtonPressedGlossySouth>
		<ButtonCheckedBgOut>#F9AA45</ButtonCheckedBgOut>
		<ButtonCheckedBgCenter>#FDEA9D</ButtonCheckedBgCenter>
		<ButtonCheckedBorderOut>#8E8165</ButtonCheckedBorderOut>
		<ButtonCheckedBorderIn>#F9C65A</ButtonCheckedBorderIn>
		<ButtonCheckedGlossyNorth>#F8DBB7</ButtonCheckedGlossyNorth>
		<ButtonCheckedGlossySouth>#FED18E</ButtonCheckedGlossySouth>
		<ItemGroupOuterBorder>#ADB7BB</ItemGroupOuterBorder>
		<ItemGroupInnerBorder>#FFFFFF</ItemGroupInnerBorder>
		<ItemGroupSeparatorLight>#FFFFFF</ItemGroupSeparatorLight>
		<ItemGroupSeparatorDark>#ADB7BB</ItemGroupSeparatorDark>
		<ItemGroupBgNorth>#D9E0E1</ItemGroupBgNorth>
		<ItemGroupBgSouth>#EDF0F1</ItemGroupBgSouth>
		<ItemGroupBgGlossy>#D2D9DB</ItemGroupBgGlossy>
		<ButtonListBorder>#ACACAC</ButtonListBorder>
		<ButtonListBg>#DAE2E2</ButtonListBg>
		<ButtonListBgSelected>#F7F7F7</ButtonListBgSelected>
		<DropDownBg>#FAFAFA</DropDownBg>
		<DropDownImageBg>#E9EEEE</DropDownImageBg>
		<DropDownImageSeparator>#C5C5C5</DropDownImageSeparator>
		<DropDownBorder>#868686</DropDownBorder>
		<DropDownGripNorth>#FFFFFF</DropDownGripNorth>
		<DropDownGripSouth>#DFE9EF</DropDownGripSouth>
		<DropDownGripBorder>#DDE7EE</DropDownGripBorder>
		<DropDownGripDark>#5574A7</DropDownGripDark>
		<DropDownGripLight>#FFFFFF</DropDownGripLight>
		<SeparatorLight>#E6E8EB</SeparatorLight>
		<SeparatorDark>#C5C5C5</SeparatorDark>
		<SeparatorBg>#EBEBEB</SeparatorBg>
		<SeparatorLine>#C5C5C5</SeparatorLine>
		<TextBoxUnselectedBg>#E8E8E8</TextBoxUnselectedBg>
		<TextBoxBorder>#898989</TextBoxBorder>
		<ToolTipContentNorth>#B6BCC6</ToolTipContentNorth>
		<ToolTipContentSouth>#E6F0F1</ToolTipContentSouth>
		<ToolTipDarkBorder>#AEB0B4</ToolTipDarkBorder>
		<ToolTipLightBorder>#E7E9ED</ToolTipLightBorder>
	</ColorTable>
</RibbonColorTheme>

Besides storing the content of the theme in a text file (ini or xml), it can be stored inside database too.

Last edited Nov 23, 2013 at 11:13 AM by adriancs, version 6

Comments

No comments yet.