AvaloniaUI: features on the example of MessageBox

Avalonia ui is a delightful framework that you want to come back to again and again. So let's go back to it again and look at some features along with my message box.

Let's talk about the features and chips avalonia

Obviously, if there are comparisons, then it will be compared with wpf.

The first thing that catches your eye after ms frameworks is the ability to bind commands to methods. Yes, functionally this gives fewer opportunities, but in response simplifies the approach to developing a view model.

Do the thing!

public void RunTheThing(string parameter)
{
            // Code for executing the command here.
}

Avalonia is also built using reactive extensions, which allows you to work with events of the framework as objects of the first class using the declarative syntax of LINQ queries - allowing you to write concise and readable code.

But going a little deeper, everything becomes not so rosy and obvious, and the documentation has not yet been brought to mind (but you can help).

Binding to image

The problem I met almost immediately when updating my project was how to display images on my window.

First of all, you need to register a directory with images as an Avalonia resource, because it is important that any user displays the icons and conveniently packs them with all the code.

        ...
        

Now in the image tag you can easily set the selected image.

But when using vm Source, images cannot be simply attached to a string, but Bitmap must be used.

 public Bitmap ImagePath { get; private set; }

And accordingly now we need to extract our image from the resources. Why use the Avalonia locator?

ImagePath = new Bitmap(AvaloniaLocator.Current.GetService()
                    .Open(new Uri($" avares://ASSEMBLYNAME/relative/project/path/{ImageName}.ico")));

It is worth noting that for embedded resources when compiling uri, the prefix resm: // is used , and for avalonia - avares: // .

Painting

The shapes in avalonia and wpf are similar, but the public properties are different. Therefore, downloading svg images and converting them using mskam to ms xaml, they could not be used right away.

Custom figure

Turns into:

A line:

Turns into:

Styles

About the styles themselves enough is said in the documentation . It is worth noting that these are familiar styles with a little css. I wanted to show how to apply the style from a separate file. Firstly, all xaml files must be avalonia resources.

Designer
      .....
    

Secondly, styles are applied in the same way as image resources using uri and locator.

YourControl.Styles.Add(new StyleInclude(new Uri("avares://ASSEMBLYNAME/relative/project/path.xaml")){Source = new Uri("avares://ASSEMBLYNAME/relative/project/path.xaml")});

Pleasant trifles

TextBox has the Watermark property. This allows you not to search for third-party packages and not to block TextBlock on top of TextBox, which can be read in many tutorials for wpf.

And also all binders use PropertyChanged by default to trigger the update of a related property.

Finally

I suggest everyone to try this interesting framework. Thanks to users of Artyom Gorchakov and Nikita Tsukanov .

And I remind you that avalonia has a cozy and amazing support at Gitter .