.NET 跨平臺框架Avalonia UI: 填坑指北(一)：熟悉UI操做

時間 2020-08-17

標籤跨平臺框架 avalonia 熟悉简体版

原文原文鏈接

Avalonia 是一個跨平臺的 .NET UI 框架，支持 Windows、Linux、Mac OSX... (以及Android IOS soon..)html

本篇主要介紹Avalonia開發過程和Linux適配環節的幾個疑難點..linux

avalonia for vs安裝和.deb安裝包部署可參考:http://www.javashuo.com/article/p-advnabkn-mv.htmlapp

與WPF相似，Avalonia使用XAML來設計UI...但也有幾處比較坑的地方，如下作一些梳理:框架

1.基本的使用方法

axaml中定義後臺找到並設置對象

在WPF中，當你在xaml文件中定義完UI並設置x:Name就能夠在後臺中直接使用對象名稱進行操做.那是由於vs在你設計時自動生成了.g.i.cs文件(你能夠在/obj中看到)佈局

而ava中不一樣，你須要在後臺中本身Get到這個UI對象(與Android相似): 例如:ui

axaml中定義一個名稱爲 TB_Title的TextBlock文本標籤:this

<TextBlock x:Name="TB_Title" HorizontalAlignment="Center" Foreground="White" FontSize="14" VerticalAlignment="Center" Margin="10,0,0,10" Text="My Avalonia Desktop App"/>

在cs中定義並更改標籤內容:spa

TextBlock TB_Title = this.Get<TextBlock>("TB_Title");
TB_Title.Text = "嘻嘻";

這裏就用到了this.Get<T>(string Name)方法.net

T:表示對象類型 Name:爲x:Name中定義的名稱設計

注意:在後臺查找UI對象若不是局部變量應需考慮時序問題不然在使用時對象多是null

建議將全部的控件優先查找出來(若是你控制得比較好能夠不用..)

事件

詳細的介紹能夠看官方文檔:http://avaloniaui.net/docs/input/events

有幾點比較坑的地方:

1.直接在axaml中定義事件有時候不會成功,能夠在後臺中定義,例如:

<Button x:Name="btn" Click="Btn_Click">Click Me</Button>

void Btn_Click(object sender, RoutedEventArgs args)
{
   //...
}

若不成功能夠:

this.Get<Button>("btn").Click+=Btn_Click;

---------------------------------------

2.WPF中的MouseDown/Up事件和Preview事件哪去了?

ava中替換成了 Tapped(輕敲?) 事件

以及 PointerPressed (指針按下至關於WPF 中的MouseDown) 和 PointerReleased (指針釋放至關於WPF中MouseUp)

爲控件註冊一個Preview事件:

你的控件名.AddHandler(PointerReleasedEvent,事件名稱, RoutingStrategies.Tunnel);

----------------------------------------

3.竟然沒有MessageBox....(能夠到nuget中下載第三方的包)

2.神奇的UI佈局

在avalonia中StackPanel是有問題的，它並不會爲每個控件設置寬度或高度而是優先控件（WPF中不是這樣）：

舉個例子:

例如在StackPanel中放置若干個TextBlock,你會看到TextBlock延伸到了StackPanel外部而並無按照stackpanel的寬度來...

ava中的模式是這樣:

若是控件原寬度沒有超出則設爲stackpanel的寬度

若是超出了...就隨它去吧......(??)

此時你就須要手動設置寬度(兩種方法):

1.設置綁定: Width="{Binding Width , ElementName=MyStackPanel(是控件x:Name)}"

2.在後臺遍歷設置寬度:

ava中並無給SizeChanged的事件而是將全部依賴屬性改變的事件放到了一個：

 PropertyChanged += MainWindow_PropertyChanged;

 private void MainWindow_PropertyChanged(object sender, AvaloniaPropertyChangedEventArgs e){
    if (e.Property == WidthProperty){
       foreach (Control a in e.Children) {
          a.Width = Width;
       }
    }
  }

(十分嫌棄 ..)