[]
↳ CheckBox
• new CheckBox()
Represents a check box cell.
example
//This example creates a check box cell.
var cellType1 = new GC.Spread.Sheets.CellTypes.CheckBox();
cellType1.caption("caption");
cellType1.textTrue("true");
cellType1.textFalse("false");
cellType1.textIndeterminate("indeterminate");
cellType1.textAlign(GC.Spread.Sheets.CellTypes.CheckBoxTextAlign.bottom);
cellType1.isThreeState(true);
cellType1.boxSize(20);
activeSheet.getCell(1, 1).cellType(cellType1);
• typeName: string
Represents the type name string used for supporting serialization.
▸ activateEditor(editorContext, cellStyle, cellRect, context?): void
Activates the editor, including setting properties or attributes for the editor and binding events for the editor.
| Name | Type | Description |
|---|---|---|
editorContext |
HTMLElement |
The DOM element that was created by the createEditorElement method. |
cellStyle |
Style |
The cell's actual style. |
cellRect |
Rect |
The cell's layout information. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
void
▸ boxSize(value?): any
Gets or sets a value that indicates the check box size
example
// This example creates a check box cell.
var cellType1 = new GC.Spread.Sheets.CellTypes.CheckBox();
cellType1.caption("caption");
cellType1.textTrue("true");
cellType1.textFalse("false");
cellType1.textIndeterminate("indeterminate");
cellType1.textAlign(GC.Spread.Sheets.CellTypes.CheckBoxTextAlign.bottom);
cellType1.isThreeState(true);
cellType1.boxSize(20);
activeSheet.getCell(1, 1).cellType(cellType1);
| Name | Type | Description |
|---|---|---|
value? |
string | number |
The size of check box. this value support number and "auto". |
any
If no value is set, returns the size of check box.
▸ caption(value?): any
Gets or sets the caption of the cell type.
example
//This example creates a check box cell.
var cellType1 = new GC.Spread.Sheets.CellTypes.CheckBox();
cellType1.caption("caption");
cellType1.textTrue("true");
cellType1.textFalse("false");
cellType1.textIndeterminate("indeterminate");
cellType1.textAlign(GC.Spread.Sheets.CellTypes.CheckBoxTextAlign.bottom);
cellType1.isThreeState(true);
cellType1.boxSize(20);
activeSheet.getCell(1, 1).cellType(cellType1);
| Name | Type | Description |
|---|---|---|
value? |
string |
The caption of the cell type. |
any
If no value is set, returns the caption; otherwise, returns the check box cell type.
▸ createEditorElement(context?): HTMLElement
Creates a DOM element then returns it.
| Name | Type | Description |
|---|---|---|
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
HTMLElement
Returns a DOM element.
▸ deactivateEditor(editorContext, context?): void
Deactivates the editor, such as unbinding events for editor.
| Name | Type | Description |
|---|---|---|
editorContext |
HTMLElement |
The DOM element that was created by the createEditorElement method. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
void
▸ focus(editorContext, context?): void
Focuses the editor DOM element.
| Name | Type | Description |
|---|---|---|
editorContext |
HTMLElement |
The DOM element that was created by the createEditorElement method. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
void
▸ format(value, format, formattedData?, context?): string
Formats a value with the specified format to a string.
| Name | Type | Description |
|---|---|---|
value |
any |
The object value to format. |
format |
string | GeneralFormatter |
The format. |
formattedData? |
FormattedData |
the formatted data. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
string
Returns the formatted string.
▸ fromJSON(settings): void
Loads the object state from the specified JSON string.
| Name | Type | Description |
|---|---|---|
settings |
any |
The cell type data from deserialization. |
void
▸ getAutoFitHeight(value, text, cellStyle, zoomFactor, context?): number
Gets a cell's height that can be used to handle the row's automatic fit.
| Name | Type | Description |
|---|---|---|
value |
any |
The cell's value. |
text |
string |
The cell's text. |
cellStyle |
Style |
The cell's actual value. |
zoomFactor |
number |
The current sheet's zoom factor. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
number
Returns the cell's height that can be used to handle the row's automatic fit.
▸ getAutoFitWidth(value, text, cellStyle, zoomFactor, context?): number
Gets a cell's width that can be used to handle the column's automatic fit.
| Name | Type | Description |
|---|---|---|
value |
any |
The cell's value. |
text |
string |
The cell's text. |
cellStyle |
Style |
The cell's actual value. |
zoomFactor |
number |
The current sheet's zoom factor. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
number
Returns the cell's width that can be used to handle the column's automatic fit.
▸ getEditorValue(editorContext, context?): any
Gets the editor's value.
| Name | Type | Description |
|---|---|---|
editorContext |
HTMLElement |
The DOM element that was created by the createEditorElement method. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
any
Returns the editor's value.
▸ getHitInfo(x, y, cellStyle, cellRect, context?): IHitTestCellTypeHitInfo
Gets the cell type's hit information.
| Name | Type | Description |
|---|---|---|
x |
number |
x-coordinate of pointer's current location relative to the canvas. |
y |
number |
y-coordinate of pointer's current location relative to the canvas. |
cellStyle |
Style |
The current cell's actual style. |
cellRect |
Rect |
The current cell's layout information. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
Returns an object that contains the x, y, row, col, cellRect, and sheetArea parameters, and a value to indicate isReservedLocation.
isReservedLocation is true if the hit test is in a special area that the cell type needs to handle; otherwise, false.
▸ hitTestMode(value?): CheckBox | CheckBoxHitTestMode
Gets or sets a value that indicates the hit test mode of the checkbox cell type in checkbox and modern mode. This controls which area of the cell will respond to mouse interactions (clicks, cursor changes).
example
// This example creates a check box cell with checkbox mode hit testing.
var cellType1 = new GC.Spread.Sheets.CellTypes.CheckBox();
cellType1.textTrue("Yes");
cellType1.textFalse("No");
cellType1.hitTestMode("checkbox"); // Only the checkbox area responds to clicks
activeSheet.getCell(1, 1).cellType(cellType1);
example
// This example creates a check box cell with cell mode hit testing (default).
var cellType2 = new GC.Spread.Sheets.CellTypes.CheckBox();
cellType2.textTrue("Checked");
cellType2.textFalse("Unchecked");
cellType2.hitTestMode("cell"); // The entire cell area responds to clicks
activeSheet.getCell(2, 1).cellType(cellType2);
| Name | Type | Description |
|---|---|---|
value? |
CheckBoxHitTestMode |
The hit test mode. 'cell' means the entire cell area responds to interactions; 'checkbox' means only the checkbox area responds to interactions. |
CheckBox | CheckBoxHitTestMode
If no value is set, returns the hit test mode of the checkbox cell type; otherwise, returns the checkbox cell type.
▸ isEditingValueChanged(oldValue, newValue, context?): boolean
Whether the editing value has changed.
| Name | Type | Description |
|---|---|---|
oldValue |
any |
Old editing value. |
newValue |
any |
New editing value. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
boolean
true if oldValue equals newValue; otherwise, false.
▸ isImeAware(context?): boolean
Whether this cell type is aware of IME.
| Name | Type | Description |
|---|---|---|
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
boolean
true if the cell type is aware of IME; otherwise, false.
▸ isReservedKey(e, context?): boolean
Whether the cell type handles the keyboard event itself.
| Name | Type | Description |
|---|---|---|
e |
KeyboardEvent |
The KeyboardEvent. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
boolean
Returns true if the cell type handles the keyboard event itself; otherwise, false.
▸ isThreeState(value?): any
Gets or sets a value that indicates whether the check box supports three states.
example
//This example creates a check box cell.
var cellType1 = new GC.Spread.Sheets.CellTypes.CheckBox();
cellType1.caption("caption");
cellType1.textTrue("true");
cellType1.textFalse("false");
cellType1.textIndeterminate("indeterminate");
cellType1.textAlign(GC.Spread.Sheets.CellTypes.CheckBoxTextAlign.bottom);
cellType1.isThreeState(true);
cellType1.boxSize(20);
activeSheet.getCell(1, 1).cellType(cellType1);
| Name | Type | Description |
|---|---|---|
value? |
boolean |
Whether the check box supports three states. |
any
If no value is set, returns whether the check box supports three states; otherwise, returns the check box cell type.
▸ mode(value?): any
Gets or sets a value that indicates the mode of the checkbox cell type.
example
// This example creates a check box cell with toggle mode.
var cellType1 = new GC.Spread.Sheets.CellTypes.CheckBox();
cellType1.caption("caption");
cellType1.textTrue("true");
cellType1.textFalse("false");
cellType1.textAlign(GC.Spread.Sheets.CellTypes.CheckBoxTextAlign.bottom);
cellType1.mode("toggle");
activeSheet.getCell(1, 1).cellType(cellType1);
example
// This example creates a check box cell with modern mode.
var cellType2 = new GC.Spread.Sheets.CellTypes.CheckBox();
cellType2.caption("Modern Checkbox");
cellType2.mode("modern");
activeSheet.getCell(2, 1).cellType(cellType2);
| Name | Type | Description |
|---|---|---|
value? |
CheckBoxMode |
The mode of the checkbox cell type. 'checkbox' is the default classic mode with square borders, 'toggle' is an animated switch button, and 'modern' is a rounded corner style with SVG rendering. |
any
If no value is set, returns the mode of the checkbox cell type.
▸ paint(ctx, value, x, y, w, h, style, context?): void
Paints a cell on the canvas.
| Name | Type | Description |
|---|---|---|
ctx |
CanvasRenderingContext2D |
The canvas's two-dimensional context. |
value |
any |
The cell's value. |
x |
number |
x-coordinate relative to the canvas. |
y |
number |
y-coordinate relative to the canvas. |
w |
number |
The cell's width. |
h |
number |
The cell's height. |
style |
Style |
The cell's actual style. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
void
▸ paintContent(ctx, value, x, y, w, h, style, context?): void
Paints the cell content area on the canvas.
| Name | Type | Description |
|---|---|---|
ctx |
CanvasRenderingContext2D |
The canvas's two-dimensional context. |
value |
any |
The cell's value. |
x |
number |
x-coordinate relative to the canvas. |
y |
number |
y-coordinate relative to the canvas. |
w |
number |
The cell content area's width. |
h |
number |
The cell content area's height. |
style |
Style |
The cell's actual style. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
void
▸ parse(text, formatStr, context?): any
Parses the text with the specified format string to an object.
| Name | Type | Description |
|---|---|---|
text |
string |
The parse text string. |
formatStr |
string |
The parse format string. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
any
The parsed object.
▸ processKeyDown(event, context?): boolean
Processes key down in display mode.
| Name | Type | Description |
|---|---|---|
event |
KeyboardEvent |
The KeyboardEvent. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
boolean
Returns true if the process is successful; otherwise, false.
▸ processKeyUp(event, context?): boolean
Processes key up in display mode.
| Name | Type | Description |
|---|---|---|
event |
KeyboardEvent |
The KeyboardEvent. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
boolean
Returns true if the process is successful; otherwise, false.
▸ processMouseDown(hitInfo): boolean
Processes mouse down in display mode.
| Name | Type | Description |
|---|---|---|
hitInfo |
IHitTestCellTypeHitInfo |
The hit test information returned by the getHitInfo method. See the Remarks for more information. |
boolean
Returns true if the process is successful; otherwise, false.
▸ processMouseEnter(hitInfo): boolean
Processes mouse enter in display mode.
| Name | Type | Description |
|---|---|---|
hitInfo |
IHitTestCellTypeHitInfo |
The hit test information returned by the getHitInfo method. See the Remarks for more information. |
boolean
Returns true if the process is successful; otherwise, false.
▸ processMouseLeave(hitInfo): boolean
Processes mouse leave in display mode.
| Name | Type | Description |
|---|---|---|
hitInfo |
IHitTestCellTypeHitInfo |
The hit test information returned by the getHitInfo method. See the Remarks for more information. |
boolean
Returns true if the process is successful; otherwise, false.
▸ processMouseMove(hitInfo): boolean
Processes mouse move in display mode.
| Name | Type | Description |
|---|---|---|
hitInfo |
IHitTestCellTypeHitInfo |
The hit test information returned by the getHitInfo method. See the Remarks for more information. |
boolean
Returns true if the process is successful; otherwise, false.
▸ processMouseUp(hitInfo): boolean
Processes mouse up in display mode.
| Name | Type | Description |
|---|---|---|
hitInfo |
IHitTestCellTypeHitInfo |
The hit test information returned by the getHitInfo method. See the Remarks for more information. |
boolean
Returns true if the process is successful; otherwise, false.
▸ selectAll(editorContext, context?): void
Selects all the text in the editor DOM element.
| Name | Type | Description |
|---|---|---|
editorContext |
HTMLElement |
The DOM element that was created by the createEditorElement method. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
void
▸ setEditorValue(editorContext, value, context?): void
Sets the editor's value.
| Name | Type | Description |
|---|---|---|
editorContext |
HTMLElement |
The DOM element that was created by the createEditorElement method. |
value |
any |
The value returned from the active cell. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
void
▸ textAlign(value?): any
Gets or sets the text alignment relative to the check box.
example
//This example creates a check box cell.
var cellType1 = new GC.Spread.Sheets.CellTypes.CheckBox();
cellType1.caption("caption");
cellType1.textTrue("true");
cellType1.textFalse("false");
cellType1.textIndeterminate("indeterminate");
cellType1.textAlign(GC.Spread.Sheets.CellTypes.CheckBoxTextAlign.bottom);
cellType1.isThreeState(true);
cellType1.boxSize(20);
activeSheet.getCell(1, 1).cellType(cellType1);
| Name | Type | Description |
|---|---|---|
value? |
CheckBoxTextAlign |
The text alignment relative to the check box. |
any
If no value is set, returns the text alignment relative to the check box; otherwise, returns the check box cell type.
▸ textEditable(value?): boolean | CheckBox
Gets or sets a value that indicates whether the checkbox cell type allows text editing in checkbox and modern mode. When set to false, the checkbox behaves like toggle mode and cannot enter text editing mode (double-click or F2).
example
// This example creates a check box cell with non-editable text.
var cellType1 = new GC.Spread.Sheets.CellTypes.CheckBox();
cellType1.textTrue("Yes");
cellType1.textFalse("No");
cellType1.textEditable(false); // Cannot double-click to edit text
activeSheet.getCell(1, 1).cellType(cellType1);
example
// This example creates a check box cell with editable text (default).
var cellType2 = new GC.Spread.Sheets.CellTypes.CheckBox();
cellType2.textTrue("Checked");
cellType2.textFalse("Unchecked");
cellType2.textEditable(true); // Can double-click to edit text
activeSheet.getCell(2, 1).cellType(cellType2);
| Name | Type | Description |
|---|---|---|
value? |
boolean |
Whether the checkbox text is editable. Default is true. |
boolean | CheckBox
If no value is set, returns whether the checkbox text is editable; otherwise, returns the checkbox cell type.
▸ textFalse(value?): any
Gets or sets the text in the cell when the cell's value is false.
example
//This example creates a check box cell.
var cellType1 = new GC.Spread.Sheets.CellTypes.CheckBox();
cellType1.caption("caption");
cellType1.textTrue("true");
cellType1.textFalse("false");
cellType1.textIndeterminate("indeterminate");
cellType1.textAlign(GC.Spread.Sheets.CellTypes.CheckBoxTextAlign.bottom);
cellType1.isThreeState(true);
cellType1.boxSize(20);
activeSheet.getCell(1, 1).cellType(cellType1);
| Name | Type | Description |
|---|---|---|
value? |
string |
The text in the cell when the cell's value is false. |
any
If no value is set, returns the text in the cell when the cell's value is false. If a value is set, returns the check box cell type.
▸ textIndeterminate(value?): any
Gets or sets the text in the cell when the cell's value is indeterminate (neither true nor false).
example
//This example creates a check box cell.
var cellType1 = new GC.Spread.Sheets.CellTypes.CheckBox();
cellType1.caption("caption");
cellType1.textTrue("true");
cellType1.textFalse("false");
cellType1.textIndeterminate("indeterminate");
cellType1.textAlign(GC.Spread.Sheets.CellTypes.CheckBoxTextAlign.bottom);
cellType1.isThreeState(true);
cellType1.boxSize(20);
activeSheet.getCell(1, 1).cellType(cellType1);
| Name | Type | Description |
|---|---|---|
value? |
string |
The text in the cell when the cell's value is indeterminate. |
any
If no value is set, returns the text in the cell when the cell's value is indeterminate. If a value is set, returns the check box cell type.
▸ textTrue(value?): any
Gets or sets the text in the cell when the cell's value is true.
example
//This example creates a check box cell.
var cellType1 = new GC.Spread.Sheets.CellTypes.CheckBox();
cellType1.caption("caption");
cellType1.textTrue("true");
cellType1.textFalse("false");
cellType1.textIndeterminate("indeterminate");
cellType1.textAlign(GC.Spread.Sheets.CellTypes.CheckBoxTextAlign.bottom);
cellType1.isThreeState(true);
cellType1.boxSize(20);
activeSheet.getCell(1, 1).cellType(cellType1);
| Name | Type | Description |
|---|---|---|
value? |
string |
The text when the cell's value is true. |
any
If no value is set, returns the text when the cell's value is true. If a value is set, returns the check box cell type.
▸ toJSON(): any
Saves the object state to a JSON string.
any
The cell type data.
▸ toggleOptions(value?): any
Gets or sets a value that indicates the toggle options
example
// This example creates a check box cell.
var cellType1 = new GC.Spread.Sheets.CellTypes.CheckBox();
cellType1.caption("caption");
cellType1.textTrue("ON");
cellType1.textFalse("OFF");
cellType1.mode("toggle");
cellType1.textAlign(GC.Spread.Sheets.CellTypes.CheckBoxTextAlign.inside);
cellType1.toggleOptions({
width: 60,
height: 30,
trackColorOn: '#4CAF50',
trackColorOff: '#767577',
sliderColorOn: '#ffffff',
sliderColorOff: '#ffffff',
sliderMargin: 2,
animationDuration: 100,
trackRadius: 8,
sliderRadius: 4
});
activeSheet.getCell(1, 1).cellType(cellType1);
| Name | Type | Description |
|---|---|---|
value? |
IToggleOptions |
The toggle options. |
any
If no value is set, returns the toggle options.
▸ updateEditor(editorContext, cellStyle, cellRect, context?): Rect
Updates the editor's size.
| Name | Type | Description |
|---|---|---|
editorContext |
HTMLElement |
The DOM element that was created by the createEditorElement method. |
cellStyle |
Style |
The cell's actual style. |
cellRect |
Rect |
The cell's layout information. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
Returns the new size for cell wrapper element, it should contain two properties 'width' and 'height'.
▸ updateEditorContainer(editorContext, editorBounds, cellStyle): void
Updates the cell wrapper element size.
| Name | Type | Description |
|---|---|---|
editorContext |
HTMLElement |
The DOM element that was created by the createEditorElement method. |
editorBounds |
Rect |
The cell wrapper element's new size. |
cellStyle |
Style |
The cell's actual style. |
void
▸ updateImeMode(editorContext, imeMode, context?): void
Updates the editor's ime-mode.
| Name | Type | Description |
|---|---|---|
editorContext |
HTMLElement |
The DOM element that was created by the createEditorElement method. |
imeMode |
ImeMode |
The ime-mode from cell's actual style. |
context? |
any |
The context associated with the cell type. See the Remarks for more information. |
void