Avalonia: [Question] Platform-specific window decoration support

[0xFireball]

Does Avalonia support any kind of platform-specific window decorations?
The MahApps.Metro Window border style would be an example of what I mean. In my opinion, the default window decor on Win10 is quite ugly and boring, while the MetroWindow has a nicer look.
My question pertains mainly to the Windows platform; the default window decor on macOS/Linux isn't an issue.

In addition, do you plan to add a built-in dark theme? I do understand that it isn't to hard to make a custom one, but was wondering if there might be an official one in the future.

[grokys]

There's nothing currently in Avalonia to do a metro-style window, but it is possible - you can take a look at Avalon Studio's implementation: https://github.com/VitalElement/AvalonStudio/blob/master/AvalonStudio/AvalonStudio/Controls/MetroWindow.cs

Avalon Studio also has a dark theme that @danwalmsley has said he was going to contribute to Avalonia itself. Any progress on that Dan?

[danwalmsley]

@0xFireball You can easily hide the window chrome on all platforms by setting

<Window HasSystemDecorations=false... />

Though you have to implement your own titlebar. You can use the AvalonStudio example as @grokys has suggested.

https://github.com/VitalElement/AvalonStudio/blob/master/AvalonStudio/AvalonStudio/Controls/MetroWindow.paml

Shows the Template needed to do that.

@grokys I will try and get back onto Dark theme, sorry its been delayed just getting the time to work on it has been difficult recently.

[0xFireball]

Interesting, thanks.

[0xFireball]

I managed to get a style like this:

It's heavily based on AvalonStudio's theme, but with some minor tweaks.

[0xFireball]

Hello,
I'm actually having some trouble with extending the TextBox control.

In WPF, you can do something like this:

using Avalonia.Controls;

namespace MirrorEdit
{
    public class MirrorEditor : TextBox
    {
    }
}

And then you can include the custom control in your XAML and everything should work fine. However, instead of a textbox, I'm getting a large, dark region and an exception from Interactivity when I click the control. What am I doing wrong? I'm including the control just as I would in WPF, with a xmlns. The control seems to be loading fine into the window; it just isn't rendering as I expected.

[danwalmsley]

@0xFireball that's because you need to add a Template and load theme. Or override the Render method and draw in there.

Depends what you want to do with it, do you want to manually render your control, or just use a custom template?

[danwalmsley]

@0xFireball here is an example of a template:

https://github.com/VitalElement/AvalonStudio/blob/master/AvalonStudio/AvalonStudio.TextEditor/TextEditor.paml

[danwalmsley]

here is an example of adding the template to a theme...
https://github.com/VitalElement/AvalonStudio/blob/master/AvalonStudio/AvalonStudio.TextEditor/TextEditorTheme.paml

[danwalmsley]

If you make any improvements to the metro window, id be interested in seeing them ;)

[grokys]

@0xFireball the difference here is between WPF and Avalonia. In WPF you have to explicitly update the style key if you subclass a control; in Avalonia it's the opposite - you have to specify the style key if you want to use the base class' style. To use the TextBox style in your control, add this line to your subclass:

Type IStyleable.StyleKey => typeof(TextBox);

[0xFireball]

@danwalmsley https://github.com/0xFireball/nkyUI

[0xFireball]

Does Avalonia support anything like Triggers? For defining custom style changes in Xaml?
Update: I just realized that Avalonia uses the metaclasses thing, so I can just override Button:pressed.

[0xFireball]

How do I bind to the Icon from the main window?
Currently, I'm using this, without success:

                          <Panel Height="20" Width="20" Name="icon" Background="LightGray">
                            <Image Source="{TemplateBinding Icon}" Stretch="Fill" />
                          </Panel>

The image seems to be empty, and I only see the blank panel. The actual window is loading the Icon fine, and the icon is being displayed in the taskbar, just not in my custom binding.

[jkoritzinsky]

@0xFireball Triggers are in the Avalonia.XamlBehaviors project.

Window Icons are of a different type than type of Image.Source in Avalonia. We don't currently have a conversion between the two built in. Can you make a new issue for that so we can add it as a feature?

[grokys]

Closing this as it looks like your question has been answered :)