Share on twitter
Share on facebook
Share on linkedin
Gradient background support in winforms datagrid

Presenting Colorful Gradient Background for WinForms DataGrid

Syncfusion has provided gradient background support for the WinForms DataGrid for all types of cells for the 2020 Volume 1 release so you can add colorful backgrounds to your DataGrid cells. Gradient colors use a gradual blending of one color to another color to give an eye-catching effect to a cell.

In this article, we are going to look into how to apply gradient backgrounds to cells in your WinForms DataGrid.

Applying a gradient background to a column

You can apply a gradient background to columns using the Column.CellStyle.Interior property. The property type is BrushInfo. It supports the functionalities that provide different custom options to apply gradient background color. You can fill the gradient background with the following different styles:

  • Horizontal: Specifies a gradient from left to right.
  • Vertical: Specifies a gradient from top to bottom.
  • ForwardDiagonal: Specifies a gradient from upper left to lower right.
  • BackwardDiagonal: Specifies a gradient from upper right to lower left.
  • PathRectangle: Specifies a gradient in rectangle shape.
  • PathEllipsis: Specifies a gradient in ellipsis shape.

In the following code example, gradient colors are filled in the horizontal direction.

this.sfDataGrid.Columns[6].CellStyle.Interior = new Syncfusion.WinForms.Core.BrushInfo(GradientStyle.Horizontal, ColorTranslator.FromHtml("#5aff8d"), ColorTranslator.FromHtml("#12cb74")); 

this.sfDataGrid.Columns[7].CellStyle.Interior = new Syncfusion.WinForms.Core.BrushInfo(GradientStyle.Horizontal, ColorTranslator.FromHtml("#FFDF80"), ColorTranslator.FromHtml("#FFA925"));   

this.sfDataGrid.Columns[8].CellStyle.Interior = new Syncfusion.WinForms.Core.BrushInfo(GradientStyle.Horizontal, ColorTranslator.FromHtml("#f77891"), ColorTranslator.FromHtml("#ff5862"));

Gradient background to the column cells

Applying gradient background to the column header

You can apply gradient backgrounds to the column headers using the Column.HeaderStyle.Interior or Style.HeaderStyle.Interior properties. Please refer to the following code example.

this.sfDataGrid.Style.HeaderStyle.Interior = new Syncfusion.WinForms.Core.BrushInfo(GradientStyle.Horizontal, ColorTranslator.FromHtml("#f77891"), ColorTranslator.FromHtml("#ff5862"));

Gradient Background to the column header

Applying gradient background for other cells

The Interior property is available in the styling API of all the cells. See the styling UG documentation to learn more about the APIs used to customize the appearance of the other cells.

Applying pattern style for cells

You can use the PatternStyle property to fill the background colors in the desired pattern formats. We have provided 50+ pattern styles to enhance the user experience.

Please refer to the following example, in which the SmallGrid PatternStyle is applied.

this.sfDataGrid.Style.HeaderStyle.Interior = new Syncfusion.WinForms.Core.BrushInfo(PatternStyle.SmallGrid, ColorTranslator.FromHtml("#5aff8d"), ColorTranslator.FromHtml("#12cb74"));

Pattern style to the column header

Conclusion

I hope you enjoyed this blog and got an idea about how to set gradient backgrounds and pattern styles to the cells of the WinForms DataGrid. These features are available in our 2020 Volume 1 release. You can refer to this UG documentation for more information. Also, you can try out these GitHub examples.

If you aren’t a customer yet, you can try our 30-day free trial to check out these features. Also, try our other samples from this GitHub location.

If you wish to send us feedback or would like to submit any questions, please feel free to contact us through our support forumDirect-Trac, or feedback portal. We are always happy to assist you!

Tags:

Share this post:

Share on twitter
Share on facebook
Share on linkedin

Leave a comment

Popular Now

Be the first to get updates

Subscribe RSS feed
Scroll To Top