Descripción general de Blazor Ripple

    El componente Ignite UI for Blazor Ripple crea una animación en respuesta a un toque o a un clic del ratón.

    Ejemplo de ondulación Blazor

    EXAMPLE
    MODULES
    RAZOR
    CSS

    ¿Te gusta esta muestra? Obtenga acceso a nuestro kit de herramientas de Ignite UI for Blazor completo y comience a crear sus propias aplicaciones en minutos. Descárgalo gratis.

    Uso

    Antes de usar IgbRipple, debe registrarlo de la siguiente manera:

    // in Program.cs file
    
    builder.Services.AddIgniteUIBlazor(typeof(IgbRippleModule));
    razor

    También deberá vincular un archivo CSS adicional para aplicar el estilo al IgbRipple componente. Lo siguiente debe colocarse en el archivo wwwroot/index.html de un proyecto de Blazor Web Assembly o en el archivo Pages/_Host.cshtml de un proyecto de Blazor Server:

    <link href="_content/IgniteUI.Blazor/themes/light/bootstrap.css" rel="stylesheet" />
    razor
    <IgbButton Variant="@ButtonVariant.Contained">
        Ripple Button
        <IgbRipple></IgbRipple>
    </IgbButton>
    razor

    Puede agregar el componente IgbRipple a cualquier elemento web siempre que su propiedad position CSS esté establecida en cualquier otro valor que no sea static;

    Ejemplos

    Color

    Puede cambiar el color de la onda estableciendo la propiedad CSS--color en cualquier color CSS válido:

    igc-ripple {
      --color: olive;
    }
    css

    EXAMPLE
    MODULES
    RAZOR
    CSS

    Referencias de API

    Recursos adicionales