kekyo / SkiaImageView

A control for easy way showing SkiaSharp-based image objects onto WPF/XF/.NET MAUI/Avalonia applications.
Apache License 2.0
32 stars 3 forks source link
avalonia control dotnet imaging maui skbitmap skdrawable skiasharp skimage skpicture sksurface wpf xamarin-forms

SkiaImageView

SkiaImageView

Project Status: Active – The project has reached a stable, usable state and is being actively developed.

NuGet

Package NuGet
SkiaImageView.Wpf NuGet SkiaImageView.Wpf
SkiaImageView.Avalonia11 NuGet SkiaImageView.Avalonia11
SkiaImageView.Avalonia NuGet SkiaImageView.Avalonia
SkiaImageView.Xamarin.Forms NuGet SkiaImageView.Xamarin.Forms
SkiaImageView.Maui NuGet SkiaImageView.Maui

Japanese language

What is this?

A control for easy way showing SkiaSharp-based image objects onto UI applications. You can simply bind a SkiaSharp image object to Source property.

SKImageView is a control of SkiaSharp image drawing. You can manipulate same as with WPF's System.Windows.Controls.Image.

Supported SkiaSharp types are: SKBitmap, SKImage, SKPicture, SKDrawable and SKSurface.

XAML example:

<Window xmlns:siv="https://github.com/kekyo/SkiaImageView">
    <siv:SKImageView
        Stretch="Uniform"
        Source="{Binding PreviewImage}" />
</Window>
public sealed class ViewModel
{
    public SKBitmap? PreviewImage { get; set; }

    // ...
}

Fully sample code is here:

Regardless of which platform you use, the usage is almost identical.


Supported platform

WPF

Avalonia

Xamarin Forms

.NET MAUI


Available properties

Name Detail
Source SkiaSharp image related objects. See listed below.
Stretch Stretch enum value
StretchDirection StretchDirection enum value
RenderMode Rendering into back buffer by synchronous or asynchronous.

Source property

The Source property accepts the following SkiaSharp types:

Supported Type Aspect ratio from Note
SKBitmap Origin
SKImage Origin
SKPicture Measured RenderSize
SKDrawable Measured RenderSize
SKSurface Measured RenderSize
string Origin URL string for downloading content
Uri Origin URL for downloading content

Some types are drawn with aspect ratio corresponding to the current measured RenderSize area. Therefore, to maintain the aspect ratio, the size must be explicitly controlled in XAML.

Note: If you specify a URL to display, the URL does NOT accept the WPF resource format. (application: and pack: protocol based.)

RenderMode property

Choose rendering into back buffer by synchronous or asynchronous:

RenderMode Note
Synchronously All rendering process is synchronously.
AsynchronouslyForFetching Defaulted, Will operate asynchronously when giving URL in Source property (string or Uri).
Asynchronously All rendering process is asynchronously.

AsynchronouslyForFetching is defaulted. Because, when set to Asynchronously, all instances given to Source must not be implicitly modified. Maybe, this constraint can be difficult to achieve on your project.


License

Apache-v2.


History