WinForms Button

To add a WinForms Button to your application, you need to drag a new instance of the vButton Control from the Visual Studio Toolbox and drop it into your Winforms application's form. Some of the frequently used properties such as TextAlign, ImageAlign and TextImageRelation allow you to easily change the layout of the Button's Text and Image. The VIBlend Button Control comes with 25 built-in Themes. It supports the new Metro Blue, Green and Orange themes and the popular Office Themes including the themes from Microsoft Office 2003, Office 2007 and Office 2010. You can easily change the winforms button theme. What you need to do is to just set the VIBlendTheme property and the winforms button will automatically change its visual appearance. Sometimes, users want to customize theme settings such as backcolor or forecolor. In this post, we will create a custom Theme using the VIBlend Controls APIs and will apply it to the WinForms Button control.

• Define the theme colors. The colors array defines the default state colors, the highlightcolors array define the colors used when the mouse is over the button. The pressedcolors array defines colors used when the winforms button is pressed.

  C#

  C#

  Color[] colors = new Color[]{Color.FromArgb(255,39,94,176),
  Color.FromArgb(255, 37, 92, 175), Color.FromArgb(255,51,105,206),
  
  Color.FromArgb(255,53,135,226)};
  Color[] highlightColors = new Color[]{Color.FromArgb(255,59,114,196),
  Color.FromArgb(255, 57, 112, 185), Color.FromArgb(255,71,125,226),
  Color.FromArgb(255,73,155,246)};
  Color[] pressedColors = new Color[]{Color.FromArgb(255,79,134,216),
  Color.FromArgb(255, 77, 132, 215), Color.FromArgb(255,91,145,246),
  Color.FromArgb(255,93,175,255)};

  VB .NET

  VB.NET

  Dim colors() As Color = {Color.FromArgb(255,39,94,176), _
      Color.FromArgb(255, 37, 92, 175), Color.FromArgb(255,51,105,206), _
      Color.FromArgb(255,53,135,226)}
  Dim highlightColors() As Color = {Color.FromArgb(255,59,114,196), _
      Color.FromArgb(255, 57, 112, 185), Color.FromArgb(255,71,125,226), _
      Color.FromArgb(255,73,155,246)}
  Dim pressedColors() As Color = {Color.FromArgb(255,79,134,216), _
      Color.FromArgb(255, 77, 132, 215), Color.FromArgb(255,91,145,246), _
      Color.FromArgb(255,93,175,255)}

• Define the default, highlight and pressed states. The following code illustrates how to create the styles for the winforms button states. The 90 number is for the gradient angle. This means that the button's gradient will be vertical. The 0.7f and 0.9f define the offset between each gradient color starting from 0 to 1. You can think about this as: 0f - first color, 0.7f - second color, 0.9f third color and 1.0f fourth gradient color.

  C#

  C#

  FillStyleGradientEx normalStyle = new FillStyleGradientEx
      (colors[0], colors[1], colors[2], colors[3], 90, 0.7f, 0.9f);
  FillStyleGradientEx highlightStyle = new FillStyleGradientEx(highlightColors[0], 
      highlightColors[1],highlightColors[2], highlightColors[3], 90, 0.7f, 0.9f);
  FillStyleGradientEx pressedStyle = new FillStyleGradientEx(pressedColors[0], 
      pressedColors[1],pressedColors[2], pressedColors[3], 90, 0.7f, 0.9f);
  Color borderColor = Color.FromArgb(31, 72, 161);

  VB.NET

  VB.NET

  Dim normalStyle As New FillStyleGradientEx(colors(0), colors(1), _
      colors(2), colors(3), 90, 0.7f, 0.9f)
  Dim highlightStyle As New FillStyleGradientEx(highlightColors(0), _
      highlightColors(1), highlightColors(2), highlightColors(3), 90, 0.7f, 0.9f)
  Dim pressedStyle As New FillStyleGradientEx(pressedColors(0), _
      pressedColors(1), pressedColors(2), pressedColors(3), 90, 0.7f, 0.9f)
  Dim borderColor As Color = Color.FromArgb(31, 72, 161)

• Create a ControlTheme instance and initialize its StyleNormal, StyleHighlight and StylePressed properties. The FillStyle member defines the background, BorderColor defines the border's color and TextColor defines the displayed text's color.

  C#

  C#

  ControlTheme theme = ControlTheme.GetDefaultTheme
              (VIBLEND_THEME.OFFICEBLUE).CreateCopy();
  theme.StyleNormal.FillStyle = normalStyle;
  theme.StyleNormal.BorderColor = borderColor;
  theme.StyleNormal.TextColor = Color.White;
  theme.StyleHighlight.FillStyle = highlightStyle;
  theme.StyleHighlight.BorderColor = borderColor;
  theme.StyleHighlight.TextColor = Color.White;
  theme.StylePressed.FillStyle = pressedStyle;
  theme.StylePressed.BorderColor = borderColor;
  theme.StylePressed.TextColor = Color.White;

  VB.NET

  VB.NET

  Dim theme As ControlTheme = ControlTheme.GetDefaultTheme_
      (VIBLEND_THEME.OFFICEBLUE).CreateCopy()
  theme.StyleNormal.FillStyle = normalStyle
  theme.StyleNormal.BorderColor = borderColor
  theme.StyleNormal.TextColor = Color.White
  theme.StyleHighlight.FillStyle = highlightStyle
  theme.StyleHighlight.BorderColor = borderColor
  theme.StyleHighlight.TextColor = Color.White
  theme.StylePressed.FillStyle = pressedStyle
  theme.StylePressed.BorderColor = borderColor
  theme.StylePressed.TextColor = Color.White

• The final step is to set the button's Theme property to point to the ControlTheme instance.

  C#

  C#

  this.vButton1.StyleKey = "ButtonNewStyle";<br />
  this.vButton1.Theme = theme;

  VB.NET

  VB.NET

  Me.vButton1.StyleKey = "ButtonNewStyle"<br />
  Me.vButton1.Theme = theme

CodeProject