Getting Started with Windows Forms Theme Studio

18 Nov 20184 minutes to read

Theme Studio for WinForms can be used to create and apply a new theme for Syncfusion^® controls from an existing theme. The primary goal here is to deliver appearance-rich Syncfusion^® controls that best suit every user application, based on the application’s needs.

Customizing Theme Color in Theme Studio

In the Theme Studio utility, each theme has a unique common variable list. When the user changes a common variable’s color code value, it will reflect in all the Syncfusion^® WinForms controls. All Syncfusion^® WinForms control styles are derived from these theme-based common variables.

The following steps describe how to launch and work with the Theme Studio utility.

Step 1:

After installing the “Syncfusion^® Windows Forms” suite, launch and select “Theme Studio” from the start-up panel.

Step 2:

The Theme Studio window is divided into two sections: a controls preview on the right and a theme-customization panel on the left.

Step 3:

Click a color picker in the theme-customization section to select a color.

Step 4:

The Syncfusion^® WinForms controls render with the newly selected colors in the preview section.

Export the Customized Theme

You can export the custom theme after changing the theme colors.

Step 1:

Click the Export button in the bottom left corner of the Theme Studio application.

Step 2:

Now the export dialog appears with an option to select either all controls or just the desired control(s). This option is useful when you have integrated a selective list of Syncfusion^® WinForms controls in your application. The Theme Studio will filter only the selected controls and customize the final output for those controls alone, thereby reducing the final output assembly size.

Step 3:

The exported theme is delivered as an assembly (*.dll) file that contains color codes for the selected Syncfusion^® WinForms controls.

Note: You can enter the assembly name of your own choice while exporting. But remember that the assembly (*.dll) name will be the custom theme name, when you refer to it in your WinForms application.

Using the Customized Theme in a Windows Forms Application

You can now add the exported assembly to your Windows Forms application and set the custom theme to the appropriate controls. In the following example, the custom theme is applied to the SfDataGrid control.

Step 1:

Add the exported assembly (*.dll) as a reference in your Windows Forms project (for example, right-click the project in Solution Explorer and choose Add → Reference → Browse, select the exported assembly file).

Note: Close Theme Studio before referencing the exported assembly file to avoid file locking errors.

Step 2:

Load the Theme assembly in Program.cs of your application and the initialize a SfDataGrid control in the main form and set it’s “ThemeName” property exactly to the assembly name.

C#

static class Program
    {
        /// <summary>
        /// The main entry point for the application.
        /// </summary>
        [STAThread]
        static void Main()
        {
            Syncfusion.Licensing.SyncfusionLicenseProvider.RegisterLicense(DemoCommon.FindLicenseKey());
            SkinManager.LoadAssembly(typeof(VioletTheme).Assembly);
            Application.EnableVisualStyles();
            Application.SetCompatibleTextRenderingDefault(false);
            Application.Run(new Form1());
        }
    }

sfDataGrid1.ThemeName = "VioletTheme";

VB.NET

Module Program
    <STAThread>
     Private Sub Main()
        Syncfusion.Licensing.SyncfusionLicenseProvider.RegisterLicense(DemoCommon.FindLicenseKey())
        SkinManager.LoadAssembly(GetType(VioletTheme).Assembly)

        Application.EnableVisualStyles()
        Application.SetCompatibleTextRenderingDefault(False)
        Application.Run(New Form1())
    End Sub
End Module

sfDataGrid1.ThemeName = "VioletTheme"

Step 3:

Compile and run the Windows Forms application and you can now witness the custom theme applied to SfDataGrid control at run-time.