Alterar a cor do título dinamicamente

Tipo de Actions : Simples Tipo de ação: Mesclar Esquema de Componente

Essa lógica avançada altera a cor do rótulo de um componente de campo de texto quando o usuário seleciona a cor desejada em uma lista. A alteração se aplica usando um arquivo CSS personalizado.

Pré-requisitos: adicione as classes CSS contendo a nova cor para o campo de texto no campo de propriedade CSS Personalizado do formulário.

Por exemplo, o trecho de CSS abaixo contém uma classe que define a cor do rótulo para verde ou vermelho:

.textFieldLabel-green 
{
   color : green;
}
.textFieldLabel-red 
{
   color : red;
}

Após referenciar as classes CSS no campo de propriedade CSS Personalizado , crie seu formulário seguindo as etapas abaixo:

1. Adicione um componente Campo de Texto e um componente Rádio . Preste atenção em seus Nomes de Propriedade, conforme você os usar em sua lógica avançada.
2. Na guia Exibição do componente do campo de texto, defina uma Classe CSS Personalizadapadrão. Por exemplo, para definir o vermelho como a cor padrão do campo de texto, use a classe textFieldLabel-red . A classe deve ser definida no arquivo CSS que você criou para a seção Pré -requisitos.
   
   

   

   
   
3. Para o componente Rádio , adicione dois valores para as cores green e red.
4. Vá para a guia Lógica do componente Campo de texto .
5. Adicione uma lógica e lhe atribua o nome "color selection".
6. Selecione o tipo de gatilho Simples .
   1. No menu suspenso Quando o componente do formulário , selecione Radio ({radio_field_key}).
   2. No campo Tem o valor , insira "green".
   A configuração acima detecta se o usuário seleciona "green" entre as opções de rádio e dispara as Actions para alterar a cor do rótulo do campo de texto.
7. Adicione uma Actions e chame-a de "change color using css"
8. Selecione o tipo de ação Mesclar Componente de Esquema e insira o seguinte fragmento:

   return { customClass: "textFieldLabel-green" }

9. Salve a ação e a lógica.
10. Salve o componente.

No tempo de Runtime, se o usuário empresarial selecionar o botão de rádio "green" , o rótulo do campo de texto ficará verde. Se o usuário selecionar o botão de rádio "red" , o rótulo do campo de texto ficará vermelho.