blazor-dom-confetti
is a blazor wraper component for dom-confetti.
Can I see a live demo? Yes, at https://blazorrepl.com/repl/wluQmuPX38bvbL8n28
Install blazor-dom-confetti via nuget with your favorite method:
- .net cli:
dotnet add package blazor-dom-confetti --version 0.0.0.5
- Package reference:
<PackageReference Include="blazor-dom-confetti" Version="0.0.0.5" />
- Package manager:
Install-Package blazor-dom-confetti -Version 0.0.0.5
Use component where you want, just insert <Blafettis @ref="blafettis" />
component where you want to raise confettis, and call blafettis.RaiseConfetti();
method (remember to include namespace using BlafettisLib;
or @using BlafettisLib
):
@page "/counter"
@using BlafettisLib
<button class="btn btn-primary" @onclick="IncrementCount">
Click me
<Blafettis @ref="blafettis" />
</button>
@code {
private int currentCount = 0;
protected Blafettis blafettis; // get the reference
private void IncrementCount()
{
currentCount++;
blafettis.RaiseConfetti(); // raise confetti via method
}
}
Personalize your confetti with options (colors, angle, velocity, ...) see demo for a sample https://github.com/ctrl-alt-d/blazor-dom-confetti/blob/main/DemosAndMore/Demos/DemoServerSide/Pages/Options.razor
From version 0.0.0.4
no js includes are needed.
- Be free to PR any feature or bugfix.
- Be free to post any issue.
- Be free to star and promote this project and also dom-confetti project.
- License MIT, copyright Dani Herrera. The component blazor-dom-confetti is a wrapper for Daniel Lundin's dom-confetti project. dom-confetti's code is included on
bundle.js
for devs convinience.
A blazor native version, without javascript, wrote 100% on c# and html is available at ./DemosAndMore/dom.confetti-blazor-native-component/blazor-blazor-confetti. It is a 100% JS free native blazor component. This component is a clone of dom-confetti but without javascript, just Blazor. Not ready for production.