Build a Custom End-User Skin Selector

• Nov 16, 2018
• 2 minutes to read

This document explains how to populate a ComboBoxEdit control with DevExpress skin items.

1. To populate a combo box editor, iterate through the SkinManager.Skins collection, which returns all currently available DevExpress skins, and create a new combo box item for each applicable skin – as illustrated in the code below.

   C#

   
   //Uncomment the following line to add bonus and theme skins
   //DevExpress.UserSkins.BonusSkins.Register();
   foreach (SkinContainer cnt in SkinManager.Default.Skins) {
       comboBoxEdit1.Properties.Items.Add(cnt.SkinName);
   }
   

   VB.NET

   
   'Uncomment the following line to add bonus and theme skins
   'DevExpress.UserSkins.BonusSkins.Register()
   For Each cnt As SkinContainer In SkinManager.Default.Skins
       comboBoxEdit1.Properties.Items.Add(cnt.SkinName)
   Next cnt
   

   You can implement more complex logic to skip or rename specific skins. For instance, the following code sample excludes the “Caramel” skin and any “Office 2007…” skin, and renames “DevExpress Style” and “DevExpress Dark Style” skins to ”Default Skin” and ”Default Dark Skin”, respectively.

   C#

   
   DevExpress.UserSkins.BonusSkins.Register();
   foreach (SkinContainer cnt in SkinManager.Default.Skins) {
       if (cnt.SkinName.Contains("Office 2007") || cnt.SkinName == "Caramel")
           continue; 
       if(!cnt.SkinName.Contains("DevExpress"))
           comboBoxEdit1.Properties.Items.Add(cnt.SkinName);
       else switch(cnt.SkinName) {
               case "DevExpress Style":
                   comboBoxEdit1.Properties.Items.Add("Default Skin");
                   break;
               case "DevExpress Dark Style":
                   comboBoxEdit1.Properties.Items.Add("Default Dark Skin");
                   break;
           }
   }
   

   VB.NET

   
   DevExpress.UserSkins.BonusSkins.Register()
   For Each cnt As SkinContainer In SkinManager.Default.Skins
       If cnt.SkinName.Contains("Office 2007") OrElse cnt.SkinName = "Caramel" Then
           Continue For
       End If
       If Not cnt.SkinName.Contains("DevExpress") Then
           comboBoxEdit1.Properties.Items.Add(cnt.SkinName)
       Else
           Select Case cnt.SkinName
               Case "DevExpress Style"
                   comboBoxEdit1.Properties.Items.Add("Default Skin")
               Case "DevExpress Dark Style"
                   comboBoxEdit1.Properties.Items.Add("Default Dark Skin")
           End Select
       End If
   Next cnt
   

2. Handle the ComboBoxEdit.SelectedIndexChanged event to apply a corresponding skin when a user selects a combo box item.

   C#

   
   private void ComboBoxEdit1_SelectedIndexChanged(object sender, EventArgs e) {
       ComboBoxEdit comboBox = sender as ComboBoxEdit;
       string skinName = comboBox.Text;
       switch (skinName) {
           case "Default Skin":
               DevExpress.LookAndFeel.UserLookAndFeel.Default.SkinName = "DevExpress Style";
               break;
           case "Default Dark Skin":
               DevExpress.LookAndFeel.UserLookAndFeel.Default.SkinName = "DevExpress Dark Style";
               break;
           default:
               DevExpress.LookAndFeel.UserLookAndFeel.Default.SkinName = skinName;
               break;
       }
   }
   

   VB.NET

   
   Private Sub ComboBoxEdit1_SelectedIndexChanged(ByVal sender As Object, ByVal e As EventArgs)
       Dim comboBox As ComboBoxEdit = TryCast(sender, ComboBoxEdit)
       Dim skinName As String = comboBox.Text
       Select Case skinName
           Case "Default Skin"
               DevExpress.LookAndFeel.UserLookAndFeel.Default.SkinName = "DevExpress Style"
           Case "Default Dark Skin"
               DevExpress.LookAndFeel.UserLookAndFeel.Default.SkinName = "DevExpress Dark Style"
           Case Else
               DevExpress.LookAndFeel.UserLookAndFeel.Default.SkinName = skinName
       End Select
   End Sub
   

3. Run the application to see the result.