)
We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to set the Windows XP like gradient background color in the WinForms XPTaskBar?

Platform: WinForms |
Control: XPTaskbar |
Published Date: April 30, 2011 |
Last Revised Date: February 6, 2020

Gradient background

The XPTaskBarBox allows you to dynamically provide background brushes for the header and items area.

To customize the appearance of the Header:

You can handle the ProvideHeaderBackgroundBrush event in the XPTaskBarBox to customize the appearance of the header. The following code example shows how the gradient background color is applied to the header of the XPTaskBarBox.

C#

//Specifies the appearance of the XPTaskBar.
this.xpTaskBar1.Style = XPTaskBarStyle.Default;
//Draws the header portion of the XPTaskBarBox.
this.xpTaskBarBox1.ProvideHeaderBackgroundBrush += new ProvideBrushEventHandler(xpTaskBarBox1_ProvideHeaderBackgroundBrush);
//Customizes the appearance of the header of the XPTaskBarBox.
void xpTaskBarBox1_ProvideHeaderBackgroundBrush(object sender, ProvideBrushEventArgs args)
{
    // Blends settings.
    float[] relativeIntensities = { 0.0f, 0.0f, 1.0f };
    float[] relativePositions = { 0.0F, 0.5f, 1.0F };
    System.Drawing.Drawing2D.Blend blend = new System.Drawing.Drawing2D.Blend();
    blend.Factors = relativeIntensities;
    blend.Positions = relativePositions;
    XPTaskBarBox box = sender as XPTaskBarBox;
    // Header back brush.
    System.Drawing.Drawing2D.LinearGradientBrush lgBrush = new System.Drawing.Drawing2D.LinearGradientBrush(args.Bounds, Color.LightYellow, Color.SkyBlue, 0, true);
    lgBrush.Blend = blend;
    args.Brush = lgBrush;
}

VB

'Specifies the appearance of the XPTaskBar.
Me.xpTaskBar1.Style = XPTaskBarStyle.Default
'Draws the header portion of the XPTaskBarBox. 
AddHandler xpTaskBarBox1.ProvideHeaderBackgroundBrush, AddressOf xpTaskBarBox1_ProvideHeaderBackgroundBrush
'Customizes the appearance of the header of the XPTaskBarBox.
Private Sub xpTaskBarBox1_ProvideHeaderBackgroundBrush(ByVal sender As Object, ByVal args As ProvideBrushEventArgs)
   'Blend settings.
   Dim relativeIntensities() As Single = { 0.0f, 0.0f, 1.0f }
   Dim relativePositions() As Single = { 0.0F, 0.5f, 1.0F }
   Dim blend As New System.Drawing.Drawing2D.Blend()
   blend.Factors = relativeIntensities
   blend.Positions = relativePositions
   Dim box As XPTaskBarBox = TryCast(sender, XPTaskBarBox)
   'Header back brush.
   Dim lgBrush As New System.Drawing.Drawing2D.LinearGradientBrush(args.Bounds, Color.LightYellow, Color.SkyBlue, 0, True)
   lgBrush.Blend = blend
   args.Brush = lgBrush
End Sub

 

Note:

The appearance of the header background can be customized when the XPTaskBar style is set as Default and it is not applicable to other styles.

Before applying gradient back color to the header and item area

Figure 1: Before applying gradient back color to the header and item area in the XPTaskBarBox

 

After applying gradient back color to the header

Figure 2: After applying the Gradient back color to the header

To customize the appearance of the Item background:

You can similarly handle the ProvideItemsBackgroundBrush event in the XPTaskBarBox to customize the appearance of the item area. The following code example shows how the gradient background color is applied to the item area.

C#

//Draws the item area of the XPTaskBarBox.
this.xpTaskBarBox1.ProvideItemsBackgroundBrush += new ProvideBrushEventHandler(xpTaskBarBox1_ProvideItemsBackgroundBrush);
//Customizes the appearance of the item background in the XPTaskBarBox.
void xpTaskBarBox1_ProvideItemsBackgroundBrush(object sender, ProvideBrushEventArgs args)
{
   // Paint should be applied only when the Height is greater than zero.
   if(args.Bounds.Width != 0 && args.Bounds.Height != 0)
   {
      // Blends settings.
      float[] relativeIntensities = { 0.0f, 0.0f, 1.0f };
      float[] relativePositions = { 0.0F, 0.5f, 1.0F };
      System.Drawing.Drawing2D.Blend blend = new System.Drawing.Drawing2D.Blend();
      blend.Factors = relativeIntensities;
      blend.Positions = relativePositions;
      // Item back brush.
      System.Drawing.Drawing2D.LinearGradientBrush lgBrush = new System.Drawing.Drawing2D.LinearGradientBrush(args.Bounds, Color.CornflowerBlue, Color.Aqua, 0, true);
      lgBrush.Blend = blend;
      args.Brush = lgBrush;
   }
}

VB

'Customizes the appearance of the item background in the XPTaskBarBox.
Private Sub xpTaskBarBox1_ProvideItemsBackgroundBrush(ByVal sender As Object, ByVal args As ProvideBrushEventArgs)
   'Paint should be applied only when the Height is greater than zero.
   If args.Bounds.Width <> 0 AndAlso args.Bounds.Height <> 0 Then
      'Blends settings.
      Dim relativeIntensities() As Single = { 0.0f, 0.0f, 1.0f }
      Dim relativePositions() As Single = { 0.0F, 0.5f, 1.0F }
      Dim blend As New System.Drawing.Drawing2D.Blend()
      blend.Factors = relativeIntensities
      blend.Positions = relativePositions
      'Item back brush.
      Dim lgBrush As New System.Drawing.Drawing2D.LinearGradientBrush(args.Bounds, Color.CornflowerBlue, Color.Aqua, 0, True)
       lgBrush.Blend = blend
       args.Brush = lgBrush
   End If
End Sub

 

Note:

The appearance of the item background can be customized when the XPTaskBar style is set as Default and Metro.

 

Gradient back color is applied to the item area

Figure 3: Gradient back color is applied to the item area

 

Gradient back color is applied to the header and item area

Figure 4: Gradient back color is applied to the header and item area

Samples:

C#: XPTaskBar_GradientBackColor_C#

VB: XPTaskBar_GradientBackColor_VB

2X faster development

The ultimate WinForms UI toolkit to boost your development speed.
ADD COMMENT
You must log in to leave a comment

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Up arrow icon

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon