Web Components Formatação condicional de planilha

    O componente Planilha Web Components permite formatar condicionalmente as células de uma planilha. Isso permite que você destaque diferentes partes de seus dados com base em uma condição.

    Web Components Spreadsheet Conditional Formatting Example

    Conditional Formatting Overview

    Você pode configurar a formatação condicional de uma determinada planilha usando os muitosAdd métodos expostos naconditionalFormats coleção dessa planilha. O primeiro parâmetro dessesAdd métodos é a região de string da folha de exercícios à qual você gostaria de aplicar o formato condicional.

    Muitos dos formatos condicionais que você pode adicionar à sua planilha têm umacellFormat propriedade que determina como as células devem se apresentar quando a condição nesse formato condicional se mantém. Por exemplo, você pode usar as propriedades associadas a essacellFormat propriedade, comofill efont para determinar as configurações de fundo e fonte das suas células, respectivamente.

    Quando um formato condicional é criado ecellFormat aplicado, há um subconjunto de propriedades que atualmente são suportadas pela célula da planilha. As propriedades que atualmente são homenageadas fora dascellFormat propriedadesfill são,Border​formatString, e algumasfont propriedades como riscado, sublinhado, itálico, negrito e cor. Muitos desses podem ser vistos no trecho de código abaixo.

    Existem alguns formatos condicionais que não possuem propriedadecellFormat, pois a visualização deles nas células se comporta de forma diferente. Esses formatos condicionais são oDataBarConditionalFormat,ColorScaleConditionalFormat, eIconSetConditionalFormat.

    Ao carregar uma pasta de trabalho pré-existente do Excel, os formatos serão preservados quando essa pasta de trabalho for carregada. O mesmo vale para quando você salva a pasta de trabalho em um arquivo do Excel.

    A seguir, estão listados os formatos condicionais suportados no controle Web ComponentsIgcSpreadsheetComponent:

    • AverageConditionalFormat: Adicionado usando oaddAverageCondition método, esse formato condicional expõe propriedades que controlam os atributos visuais de uma célula de folha de exercícios com base no valor da célula acima ou abaixo da média ou desvio padrão para a faixa associada.
    • BlanksConditionalFormat: Adicionado usando oaddBlanksCondition método, esse formato condicional expõe propriedades que controlam os atributos visuais de uma célula de folha de cálculo com base no valor da célula não definido.
    • ColorScaleConditionalFormat: Adicionado usando oaddColorScaleCondition método, esse formato condicional expõe propriedades que controlam a coloração de uma célula de folha de cálculo com base no valor da célula em relação aos valores mínimo, médio e máximo de limiar.
    • DataBarConditionalFormat: Adicionado usando oaddDataBarCondition método, esse formato condicional expõe propriedades que exibem barras de dados em uma célula de folha de cálculo com base no valor da célula em relação ao intervalo associado de valores.
    • DateTimeConditionalFormat: Adicionado usando oaddDateTimeCondition método, esse formato condicional expõe propriedades que controlam os atributos visuais de uma célula de folha de cálculo com base em se o valor de data de uma célula está dentro de um determinado intervalo de tempo.
    • DuplicateConditionalFormat: Adicionado usando oaddDuplicateCondition método, esse formato condicional expõe propriedades que controlam os atributos visuais de uma célula de folha de cálculo com base se o valor da célula é único ou duplicado ao longo do intervalo associado.
    • ErrorsConditionalFormat: Adicionado usando oaddErrorsCondition método, esse formato condicional expõe propriedades que controlam os atributos visuais de uma célula de folha de exercícios com base na validez do valor da célula.
    • FormulaConditionalFormat: Adicionado usando oaddFormulaCondition método, esse formato condicional expõe propriedades que controlam os atributos visuais de uma célula de folha de cálculo com base no valor da célula se atende aos critérios definidos por uma fórmula.
    • IconSetConditionalFormat: Adicionado usando oaddIconSetCondition método, esse formato condicional expõe propriedades que exibem ícones em uma célula de planilha com base no valor da célula em relação aos valores limiar.
    • NoBlanksConditionalFormat: Adicionado usando oaddNoBlanksCondition método, esse formato condicional expõe propriedades que controlam os atributos visuais de uma célula de folha de cálculo com base em se o valor da célula está definido.
    • NoErrorsConditionalFormat: Adicionado usando oaddNoErrorsCondition método, esse formato condicional expõe propriedades que controlam os atributos visuais de uma célula de folha de exercícios com base na validez do valor da célula.
    • OperatorConditionalFormat: Adicionado usando oaddOperatorCondition método, esse formato condicional expõe propriedades que controlam os atributos visuais de uma célula de folha de trabalho com base em se o valor da célula atende aos critérios definidos por um operador lógico.
    • RankConditionalFormat: Adicionado usando oaddRankCondition método, esse formato condicional expõe propriedades que controlam os atributos visuais de uma célula de folha de cálculo com base em se o valor da célula está entre o topo ou o inferior da linha de valores ao longo do intervalo associado.
    • TextOperatorConditionalFormat: Adicionado usando oaddTextCondition método, esse formato condicional expõe propriedades que controlam os atributos visuais de uma célula de folha de cálculo com base em se o valor do texto de uma célula atende aos critérios definidos por uma string e umFormatConditionTextOperator valor colocado nosaddTextCondition parâmetros do método.
    • UniqueConditionalFormat: Adicionado usando oaddUniqueCondition método, esse formato condicional expõe propriedades que controlam os atributos visuais de uma célula de folha de exercícios com base em se o valor de uma célula é único dentro do intervalo associado.

    Dependencies

    Para adicionar formatação condicional aoIgcSpreadsheetComponent controle, você precisará importar as seguintes dependências:

    import { CellFill } from "igniteui-webcomponents-excel";
import { Color } from 'igniteui-webcomponents-core';
import { ColorScaleType } from "igniteui-webcomponents-excel";
import { FormatConditionAboveBelow } from 'igniteui-webcomponents-excel';
import { FormatConditionIconSet } from 'igniteui-webcomponents-excel';
import { FormatConditionOperator } from 'igniteui-webcomponents-excel';
import { FormatConditionTextOperator } from 'igniteui-webcomponents-excel';
import { FormatConditionTimePeriod } from 'igniteui-webcomponents-excel';
import { FormatConditionTopBottom } from "igniteui-webcomponents-excel";
import { WorkbookColorInfo } from 'igniteui-webcomponents-excel';

    Code Snippet

    O seguinte trecho de código demonstra como adicionar cada um dos formatos condicionais a uma planilha noIgcSpreadsheetComponent controle:

    let sheet = this.spreadsheet.activeWorksheet;

let red = new Color();
red.colorString = "#ff0000";

let blue = new Color();
blue.colorString = "#0000ff";

let green = new Color();
green.colorString = "#00ff00";

let gray = new Color();
gray.colorString = "#d3d3d3";

let avgFormat = sheet.conditionalFormats().addAverageCondition("A1:A10", FormatConditionAboveBelow.AboveAverage);
avgFormat.cellFormat.font.colorInfo = new WorkbookColorInfo(red);

let blanksFormat = sheet.conditionalFormats().addBlanksCondition("B1:B10");
blanksFormat.cellFormat.fill = CellFill.createSolidFill(new WorkbookColorInfo(gray));

let colorFormat = sheet.conditionalFormats().addColorScaleCondition("C1:C10", ColorScaleType.ThreeColor);
colorFormat.minimumThreshold.formatColor = new WorkbookColorInfo(red);
colorFormat.midpointThreshold.formatColor = new WorkbookColorInfo(blue);
colorFormat.maximumThreshold.formatColor = new WorkbookColorInfo(green);

let dataBarFormat = sheet.conditionalFormats().addDataBarCondition("D1:D10");

let dateTimeFormat = sheet.conditionalFormats().addDateTimeCondition("E1:E10", FormatConditionTimePeriod.NextWeek);
dateTimeFormat.cellFormat.font.colorInfo = new WorkbookColorInfo(red);

let duplicateFormat = sheet.conditionalFormats().addDuplicateCondition("F1:F10");
duplicateFormat.cellFormat.font.colorInfo = new WorkbookColorInfo(blue);

let errorFormat = sheet.conditionalFormats().addErrorsCondition("G1:G10");
errorFormat.cellFormat.font.colorInfo = new WorkbookColorInfo(green);

let formulaFormat = sheet.conditionalFormats().addFormulaCondition("H1:H10", "=H1>2");
formulaFormat.cellFormat.font.colorInfo = new WorkbookColorInfo(red);

let iconFormat = sheet.conditionalFormats().addIconSetCondition("I1:I10", FormatConditionIconSet.IconSet3TrafficLights1);

let noBlanksFormat = sheet.conditionalFormats().addNoBlanksCondition("J1:J10");
noBlanksFormat.cellFormat.fill = CellFill.createSolidFill(new WorkbookColorInfo(gray));

let noErrorFormat = sheet.conditionalFormats().addErrorsCondition("K1:K10");
noErrorFormat.cellFormat.font.colorInfo = new WorkbookColorInfo(red);

let operatorFormat = sheet.conditionalFormats().addOperatorCondition("L1:L10", FormatConditionOperator.Greater);
operatorFormat.setOperand1(500);
operatorFormat.cellFormat.font.colorInfo = new WorkbookColorInfo(blue);

let rankFormat = sheet.conditionalFormats().addRankCondition("M1:M10", FormatConditionTopBottom.Top, 5);
rankFormat.cellFormat.font.colorInfo = new WorkbookColorInfo(green);

let textFormat = sheet.conditionalFormats().addTextCondition("N1:N10", "A", FormatConditionTextOperator.Contains);
textFormat.cellFormat.font.colorInfo = new WorkbookColorInfo(red);

let uniqueFormat = sheet.conditionalFormats().addUniqueCondition("O1:O10");
uniqueFormat.cellFormat.font.colorInfo = new WorkbookColorInfo(blue);

    API References