Look And Feel and Skinning

• Oct 29, 2020
• 3 minutes to read

DevExpress XtraBars controls and components support Look And Feel and Skinning technologies, which enable you to provide a common appearance for controls throughout an entire application and within individual forms.

Change Application Scope Look And Feel Settings

Do one of the following to customize the global look-and-feel settings for all DevExpress Windows Forms controls (including XtraBars controls):

• At design time, you can customize these settings from the Project Settings Page (starting with version 18.1).

• Place the DefaultLookAndFeel component onto the main form and modify the DefaultLookAndFeel.LookAndFeel object’s settings. Use the static UserLookAndFeel.Default property to access these settings in code.

  The following code applies the “Bezier” vector skin with an “Office White” palette.

  C#

  DevExpress.LookAndFeel.UserLookAndFeel.Default.SetSkinStyle("The Bezier", "Office White");
  

  VB.NET

  DevExpress.LookAndFeel.UserLookAndFeel.Default.SetSkinStyle("The Bezier", "Office White")
  

• To customize the look-and-feel settings for only XtraBars controls, place the DefaultBarAndDockingController component onto the main form and modify the DefaultBarAndDockingController.Controller.LookAndFeel property’s settings. In code, you can access these settings from the static BarAndDockingController.Default property.

  The following code applies the “Money Twins” skin using the default BarAndDockingController.

  C#

  using DevExpress.XtraBars
  
  BarAndDockingController defCont = BarAndDockingController.Default;
  defCont.LookAndFeel.Style = DevExpress.LookAndFeel.LookAndFeelStyle.Skin;
  defCont.LookAndFeel.SkinName = "Money Twins";
  

  VB.NET

  Imports DevExpress.XtraBars
  
  Dim defCont As BarAndDockingController = BarAndDockingController.Default
  defCont.LookAndFeel.Style = DevExpress.LookAndFeel.LookAndFeelStyle.Skin
  defCont.LookAndFeel.SkinName = "Money Twins"
  

Change Form Scope Look And Feel Settings

To provide shared look-and-feel settings for an individual form’s controls/components, you can do one of the following:

• When using a skinnable form (XtraForm and its descendants - RibbonForm, TabForm, FluentDesignForm, etc.), change the form’s look-and-feel settings via the XtraForm.LookAndFeel property.

  Starting from version 18.1, the XtraBars controls/components placed onto a skinnable form take into account the form’s look-and-feel settings, provided that it does not contain a BarAndDockingController instance. You can prohibit this behavior via the WindowsFormsSettings.DefaultSettingsCompatibilityMode static setting. See Version Compatibility: Default Property Values to learn more.

  The code below applies the “Office 2016 Colorful” skin to an XtraForm.

  C#

  public partial class Form1 : DevExpress.XtraEditors.XtraForm {
      //...
      private void Form1_Load(object sender, EventArgs e) {
          this.LookAndFeel.UseDefaultLookAndFeel = false;
          this.LookAndFeel.Style = DevExpress.LookAndFeel.LookAndFeelStyle.Skin;
          this.LookAndFeel.SkinName = "Office 2016 Colorful";
      }
  }
  

  VB.NET

  Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
      Me.LookAndFeel.UseDefaultLookAndFeel = False
      Me.LookAndFeel.Style = DevExpress.LookAndFeel.LookAndFeelStyle.Skin
      Me.LookAndFeel.SkinName = "Office 2016 Colorful"
  End Sub
  

• To customize the look-and-feel settings for only XtraBars controls, place a BarAndDockingController component onto the form and customize its look-and-feel settings (BarAndDockingController.LookAndFeel).

  Ensure that the XtraBars control’s (or component’s) Controller properties refer to the BarAndDockingController (for the DocumentManager, use the DocumentManager.BarAndDockingController property).

  Tip

  When you place a BarAndDockingController object onto a form for the first time, it automatically locates and binds to XtraBars controls/components within the form (BarManager, DockManager, Ribbon Control, etc.).