WebPAnimationControl.Avalonia 1.0.0

WebPAnimationControl

An Avalonia UI control for displaying animated WebP images with full playback control.

Features

• Animated WebP playback with per-frame timing
• Multiple source types: file paths, Avalonia resources (avares://), relative paths
• Configurable looping with optional loop delay
• Start delay before first playback
• Two-way IsPlaying binding for MVVM integration
• Image scaling modes: Uniform, UniformToFill, Fill, None
• Stretch direction constraints: UpOnly, DownOnly, Both
• Fallback frame rate when frame durations are unavailable
• Hardware-accelerated rendering via SkiaSharp
• Error display on load failures

Installation

dotnet add package WebPAnimationControl

Or via the NuGet Package Manager:

Install-Package WebPAnimationControl

Requirements

• .NET 8.0+
• Avalonia 11.0.10+

Usage

XAML

Add the namespace:

xmlns:webp="clr-namespace:WebPAnimationControl.Controls;assembly=WebPAnimationControl"

Basic usage:

<webp:AnimatedWebPControl Source="Assets/animation.webp"
                          AutoStart="True"
                          Loop="True"
                          Stretch="Uniform" />

Full example with all properties:

<webp:AnimatedWebPControl Source="avares://MyApp/Assets/animation.webp"
                          AutoStart="True"
                          Loop="True"
                          LoopDelay="1.5"
                          StartDelay="0.5"
                          UseFrameDurations="True"
                          FallbackFrameRate="30"
                          IsPlaying="{Binding IsAnimating, Mode=TwoWay}"
                          Stretch="Uniform"
                          StretchDirection="Both" />

Code-Behind

var control = new AnimatedWebPControl
{
    Source = "path/to/animation.webp",
    AutoStart = true,
    Loop = true
};

// Programmatic control
control.StartAnimation();
control.StopAnimation();
control.Reset();

Loading Frames Programmatically

control.LoadAnimation(myWebPFrames);

API Reference

Properties

Methods

Read-Only Properties

Source Resolution

The Source property resolves paths in the following order:

1. Avalonia resource -- URIs starting with avares://
2. Absolute file path -- Rooted file system paths
3. Relative path -- Resolved against:
   • Application base directory
   • Current working directory
   • Entry assembly Avalonia resources (as fallback)

Project Structure

src/WebPAnimationControl/
├── Controls/
│   └── AnimatedWebPControl.cs       # Main Avalonia control
├── Models/
│   ├── AnimationSettings.cs         # Loop/frame-rate configuration
│   └── WebPFrame.cs                 # Single frame data (SKImage + duration)
└── Services/
    ├── IWebPDecoderService.cs       # Decoder interface
    └── SkiaWebPDecoderService.cs    # SkiaSharp-based decoder

Dependencies

Setup (Development)

git clone <repository-url>
cd webp-source-control-animation
dotnet restore
dotnet build

Run the sample app:

dotnet run --project src/TestApp

Contributing

Contributions are welcome! Please feel free to submit a pull request or open an issue.

License

This project is licensed under the MIT License. See the LICENSE file for details.