Spread Windows Forms 6.0 Product Documentation
Setting a Button Cell
Support Options
Spread Windows Forms 6.0 Product Documentation > Developer's Guide > Customizing Interaction with Cell Types > Working with Graphical Cell Types > Setting a Button Cell

Glossary Item Box

You can display a button in a cell using the button cell. A button cell, by default displays a rectangular button with a default color; you can customize the text, color, and an image for that button as well as specify certain aspects of its behavior when clicked.

Showing Button States

To create a cell that acts like a button, use the ButtonCellType class and the settings that are summarized here. You can create a button cell using the examples shown in this topic or in the topics for the individual members of the ButtonCellType class.

Customizing the Button Appearance

Button cells can display text, pictures, or both. If they display pictures, you can choose that a different picture is displayed when the button is pressed. You can customize the colors in button cells, including the color of the border, text, and background. In addition, button cells can display a three-dimensional appearance, and you can customize the colors of the highlight and shadow in the appearance. These are the properties that relate to the overall appearance of the button cell.

Property

Description

BackgroundStyle

Set how the background is rendered.

ButtonColor

Set the color of the button.

ButtonColor2

Set the secondary color used when drawing a gradient button.

DarkColor

Set the color at the bottom and right edges of the button (that give it the three-dimensional look along with the light color).

GradientMode

Set the drawing style of a gradient button.

LightColor

Set the color at the top and left edges of the button (that give it the three-dimensional look along with the dark color).

Picture

Set an image to completely determine the appearance of the button. Any GDI+ bitmap can be used, such as BMP, GIF, or JPG file. If you are using a two-state button, this serves as the unpressed state.

PictureDown

Set an image for the pressed state of the button.

ShadowSize

Set the thickness of the shadow, the dark and light colors (that give it the three-dimensional look).

TwoState

Set whether the button functions as a toggle switch with two states. Each time you click the button, the button changes state.

Button parts labeled on button

By default, the button has a single state, and changes its appearance only as long as you have the pointer pressed. You may set the button to be a two-state button and then the button toggles between those two states when clicked. The button is clicked when the user clicks anywhere in that cell. By default, button cells behave like push buttons, which you can press by pressing your left mouse button, and which do not stay pressed when you release your mouse button. If you prefer, button cells can act like toggle, or two-state, buttons, which stay pressed when you click them using your left mouse button. Buttons are false when they are not pressed, and true when they are pressed.

Customizing the Text Appearance

You can specify the text that is displayed in the button cell and you can specify the appearance of that text. You can specify the alignment of text alongside pictures in button cells as well as whether to wrap text to multiple lines.

These are the properties that relate to the text that is displayed in the button cell.

Property

Description

HotkeyPrefix

Set whether to display the underline that indicates the shortcut key (or hot key).

Button hotkey prefix example

Text

Set the text that appears in the button.

TextAlign

Set the alignment of the text with respect to a picture

TextColor

Set the color of the text in the button.

TextDown

Set the text of the button when it is pressed down, if it is a two-state button.

TextOrientation

Set the orientation of the text in the button. See the next table that shows examples of the various orientations.

WordWrap

Set whether to wrap the text to multiple lines.

Here are the results of different settings of the TextOrientation property.

Text Orientation

Example Button

Text Orientation

Example Button

Text Horizontal

button text horizontal orientation

Text Horizontal Flipped

button text horizontal flipped orientation

Text Vertical

button text vertical orientation

Text Vertical Flipped

button text vertical flipped orientation

Text TopDown

button text top-down orientation

Text TopDown RTL

button text top-down RTL orientation

Text RotateCustom

Custom specified rotation

Beyond the properties of the button cell itself, you can also set a property in the FpSpread class that affects how buttons behave. The FpSpread class has a ButtonDrawMode property for button cells and combo box cells. This property allows you to always show a button, or show buttons in the current column, row, or cell.

See Also

Note that some graphical elements in certain cell types are affected by XP themes (visual styles). Setting the VisualStyles property of the Spread component to "off" can allow visual customizations of those graphical cell types to work as expected. For more information, refer to Using XP Themes with the Component.

For more information on the properties and methods of this cell type, refer to the ButtonCellType class.

For more information on the corresponding event when a user clicks on the button, refer to the FpSpread.ButtonClicked event.

For more information on other graphical cell types, refer to Working with Graphical Cell Types.

Using the Properties Window

  1. At design time, in the Properties window, select the Spread component.
  2. Select the Sheets property.
  3. Click the button to display the SheetView Collection Editor.
  4. In the Members list, select the sheet in which the cells appear.
  5. In the property list, select the Cells property and then click the button to display the Cell, Column, and Row Editor.
  6. Select the cells for which you want to set the cell type.
  7. In the property list, select the CellType property and choose the Button cell type.
  8. Expand the list of properties under the CellType property. Select and set these specific properties as needed.
  9. Click OK to close the Cell, Column, and Row Editor.
  10. Click OK to close the SheetView Collection Editor.

Using Code

  1. Define the button cell by creating an instance of the ButtonCellType class.
  2. Specify the properties of the button by setting the properties of that instance, such as Text, TwoState, and ButtonColor.
  3. Assign the button cell type to a cell or range of cells by setting the CellType property for a cell, column, row, or style to the ButtonCellType object.

Example

In this example, create a button with text in a blue colored button. Define the text to be different when the pointer is held down. This is the example button shown in the first part of this topic.

C# Copy Code
FarPoint.Win.Spread.CellType.ButtonCellType bttncell = new FarPoint.Win.Spread.CellType.ButtonCellType();
 
bttncell.ButtonColor = Color.Cyan;
 
bttncell.DarkColor = Color.DarkCyan;
 
bttncell.LightColor = Color.AliceBlue;
 
bttncell.TwoState = false;
 
bttncell.Text = "Click and Hold";
 
bttncell.TextDown = "...now let go.";
 
bttncell.ShadowSize = 3;
 
fpSpread1.Sheets[0].Cells[0,2].CellType = bttncell;
 
VB Copy Code
Dim bttncell As New FarPoint.Win.Spread.CellType.ButtonCellType()
 
bttncell.ButtonColor = Color.Cyan
 
bttncell.DarkColor = Color.DarkCyan
 
bttncell.LightColor = Color.AliceBlue
 
bttncell.TwoState = False
 
bttncell.Text = "Click and Hold"
 
bttncell.TextDown = "...now let go."
 
bttncell.ShadowSize = 3
 
FpSpread1.Sheets(0).Cells(0,2).CellType = bttncell
 

Using the Spread Designer

  1. Select the cell or cells in the work area.
  2. In the property list, in the Misc category, select CellType. From the drop-down list, choose the Button cell type. Now expand the CellType property and various properties are available that are specific to this cell type. Select and set those properties as needed.

    Or right-click on the cell or cells and select Cell Type. From the list, select Button. In the CellType editor, set the properties you need. Click Apply.

  3. From the File menu choose Apply and Exit to apply your changes to the component and exit Spread Designer.
© 2002-2012 ComponentOne, a division of GrapeCity. All Rights Reserved.