BlazeFX 1.1.4

.NET 8.0 This package targets .NET 8.0. The package is compatible with this framework or higher. 
dotnet add package BlazeFX --version 1.1.4
                    


                    

                
NuGet\Install-Package BlazeFX -Version 1.1.4
This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package. 
<PackageReference Include="BlazeFX" Version="1.1.4" />
For projects that support PackageReference, copy this XML node into the project file to reference the package. 
<PackageVersion Include="BlazeFX" Version="1.1.4" />
                    


                            Directory.Packages.props
                        

                    

                
<PackageReference Include="BlazeFX" />
                    


                            Project file
For projects that support Central Package Management (CPM), copy this XML node into the solution Directory.Packages.props file to version the package. 
paket add BlazeFX --version 1.1.4
                    


                    

                
#r "nuget: BlazeFX, 1.1.4"
#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package. 
#:package BlazeFX@1.1.4
#:package directive can be used in C# file-based apps starting in .NET 10 preview 4. Copy this into a .cs file before any lines of code to reference the package. 
#addin nuget:?package=BlazeFX&version=1.1.4
                    


                            Install as a Cake Addin
                        

                    

                
#tool nuget:?package=BlazeFX&version=1.1.4
                    


                            Install as a Cake Tool

BlazeFX

NuGet

BlazeFX is a lightweight front-end animation library designed specifically for Blazor components. It empowers developers to effortlessly incorporate a wide array of animations into their Blazor projects without the need for manual CSS writing. By leveraging our pre-built components, you can enjoy seamless animations with minimal setup, enhancing the user experience of your web applications.

Features

  • Easy-to-use animation components
  • Wide variety of pre-defined animations
  • Customizable duration and easing functions
  • Compatible with both Blazor WebAssembly and Blazor Server

Installation

To add BlazeFX to your project, run the following command in your terminal:

dotnet add package BlazeFX

Setup

  1. Add the following line to your _Imports.razor file:

    @using BlazeFX

  2. Include the required stylesheet and script in your HTML:

    • Stylesheet: Add the following to your HTML <head> section
    <link rel="stylesheet" href="/_content/BlazeFX/blazefx.min.css" />
    • Script: Add the following script at the end of the <body> tag:
     <script src="/_content/BlazeFX/blazefx.js"></script>

    For Blazor WebAssembly, modify index.html. For Blazor Server, modify _Layout.cshtml, _Host.cshtml, or App.razor, depending on your project setup.

Usage

BlazeFX simplifies the process of adding animations to your Blazor components. Here's a basic example:

<BlazeFX Animation="Animations.Grow" Easing="Easing.EaseInBounce" Duration="TimeSpan.FromSeconds(2)">
    <h1>Hello, Animated World!</h1>
</BlazeFX>

You can easily switch between various animations and adjust parameters like Easing and Duration to customize the effect.

Available Animations

  • Fade
  • Grow
  • Shrink
  • Slide
  • Rotate
  • Flip
  • Bounce
  • ... and more!

Customization Options

  • Animation: Choose from a variety of pre-defined animations
  • Easing: Select an easing function to control the animation's progression
  • Duration: Set the length of the animation
  • Delay: Add a delay before the animation starts
  • RenderCompleteOnly: Ensure the animation runs only after pre-rendering is complete.

IMPORTANT! If RenderCompleteOnly is set to true but pre-rendering is not enabled (e.g., in a static server environment), the animation and the component involved may not appear, remaining visibly hidden.

Contributing

We welcome contributions to BlazeFX! If you encounter any issues, have feature requests, or want to improve the library, please feel free to:

  1. Open an issue
  2. Submit a pull request
  3. Discuss potential changes in the issues section

Future Plans

BlazeFX is under active development. Our roadmap includes:

  • Introducing more customization options for animations
  • Expanding documentation and providing more examples

Support

If you need help or have any questions, please:

Troubleshooting

Double Animation on First Load

If animations run twice when your Blazor project/component loads for the first time, use the RenderCompleteOnly="true" parameter to ensure the animation runs only after pre-rendering is complete.

<BlazeFX RenderCompleteOnly="true" Animation="Animations.Blinking" Easing="Easing.EaseInOut">
    <h1>Hello, Animated World!</h1>
</BlazeFX>
Product Compatible and additional computed target framework versions.
.NET net8.0 is compatible.  net8.0-android was computed.  net8.0-browser was computed.  net8.0-ios was computed.  net8.0-maccatalyst was computed.  net8.0-macos was computed.  net8.0-tvos was computed.  net8.0-windows was computed.  net9.0 was computed.  net9.0-android was computed.  net9.0-browser was computed.  net9.0-ios was computed.  net9.0-maccatalyst was computed.  net9.0-macos was computed.  net9.0-tvos was computed.  net9.0-windows was computed.  net10.0 was computed.  net10.0-android was computed.  net10.0-browser was computed.  net10.0-ios was computed.  net10.0-maccatalyst was computed.  net10.0-macos was computed.  net10.0-tvos was computed.  net10.0-windows was computed. 
Compatible target framework(s)
Included target framework(s) (in package)
Learn more about Target Frameworks and .NET Standard.

NuGet packages

This package is not used by any NuGet packages.

GitHub repositories

This package is not used by any popular GitHub repositories.

Version Downloads Last Updated
1.1.4 196 10/16/2024
1.1.3 127 10/15/2024
1.1.2 110 10/11/2024
1.1.1 127 10/10/2024