[]
        
(Showing Draft Content)

GC.Spread.Sheets.Style

Class: Style

Spread.Sheets.Style

Table of contents

Constructors

Properties

Methods

Constructors

constructor

new Style(backColor?, foreColor?, hAlign?, vAlign?, font?, themeFont?, formatter?, borderLeft?, borderTop?, borderRight?, borderBottom?, locked?, textIndent?, wordWrap?, showEllipsis?, shrinkToFit?, backgroundImage?, cellType?, backgroundImageLayout?, tabStop?, textDecoration?, imeMode?, name?, parentName?, watermark?, cellPadding?, labelOptions?, quotePrefix?, diagonalDown?, diagonalUp?, isVerticalText?, cellButtons?, dropdown?, textOrientation?, decoration?, mask?, fontStyle?, fontWeight?, fontSize?, fontFamily?, hidden?, textDirection?)

Represents the style for a cell, row, and column.

example

//This example uses a style with rules.
activeSheet.setArray(0,0,[1,2,3,4,5,6,7,8,9,10]);
var style = new GC.Spread.Sheets.Style();
style.backColor = "red";
style.foreColor = "black";
var cell = new GC.Spread.Sheets.ConditionalFormatting.NormalConditionRule();
cell.ruleType(GC.Spread.Sheets.ConditionalFormatting.RuleType.cellValueRule);
cell.operator(GC.Spread.Sheets.ConditionalFormatting.ComparisonOperators.greaterThan);
cell.value1(5);
cell.ranges([new GC.Spread.Sheets.Range(0, 0, 10, 1)]);
cell.style(style);
activeSheet.conditionalFormats.addRule(cell);
var style1 = new GC.Spread.Sheets.Style();
style1.foreColor = "red";
var top = new GC.Spread.Sheets.ConditionalFormatting.NormalConditionRule();
top.ruleType(GC.Spread.Sheets.ConditionalFormatting.RuleType.top10Rule);
top.type(GC.Spread.Sheets.ConditionalFormatting.Top10ConditionType.top);
top.rank(3);
top.style(style1);
top.ranges([new GC.Spread.Sheets.Range(0, 0, 10, 1)]);
top.stopIfTrue(true);
activeSheet.conditionalFormats.addRule(top);

example

//This example creates and sets parameters for the style.
sheet.setValue(0,0, 1,3);
sheet.setValue(1,0, 50,3);
sheet.setValue(2,0, 100,3);
sheet.setValue(3,0, 2,3);
sheet.setValue(4,0, 60,3);
sheet.setValue(5,0, 90,3);
sheet.setValue(6,0, 3,3);
sheet.setValue(7,0, 40,3);
sheet.setValue(8,0, 70,3);
sheet.setValue(9,0, 5,3);
sheet.setValue(10,0, 35,3);
var style = new GC.Spread.Sheets.Style();
style.backColor = "red";
style.borderLeft =new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderTop = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderRight = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderBottom =  new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
sheet.conditionalFormats.addAverageRule(GC.Spread.Sheets.ConditionalFormatting.AverageConditionType.above, style, [new GC.Spread.Sheets.Range(0, 0, 10, 3)]);

Parameters

Name Type
backColor? string | IGradientFill | IGradientPathFill | IPatternFill
foreColor? string
hAlign? HorizontalAlign
vAlign? VerticalAlign
font? string
themeFont? string
formatter? string | GeneralFormatter
borderLeft? LineBorder
borderTop? LineBorder
borderRight? LineBorder
borderBottom? LineBorder
locked? boolean
textIndent? number
wordWrap? boolean
showEllipsis? boolean
shrinkToFit? boolean
backgroundImage? string
cellType? Base
backgroundImageLayout? ImageLayout
tabStop? boolean
textDecoration? TextDecorationType
imeMode? ImeMode
name? string
parentName? string
watermark? string
cellPadding? string
labelOptions? ILabelOptions
quotePrefix? boolean
diagonalDown? LineBorder
diagonalUp? LineBorder
isVerticalText? boolean
cellButtons? ICellButton[]
dropdown? IDropdown[]
textOrientation? number
decoration? TextDecorationType
mask? IMaskType
fontStyle? string
fontWeight? string
fontSize? string
fontFamily? string
hidden? boolean
textDirection? TextDirectionType

Properties

applyAlignment

applyAlignment: boolean

Only work for namedStyle, the boolean value indicates whether the alignment formatting applied.

example

//This example sets the applyAlignment property for namedStyle.
var style = new GC.Spread.Sheets.Style();
style.name = 'test';
style.applyAlignment = false;
spread.addNamedStyle(style);

applyBorder

applyBorder: boolean

Only work for namedStyle, the boolean value indicates whether the border formatting applied.

example

//This example sets the applyBorder property for namedStyle.
var style = new GC.Spread.Sheets.Style();
style.name = 'test';
style.applyBorder = false;
spread.addNamedStyle(style);

applyFill

applyFill: boolean

Only work for namedStyle, the boolean value indicates whether the fill formatting applied.

example

//This example sets the applyFill property for namedStyle.
var style = new GC.Spread.Sheets.Style();
style.name = 'test';
style.applyFill = false;
spread.addNamedStyle(style);

applyFont

applyFont: boolean

Only work for namedStyle, the boolean value indicates whether the font formatting applied.

example

//This example sets the applyFont property for namedStyle.
var style = new GC.Spread.Sheets.Style();
style.name = 'test';
style.applyFont = false;
spread.addNamedStyle(style);

applyNumberFormat

applyNumberFormat: boolean

Only work for namedStyle, the boolean value indicates whether the number formatting applied.

example

//This example sets the applyNumberFormat property for namedStyle.
var style = new GC.Spread.Sheets.Style();
style.name = 'test';
style.applyNumberFormat = false;
spread.addNamedStyle(style);

applyProtection

applyProtection: boolean

Only work for namedStyle, the boolean value indicates whether the protection formatting applied.

example

//This example sets the applyProtection property for namedStyle.
var style = new GC.Spread.Sheets.Style();
style.name = 'test';
style.applyProtection = false;
spread.addNamedStyle(style);

backColor

backColor: undefined | string | IGradientFill | IGradientPathFill | IPatternFill

Indicates the background color.

example

//This example sets the style backColor property.
activeSheet.setArray(0,0,[1,2,3,4,5,6,7,8,9,10]);
var style = new GC.Spread.Sheets.Style();
style.backColor = "red";
style.foreColor = "black";
var cell = new GC.Spread.Sheets.ConditionalFormatting.NormalConditionRule();
cell.ruleType(GC.Spread.Sheets.ConditionalFormatting.RuleType.cellValueRule);
cell.operator(GC.Spread.Sheets.ConditionalFormatting.ComparisonOperators.greaterThan);
cell.value1(5);
cell.ranges([new GC.Spread.Sheets.Range(0, 0, 10, 1)]);
cell.style(style);
activeSheet.conditionalFormats.addRule(cell);
var style1 = new GC.Spread.Sheets.Style();
style1.foreColor = "red";
var top = new GC.Spread.Sheets.ConditionalFormatting.NormalConditionRule();
top.ruleType(GC.Spread.Sheets.ConditionalFormatting.RuleType.top10Rule);
top.type(GC.Spread.Sheets.ConditionalFormatting.Top10ConditionType.top);
top.rank(3);
top.style(style1);
top.ranges([new GC.Spread.Sheets.Range(0, 0, 10, 1)]);
top.stopIfTrue(true);
activeSheet.conditionalFormats.addRule(top);

backgroundImage

backgroundImage: undefined | string

Indicates the background image.

example

//This example sets the backgroundImage property.
var style = new GC.Spread.Sheets.Style();
style.backColor = "lightgreen";
style.backgroundImage = "./css/images/quarter1.png";
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);

backgroundImageLayout

backgroundImageLayout: undefined | ImageLayout

Indicates the background image layout.

example

//This example sets the backgroundImageLayout property.
var style = new GC.Spread.Sheets.Style();
style.backColor = "lightgreen";
style.backgroundImage = "./css/images/quarter1.png";
style.backgroundImageLayout  = GC.Spread.Sheets.ImageLayout.center;
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);

borderBottom

borderBottom: undefined | LineBorder

Indicates the bottom border line.

example

//This example creates a border.
var cellType = new GC.Spread.Sheets.CellTypes.Button();
cellType.buttonBackColor("#FFFF00");
cellType.text("this is a button");
var style = new GC.Spread.Sheets.Style();
style.backColor = "red";
style.borderLeft =new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderTop = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderRight = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderBottom = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.cellType = cellType
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);

borderLeft

borderLeft: undefined | LineBorder

Indicates the left border line.

example

//This example creates a border.
var cellType = new GC.Spread.Sheets.CellTypes.Button();
cellType.buttonBackColor("#FFFF00");
cellType.text("this is a button");
var style = new GC.Spread.Sheets.Style();
style.backColor = "red";
style.borderLeft =new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderTop = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderRight = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderBottom = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.cellType = cellType
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);

borderRight

borderRight: undefined | LineBorder

Indicates the right border line.

example

//This example creates a border.
var cellType = new GC.Spread.Sheets.CellTypes.Button();
cellType.buttonBackColor("#FFFF00");
cellType.text("this is a button");
var style = new GC.Spread.Sheets.Style();
style.backColor = "red";
style.borderLeft =new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderTop = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderRight = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderBottom = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.cellType = cellType
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);

borderTop

borderTop: undefined | LineBorder

Indicates the top border line.

example

//This example creates a border.
var cellType = new GC.Spread.Sheets.CellTypes.Button();
cellType.buttonBackColor("#FFFF00");
cellType.text("this is a button");
var style = new GC.Spread.Sheets.Style();
style.backColor = "red";
style.borderLeft =new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderTop = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderRight = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderBottom = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.cellType = cellType
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);

cellButtons

cellButtons: undefined | ICellButton[]

Indicates the cellButtons of cell.

property [caption] - Specific the text of the button to display

property [captionAlign] - Specific the position of image and caption.

property [position] - Specific the button's position in cell

property [enabled] - Specific whether the cell button responds to user actions, default value is true.

property [useButtonStyle] - Specific whether the cellButton is a button style, default value is false.

property [width] - Specific the button's width. If it is set to null or undefined, the button width is auto fit based on the caption and image size.

property [visibility] - Specific the button can be visible always, onSelected, onEditing, default value is always.

property {string | function} [command] - When click button, allow user to execute a spread command or user can execute a callback.

property [imageType] - Specific the button's type (the type of image to display in the button). Provide some predefined type for cellButton, custom allow to specific icon.

property [imageSrc] - When imageType is custom, can specific a image (base64) by imageSrc.

property [imageSize] - Specific the image's size, default value is 16px.

property [hoverBackColor] - Specific the hover backColor of cell button when the button is visible and enable.

property [buttonBackColor] - Specific the backColor of cell button when the button is enable.

example

buttonConfig1 = {
    caption: "left",
    enabled: true,
    buttonBackColor: "#174EA6",
    visibility:GC.Spread.Sheets.ButtonVisibility.always,
};
buttonConfig2 = {
    caption: "left",
    enabled: true,
    hoverBackColor: "#3390FF",
    visibility:GC.Spread.Sheets.ButtonVisibility.onSelected,
};
buttonConfig3 = {
    caption: "Cut",
    imageType: GC.Spread.Sheets.ButtonImageType.custom,
    useButtonStyle: true,
    imageSrc:"data:image/svg+xml;base64,PD94bWwgdmVyc2lvb...", //This is not a complete base64 string
};
//create style
var style = new GC.Spread.Sheets.Style();
style.cellButtons=[
     buttonConfig1,
     buttonConfig2,
     buttonConfig3
];
sheet.setStyle(0, 0, style);

cellPadding

cellPadding: undefined | string

Indicates the cell padding.

example

//This example sets the cell padding for the watermark.
var type = new GC.Spread.Sheets.Style();
type.watermark = "User name";
type.cellPadding = "20";
type.labelOptions = {alignment:GC.Spread.Sheets.LabelAlignment.topLeft, visibility: GC.Spread.Sheets.LabelVisibility.visible};
activeSheet.setStyle(0, 1, type);
activeSheet.getRange(0, -1, 1, -1, GC.Spread.Sheets.SheetArea.viewport).height(60);
activeSheet.getRange(-1, 1, -1, 1).width(150);
var combo = new GC.Spread.Sheets.CellTypes.ComboBox();
combo.items([{ text: "Oranges", value: "11k" }, { text: "Apples", value: "15k" }, { text: "Grape", value: "100k" }]);
combo.editorValueType(GC.Spread.Sheets.CellTypes.EditorValueType.text);
activeSheet.setCellType(2, 1, combo, GC.Spread.Sheets.SheetArea.viewport);
activeSheet.getCell(2, 1, GC.Spread.Sheets.SheetArea.viewport).watermark("ComboBox Cell Type").cellPadding('10 10 20 10');
activeSheet.getCell(2, 1, GC.Spread.Sheets.SheetArea.viewport).labelOptions({alignment: GC.Spread.Sheets.LabelAlignment.bottomCenter, foreColor: 'yellowgreen', font: 'bold 15px Arial'});
activeSheet.getRange(2, -1, 1, -1, GC.Spread.Sheets.SheetArea.viewport).height(60);

cellType

cellType: undefined | Base

Indicates the cell type.

example

//This example creates a style and applies it to a cell.
var cellType = new GC.Spread.Sheets.CellTypes.Button();
cellType.buttonBackColor("#FFFF00");
cellType.text("this is a button");
var style = new GC.Spread.Sheets.Style();
style.backColor = "red";
style.borderLeft =new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderTop = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderRight = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderBottom = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.cellType = cellType
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);

decoration

decoration: IDecoration

Define a decorator for cell to better represent cell.

example

//This example sets the decoration property for Style.
var style = new GC.Spread.Sheets.Style();
style.decoration = {
    cornerFold: {
       size: 6,
       position: GC.Spread.Sheets.CornerPosition.leftTop,
       color: "red"
    },
    icons: [
         {
             src: './icon.png',
             width: 12,
             height: 12,
             position: GC.Spread.Sheets.IconPosition.left,
         }
    ]
}

diagonalDown

diagonalDown: undefined | LineBorder

Indicates the diagonalDown border line.

example

activeSheet.getRange(-1, 3, -1, 1, GC.Spread.Sheets.SheetArea.viewport).diagonalDown(new GC.Spread.Sheets.LineBorder("blue", GC.Spread.Sheets.LineStyle.mediumDashed));

diagonalUp

diagonalUp: undefined | LineBorder

Indicates the diagonalUp border line.

example

activeSheet.getRange(-1, 3, -1, 1, GC.Spread.Sheets.SheetArea.viewport).diagonalUp(new GC.Spread.Sheets.LineBorder("blue", GC.Spread.Sheets.LineStyle.mediumDashed));

dropDowns: undefined | IDropdown[]

Indicates the dropdown type of cell.

example

leftButtonConfig1 = {
    caption: "left",
    enabled: true,
    isLeft: true,
    visibility:GC.Spread.Sheets.ButtonVisibility.always,
    command: "opendropdown"
}
//create style
var style = new GC.Spread.Sheets.Style();
style.cellButtons=[
     leftButtonConfig1
];
style.dropDowns= [{ type: "colorPicker" }];
sheet.setStyle(0, 0, style);

font

font: undefined | string

Indicates the font.

example

//This example sets the font property.
var style = new GC.Spread.Sheets.Style();
style.font = "8pt Arial";
style.hAlign = GC.Spread.Sheets.HorizontalAlign.center;
style.vAlign = GC.Spread.Sheets.VerticalAlign.center;
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);
activeSheet.getCell(1,1).value("B2");

fontFamily

fontFamily: undefined | string

Indicates the fontFamily.

example

//This example sets the fontFamily property.
var style = new GC.Spread.Sheets.Style();
style.fontFamily = "Arial";
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);
activeSheet.getCell(1,1).value("B2");

fontSize

fontSize: undefined | string

Indicates the fontSize.

example

//This example sets the fontSize property.
var style = new GC.Spread.Sheets.Style();
style.fontSize = "22px";
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);
activeSheet.getCell(1,1).value("B2");

fontStyle

fontStyle: undefined | string

Indicates the fontStyle.

example

//This example sets the fontStyle property.
var style = new GC.Spread.Sheets.Style();
style.fontStyle = "italic";
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);
activeSheet.getCell(1,1).value("B2");

fontWeight

fontWeight: undefined | string

Indicates the fontWeight.

example

//This example sets the fontWeight property.
var style = new GC.Spread.Sheets.Style();
style.fontWeight = "bold";
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);
activeSheet.getCell(1,1).value("B2");

foreColor

foreColor: undefined | string

Indicates the foreground color.

example

//This example sets the foreColor property.
activeSheet.setArray(0,0,[1,2,3,4,5,6,7,8,9,10]);
var style = new GC.Spread.Sheets.Style();
style.backColor = "red";
style.foreColor = "black";
var cell = new GC.Spread.Sheets.ConditionalFormatting.NormalConditionRule();
cell.ruleType(GC.Spread.Sheets.ConditionalFormatting.RuleType.cellValueRule);
cell.operator(GC.Spread.Sheets.ConditionalFormatting.ComparisonOperators.greaterThan);
cell.value1(5);
cell.ranges([new GC.Spread.Sheets.Range(0, 0, 10, 1)]);
cell.style(style);
activeSheet.conditionalFormats.addRule(cell);
var style1 = new GC.Spread.Sheets.Style();
style1.foreColor = "red";
var top = new GC.Spread.Sheets.ConditionalFormatting.NormalConditionRule();
top.ruleType(GC.Spread.Sheets.ConditionalFormatting.RuleType.top10Rule);
top.type(GC.Spread.Sheets.ConditionalFormatting.Top10ConditionType.top);
top.rank(3);
top.style(style1);
top.ranges([new GC.Spread.Sheets.Range(0, 0, 10, 1)]);
top.stopIfTrue(true);
activeSheet.conditionalFormats.addRule(top);

formatter

formatter: undefined | string | GeneralFormatter

Indicates the formatter.

example

//This example uses the formatter property.
var style = new GC.Spread.Sheets.Style();
style.formatter = "0.000%";
style.themeFont = "Body";
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);
activeSheet.getCell(1,1).value("11");

hAlign

hAlign: undefined | HorizontalAlign

Indicates the horizontal alignment.

example

//This example sets the hAlign property.
var style = new GC.Spread.Sheets.Style();
style.font = "8pt Arial";
style.hAlign = GC.Spread.Sheets.HorizontalAlign.center;
style.vAlign = GC.Spread.Sheets.VerticalAlign.center;
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);
activeSheet.getCell(1,1).value("B2");

hidden

hidden: undefined | boolean

Indicates whether a cell formula is visible or not when sheet is protected.

example

//This example hidden a single cell.
activeSheet.options.isProtected = true;
activeSheet.setValue(1, 1, "=SUM(1,2)");
var style = new GC.Spread.Sheets.Style();
style.backColor = "red";
style.borderLeft =new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderTop = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderRight = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderBottom = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.hidden = true;
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);

imeMode

imeMode: undefined | ImeMode

Indicates the Input Method Editor (IME) mode.

deprecated This property currently only works in Internet Explorer.

example

//This example sets the IME mode.
var style = new GC.Spread.Sheets.Style();
style.imeMode = GC.Spread.Sheets.ImeMode.auto;
activeSheet.setStyle(0, 0, style);

isVerticalText

isVerticalText: undefined | boolean

Indicates whether to set the text vertical.

example

//This example uses the rotate property.
var style = new GC.Spread.Sheets.Style();
style.isVerticalText = true;
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);

labelOptions

labelOptions: undefined | ILabelOptions

Indicates the cell label options.

property [alignment] - The cell label position.

property [visibility] - The cell label visibility.

property [font] - The cell label font.

property [foreColor] - The cell label foreColor.

property [margin] - The cell label margin.

example

//This example sets label options for the watermark.
var type = new GC.Spread.Sheets.Style();
type.watermark = "User name";
type.cellPadding = "20";
type.labelOptions = {alignment:GC.Spread.Sheets.LabelAlignment.topLeft, visibility: GC.Spread.Sheets.LabelVisibility.visible};
activeSheet.setStyle(0, 1, type);
activeSheet.getRange(0, -1, 1, -1, GC.Spread.Sheets.SheetArea.viewport).height(60);
activeSheet.getRange(-1, 1, -1, 1).width(150);
var combo = new GC.Spread.Sheets.CellTypes.ComboBox();
combo.items([{ text: "Oranges", value: "11k" }, { text: "Apples", value: "15k" }, { text: "Grape", value: "100k" }]);
combo.editorValueType(GC.Spread.Sheets.CellTypes.EditorValueType.text);
activeSheet.setCellType(2, 1, combo, GC.Spread.Sheets.SheetArea.viewport);
activeSheet.getCell(2, 1, GC.Spread.Sheets.SheetArea.viewport).watermark("ComboBox Cell Type").cellPadding('10 10 20 10');
activeSheet.getCell(2, 1, GC.Spread.Sheets.SheetArea.viewport).labelOptions({alignment: GC.Spread.Sheets.LabelAlignment.bottomCenter, foreColor: 'yellowgreen', font: 'bold 15px Arial'});
activeSheet.getRange(2, -1, 1, -1, GC.Spread.Sheets.SheetArea.viewport).height(60);

locked

locked: undefined | boolean

Indicates whether a cell is marked as locked from editing.

example

//This example unlocks a single cell.
activeSheet.options.isProtected = true;
var style = new GC.Spread.Sheets.Style();
style.backColor = "red";
style.borderLeft =new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderTop = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderRight = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.borderBottom = new GC.Spread.Sheets.LineBorder("blue",GC.Spread.Sheets.LineStyle.medium);
style.locked = false;
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);

mask

mask: undefined | IMaskType

Indicates input mask.

example

// This example uses the mask property.
var style = new GC.Spread.Sheets.Style();
style.mask = {
    pattern: '000-00000',
    excludeLiteral: true,
    placeholder: '#'
};
activeSheet.setStyle(1, 1, style, GC.Spread.Sheets.SheetArea.viewport);

name

name: undefined | string

Indicates the name.

example

//This example sets the style name.
var namedStyle = new GC.Spread.Sheets.Style();
namedStyle.name = "style1";
namedStyle.backColor = "green";
activeSheet.addNamedStyle(namedStyle);
activeSheet.setStyleName(1, 1, "style1"); // cell(1,1)'s backColor is green.
var namedStyle1 = new GC.Spread.Sheets.Style();
namedStyle1.name = "style2";
namedStyle1.parentName = "style1";
namedStyle1.foreColor = "red";    // the namedStyle's foreColor is red.
activeSheet.addNamedStyle(namedStyle1);
activeSheet.setStyleName(2, 1, "style2");

parentName

parentName: undefined | string

Indicates the name of the parent style.

example

//This example sets the parent name.
var namedStyle = new GC.Spread.Sheets.Style();
namedStyle.name = "style1";
namedStyle.backColor = "green";
activeSheet.addNamedStyle(namedStyle);
activeSheet.setStyleName(1, 1, "style1"); // cell(1,1)'s backColor is green.
var namedStyle1 = new GC.Spread.Sheets.Style();
namedStyle1.name = "style2";
namedStyle1.parentName = "style1";
namedStyle1.foreColor = "red";    // the namedStyle's foreColor is red.
activeSheet.addNamedStyle(namedStyle1);
activeSheet.setStyleName(2, 1, "style2");

showEllipsis

showEllipsis: undefined | boolean

Controls whether the Text out of bounds shows ellipsis.

example

//This example sets the showEllipsis property.
var style = new GC.Spread.Sheets.Style();
style.showEllipsis = true;
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);
activeSheet.getCell(1,1).text("TestTestTestTest");

shrinkToFit

shrinkToFit: undefined | boolean

Indicates whether to shrink to fit.

example

//This example sets the shrinkToFit property.
var style = new GC.Spread.Sheets.Style();
style.shrinkToFit = true;
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);
activeSheet.getCell(1,1).text("Shrink To Fit");

tabStop

tabStop: undefined | boolean

Indicates whether the user can set focus to the cell using the Tab key.

example

//This example sets the tabStop property.
var style = new GC.Spread.Sheets.Style();
style.tabStop = false;
style.backColor = "lightgreen";
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);

textDecoration

textDecoration: undefined | TextDecorationType

Indicates the decoration added to text.

example

//This example uses the textDecoration property.
activeSheet.getCell(0, 0).textDecoration(GC.Spread.Sheets.TextDecorationType.underline);
activeSheet.getRange(1, -1, 1, -1).textDecoration(GC.Spread.Sheets.TextDecorationType.overline | GC.Spread.Sheets.TextDecorationType.underline);
activeSheet.getRange(-1, 1, -1, 1).textDecoration(GC.Spread.Sheets.TextDecorationType.overline | GC.Spread.Sheets.TextDecorationType.lineThrough | GC.Spread.Sheets.TextDecorationType.underline);
var style = new GC.Spread.Sheets.Style();
style.textDecoration = GC.Spread.Sheets.TextDecorationType.overline | GC.Spread.Sheets.TextDecorationType.underline;
activeSheet.setStyle(1, 1, style, GC.Spread.Sheets.SheetArea.viewport);
activeSheet.getCell(0, 0).value("Test");
activeSheet.getCell(1, 0).value("Test");
activeSheet.getCell(0, 1).value("Test");

textDirection

textDirection: undefined | TextDirectionType

Define a text direction for cell to better represent cell.

example

//This example sets the text direction property for Style.
var style = new GC.Spread.Sheets.Style();
style.textDirection = GC.Spread.Sheets.TextDirectionType.rightToLeft;

textIndent

textIndent: undefined | number

Indicates the number of units of indentation for text in a cell, an integer value, where an increment of 1 represents 8 pixels.

example

//This example sets the textIndent property.
var style = new GC.Spread.Sheets.Style();
style.textIndent = 3;
// Enter multiple lines with Alt+Enter
style.wordWrap = true;
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);
activeSheet.getCell(1,1).text("Test");

textOrientation

textOrientation: undefined | number

Indicates the text rotation angle of cell.

example

//This example sets the textOrientation property.
var style = new GC.Spread.Sheets.Style();
style.textOrientation = 66;
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);
activeSheet.getCell(1,1).text("TestTestTestTest");

themeFont

themeFont: undefined | string

Indicates the font theme.

example

//This example uses the themeFont property.
var style = new GC.Spread.Sheets.Style();
style.formatter = "0.000%";
style.themeFont = "Body";
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);
activeSheet.getCell(1,1).value("11");

vAlign

vAlign: undefined | VerticalAlign

Indicates the vertical alignment.

example

//This example sets the vAlign property.
var style = new GC.Spread.Sheets.Style();
style.font = "8pt Arial";
style.hAlign = GC.Spread.Sheets.HorizontalAlign.center;
style.vAlign = GC.Spread.Sheets.VerticalAlign.center;
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);
activeSheet.getCell(1,1).value("B2");

watermark

watermark: undefined | string

Indicates the watermark content.

example

//The following examples add watermarks to cells, columns, and rows.
var type = new GC.Spread.Sheets.Style();
type.watermark = "User name";
sheet.setStyle(0, 1, type);
var type = new GC.Spread.Sheets.Style();
type.watermark = "Password";
sheet.setStyle(1, 1, type);

example

var type = new GC.Spread.Sheets.Style();
type.watermark = "The watermark.";
activeSheet.setStyle(-1, 1, type);
activeSheet.setStyle(1, -1, type);
activeSheet.setStyle(2, 2, type);

wordWrap

wordWrap: undefined | boolean

Indicates whether to wrap text.

example

//This example sets the wordWrap property.
var style = new GC.Spread.Sheets.Style();
style.textIndent = 3;
// Enter multiple lines with Alt+Enter
style.wordWrap = true;
activeSheet.setStyle(1,1,style,GC.Spread.Sheets.SheetArea.viewport);
activeSheet.getCell(1,1).text("Test");

Methods

clone

clone(): Style

Clones the current style.

Returns

Style

The cloned style.