Spread ASP.NET 6.0 Product Documentation
Creating and Applying a Custom Style for Cells
Send Feedback
Spread ASP.NET 6.0 Product Documentation > Developer's Guide > Customizing the Appearance > Customizing the Appearance of a Cell > Creating and Applying a Custom Style for Cells

Glossary Item Box

You can quickly customize the appearance of a cell or range of cells (or rows or columns) by applying a style, which is a set of appearance settings defined in a single StyleInfo object. You can create your own style and save it to use again, similar to a template. The style includes appearance settings that apply to cells, such as background color, text color, font, borders, and cell type. For more information, refer to the StyleInfo object in the Assembly Reference.

Note: The word "appearance" is used to refer to the general look and feel of the cell, not the Appearance class, which is used for the appearance of several parts of the interface.

A cell style includes the following appearance settings:

You can specify the style for a cell by setting the StyleName property for the Cell object.

A style can be applied to any number of cells. Just as a skin can be applied to a sheet, so a style can be applied to cells. You typically set the style for the cell by using the StyleName property to define which StyleInfo object is used by that cell. When you set the style (StyleName), you set the entire StyleInfo object in the style model for each cell in the range to the one in the NamedStyleCollection with the specified name.

You can also use the ParentStyleName property to set a style for a range of cells that may individually have different StyleName values set but which all inherit a common set of appearance settings from a parent style. A cell inherits all the style information from the parent style (ParentStyleName). When you set the parent style, you are setting the Parent property of the StyleInfo object assigned to each cell in the range. The parent for a named style can also be set by the Parent property of the NamedStyle object. So different cells (cells in different rows or columns) may have different named styles but have the same parent style. For example, the cells may have different text colors (set in the named style) but inherit the same background color (set in the parent style). The default parent style is set in the DataAreaDefault field in the DefaultStyleCollection class. For more information on the order of inheritance, refer to Object Parentage.

You can also create and apply appearance settings to an entire sheet by using sheet skins. For instructions on creating sheet skins, see Creating a Skin for Sheets.

Return to the cell appearance overview at Customizing the Appearance of a Cell.

Using the Property Window

  1. In the Form window, click the FpSpread component for which you want to create the style in the NamedStyleCollection. For the FpSpread component, in the Appearance category, select the NamedStyles property.
  2. Click on the button to launch the NamedStyleCollection Editor.
  3. In the NamedStyleCollection Editor, click the Add button.
  4. Set the properties in the Named Style Properties list to create the style you want.
  5. Set the Name property to specify the name for your custom style.
  6. Click OK to close the editor.
  7. Select the cells (or rows or columns) to apply the style to.
  8. In the property window, set the StyleName to the custom named style previously added.

Using Code

  1. Create the style using the NamedStyle object constructor and set the style properties.
  2. Add the styles.
  3. Set the StyleName property to assign the style to the cells.

Example

This example code creates several styles and sets a parent style. This causes the cells to display the same background color but, different text colors.

C# Copy Code 
\\ Create a style with a blue background color.
FarPoint.Web.Spread.NamedStyle backstyle = new FarPoint.Web.Spread.NamedStyle("BlueBack");
backstyle.BackColor = Color.Blue;
\\ Create a style with an orange text color and assign it a parent style.
FarPoint.Web.Spread.NamedStyle text1style = new FarPoint.Web.Spread.NamedStyle("OrangeText", "BlueBack");
text1style.ForeColor = Color.Orange;
\\ Create a style with a yellow text color and assign it a parent style.
FarPoint.Web.Spread.NamedStyle text2style = new FarPoint.Web.Spread.NamedStyle("YellowText", "BlueBack");
text2style.ForeColor = Color.Yellow;
FpSpread1.NamedStyles.Add(backstyle);
FpSpread1.NamedStyles.Add(text1style);
FpSpread1.NamedStyles.Add(text2style);
FpSpread1.ActiveSheetView.Cells[0,0,2,0].StyleName = "OrangeText";
FpSpread1.ActiveSheetView.Cells[0,1,2,1].StyleName = "YellowText";
VB Copy Code 
' Create a style with a blue background color.
Dim backstyle As New FarPoint.Web.Spread.NamedStyle("BlueBack")
backstyle.BackColor = Color.Blue
' Create a style with an orange text color and assign it a parent style.
Dim text1style As New FarPoint.Web.Spread.NamedStyle("OrangeText", "BlueBack")
text1style.ForeColor = Color.Orange
' Create a style with a yellow text color and assign it a parent style.
Dim text2style As New FarPoint.Web.Spread.NamedStyle("YellowText", "BlueBack")
text2style.ForeColor = Color.Yellow
FpSpread1.NamedStyles.Add(backstyle)
FpSpread1.NamedStyles.Add(text1style)
FpSpread1.NamedStyles.Add(text2style)
FpSpread1.ActiveSheetView.Cells(0,0,2,0).StyleName = "OrangeText"
fpSpread1.ActiveSheetView.Cells(0,1,2,1).StyleName = "YellowText"

Using the Spread Designer

  1. Select the Settings menu.
  2. Select the Named Style icon under the Appearance Settings section.
  3. Use the New style icon to create a new style and use the Edit style icon to set properties for the style.
  4. Select Apply and OK.
  5. Select the cell or cells and set the StyleName property.
  6. From the File menu choose Apply and Exit to apply your changes to the component and exit Spread Designer.
© 2002-2012 GrapeCity, Inc. All Rights Reserved.