Visão geral do React Ripple
O componente Ondulação Ignite UI for React cria uma animação em resposta a um toque ou clique do mouse.
React Ripple Example
Usage
Primeiro, você precisa instalar o pacote npm Ignite UI for React correspondente executando o seguinte comando:
npm install igniteui-react
Você precisará importar o IgrRipple
CSS necessário e registrar seu módulo, assim:
import { IgrRippleModule, IgrRipple } from 'igniteui-react';
import 'igniteui-webcomponents/themes/light/bootstrap.css';
IgrRippleModule.register();
<IgrButton>
<IgrRipple></IgrRipple>
<span>Ripple Button</span>
</IgrButton>
Você pode adicionar o IgrRipple
componente a qualquer elemento da web, desde que sua propriedade CSS position
esteja definida como qualquer outro valor que static
;
Examples
Color
Você pode alterar a cor da ondulação definindo a propriedade CSS--color
para qualquer cor CSS válida:
igc-ripple {
--color: olive;
}