.NET跨平臺框架選擇之一 - Avalonia UI

138afe98514e3ba6b153641236d50a02.png

本文閱讀目錄

8a8975957fd88ecde0d1572c17bbeda0.png

1. Avalonia UI簡介

Avalonia UI文檔教程：https://docs.avaloniaui.net/docs/getting-started

隨著跨平臺越來越流行，.NET支持跨平臺至今也有十幾年的光景了(Mono[1]開始)。

但是目前基于.NET[2]的跨平臺，大多數還是在使用B/S架構的跨平臺[3]上；至于C/S架構，大部分人可能會選擇Qt進行開發，或者很早之前還有一款Mono可以支持.NET開發者進行開發跨平臺應用，自微軟收購Xamarin后，今年又正式發布了MAUI跨平臺框架[4]，外加第三方的跨平臺框架Uno[5][Avalonia UI](https://avaloniaui.net/ "Avalonia UI")選擇，技術棧多的炸裂呀。

今天介紹的是Avalonia UI[6]，站長也是研究了好幾天，這是一個基于XAML[7]的跨平臺UI框架，并支持多種操作系統（Windows（.NET Core），Linux（GTK），MacOS，Android和iOS），Web（WebAssembly）。

2. Avalonia UI桌面三大平臺演示

這是Avalonia UI官方網站[8]的一個Demo，站長對部分Nuget包進行了升級，網友【小飛機MLA】對Linux版本修復了字體Bug得以正常運行、演示。

2.1 本文案例

一個音樂專輯搜索、展示小程序，功能如下：

  • 首頁：展示已購買的音樂專輯；

  • 專輯選擇頁：專輯搜索、購買；

2.2 案例資料

案例教程：https://docs.avaloniaui.net/tutorials/music-store-app

案例原源碼：https://github.com/AvaloniaUI/Avalonia.MusicStore

站長升級版源碼：https://github.com/dotnet9/AvaloniaTest/tree/main/src/Avalonia.MusicStore

本文示例體驗下載地址：https://dotnet9.com/avalonia.musicstore/publish.html

2.3 案例演示

Windows 11：

macOS 13：

可安裝Rider（用EAP即可）開發，站長一次性直接編譯運行(站長使用的.NET 7[9]），運行調試過于順暢，與使用MAUI[10]相比不敢相信...

國產麒麟V10操作系統

站長安裝麒麟OS[11]折騰了一會兒，文件傳輸不熟悉（最后使用的百度網盤中轉...），運行命令也不熟（需要給運行程序設置執行權限777），后面是網友【小飛機MLA】解決了Linux字體問題，站長得以開心的運行并錄了視頻分享。

2.4 小缺憾

三個平臺功能相同，只是Linux自定義標題欄未生效，有網友提示可以隱藏標題欄，自己實現控制按鈕（最小化、最大化（還原）、關閉），后面官方應該會解決Linux下這個問題，繼續研究、整！

3. Avalonia UI其他示例

3.1 網友的分享

以下內容摘自博文Avalonia學習實踐(二)--跨平臺支持及發布[12]。

3.1.1 支持的平臺

支持的平臺信息詳細如下：

運行平臺版本
WindowsWindows8及其以上版本（Window7也能用，但不保證沒問題）
MacOSMacOS High Serra 10.13及其以上版本
LinuxDebian 9、Ubuntu 16.5、Fedora 30及其以上（主要是各種發行版）

移動端跨平臺，也就是iOS和Android的支持。

Web支持，即WebAssembly，這是國際標準。

3.1.2 使用Linux內核國產操作系統的情況

操作系統研制單位備注
銀河麒麟天津麒麟信息技術有限公司
中標麒麟中標軟件科技有限公司原中標普華
統信UOS統信軟件科技有限公司
中科方德中科方德軟件有限公司
優麒麟中國CCN聯合實驗室基于Ubuntu發行版

發布選項：

6a744eb68b79dbc604d129a7a4bf2788.png

發布至測試環境（統信UOS、AMD處理器，所以選擇linux-x64）如下：

3297eeaaa430d3a58e20f2810b780a32.png

運行效果如下:

bcf65e3a2cb32a99ba7582122adea037.gif

附.國產CPU指令集路線

國產CPU指令集
龍芯

loongarch(站長注：網友指正是 loongarch，原文是~~MIPS~~)

海光x86
兆芯x86
飛騰arm
鯤鵬arm
申威Alpha

其中龍芯是完全自主的指令集，前段時間也剛剛更新了對.Net[13]的支持；x86主要是生態好，傳統桌面處理器intel、AMD都是x86架構，做兼容適配也方便些；arm以前移動端較多，現在桌面端也逐漸趕上。

3.2 其他示例

示例來自倉庫Avalonia[14]。

0fd628964e3c4f89ebe060119b449603.png

基于Avalonia搭建的項目部分如下：

3.2.1 Lunacy

這是一款免費設計軟件，通過AI工具和內置圖形保持流暢。

項目網站：https://icons8.com/lunacy

442492887d1f1b8c14b4088fb1336c28.png

以下來源于B站的一個視頻：（搬運/英文）使用 Lunacy 設計一個網站首頁！[15]

3.2.2 Plastic

宣傳語：Create without compromise：不妥協地創造

Unity Plastic SCM是一個版本控制和源代碼管理工具，旨在提高團隊協作和與任何引擎的可擴展性。它為藝術家和程序員提供了優化的工作流程，以及處理大型文件和二進制文件的速度。

項目網站：https://www.plasticscm.com/

73709f751d9aa8883dd5867212718a4e.png

3.2.3 WasabiWallet

用于桌面的開源、非托管比特幣錢包。

項目網站：https://www.wasabiwallet.io/

a036055a0c9e5a2472160aa2eebbacfc.png

4. Avalonia UI與WPF

Maui的原生控件從命名、屬性列表看和原生Android類似，但Xaml語法和WPF相同，站長使用Maui原生控件不多，只淺顯地發表這部分看法，不貼相關代碼，Maui學習請點這里[16]。

而Avalonia UI[17]呢，和WPF[18]就幾乎相同了，下面翻譯原文數據綁定部分文檔[19]，熟悉WPF的同學可以對比：

綁定到控件

除了綁定數據到一個控件的DataContext，您還可以綁定到其他控件。

請注意，執行此操作時，綁定源是控件本身，而不是控件的DataContext. 如果你想綁定到控件DataContext，那么你需要在綁定路徑中指定它。

4.1 綁定到命名控件

如果要綁定到另一個命名控件的屬性，可以使用以#字符為前綴的控件名稱(站長注：這里類似前端的css id選擇器，其實Avalonia UI樣式擴展的借鑒大部分來源于前端，站長猜測的哈)。

<TextBox?Name="other"><!--?Binds?to?the?Text?property?of?the?"other"?control?-->
<TextBlock?Text="{Binding?#other.Text}"/>

這相當于 WPF 和 UWP 用戶熟悉的 long-form(長表單)綁定：

<TextBox?Name="other">
<TextBlock?Text="{Binding?Text,?ElementName=other}"/>

Avalonia 支持這兩種語法，但短格式#語法不那么冗長。

4.2 綁定到祖先

您可以使用以下符號綁定到目標的邏輯父級：$parent

<Border?Tag="Hello?World!"><TextBlock?Text="{Binding?$parent.Tag}"/>
</Border>

或者通過向$parent符號添加Index(索引)來傳遞給祖先：

<Border?Tag="Hello?World!"><Border><TextBlock?Text="{Binding?$parent[1].Tag}"/></Border>
</Border>

索引是從 0 開始的，因此$parent[0]等同于$parent.

您還可以按類型綁定到祖先：

<Border?Tag="Hello?World!"><Decorator><TextBlock?Text="{Binding?$parent[Border].Tag}"/></Decorator>
</Border>

最后，您可以組合索引和類型：

<Border?Tag="Hello?World!"><Border><Decorator><TextBlock?Text="{Binding?$parent[Border;1].Tag}"/></Decorator></Border>
</Border>

如果您需要在祖先類型中包含 XAML 命名空間，您可以使用字符:像往常一樣來做到這一點：

<local:MyControl?Tag="Hello?World!"><Decorator><TextBlock?Text="{Binding?$parent[local:MyControl].Tag}"/></Decorator>
</local:MyControl>

Avalonia 還支持 WPF/UWP 的RelativeSource語法，其功能類似但又不相同。RelativeSource適用于可視樹，而此處給出的語法適用于邏輯樹。

關于Avalonia UI的更多用法請點擊這里[20]學習。

5. JetBrains Rider支持

JetBrains Rider現在正式支持Avalonia。對于XAML預覽器添加，支持代碼完成、檢查和重構https://plugins.jetbrains.com/plugins/dev/14839到插件庫并安裝AvaloniaRider插件。

6. 常問問題

翻譯自：Avalonia UI FAQ[21]

6.1 我可以編寫我的UI而不是使用XAML嗎?

是的。您可以使用首選的.NET語言對整個UI進行編碼。

6.2 有可視化拖拽設計器嗎?

不支持。Avalonia IDE擴展支持實時預覽，在您修改XAML時實時刷新呈現UI的預覽，從而替換拖放設計器。

6.3 Avalonia是否支持熱重載?

您可以使用社區項目來啟用Avalonia 的熱重載。

6.4 Avalonia可以與原生API互操作嗎?

是的。

6.5 我可以針對不同平臺進行交叉編譯嗎?

是的。您可以在Windows平臺上，為macOS和Linux平臺編譯目標程序。您可能需要在這些平臺上打包您的應用程序以創建您的應用程 序的發布包。

6.6 我可以使用Avalonia構建移動應用程序嗎?

是的。您現在可以為Android開發，我們有一個預覽展示了iOS支持的開始。但是，您應該仔細考慮每個平臺, 并確保您的應用程序在較小的觸控設備上表現良好。

6.7 我可以用Avalonia建立網站嗎?

它還處于早期階段, 還沒有準備好投入生產，但是是的，你可以。Avalonia現在支持Web Assembly[22]。請參考快速演示: NodeEditor Demo[23]。這意味著您的完整Avalonia應用程序可以在所有現代網絡瀏覽器中運行。

6.8 我怎樣才能參與其中?

查看社區指南[24]，了解如何參與該項目。

6.9 支持哪些Linux發行版?

  • Debian 9 (Stretch)+

  • Ubuntu 16.04+

  • Fedora 30+

Skia 是針對glibc構建的。如果您的發行版使用其他東西，您需要使用SkiaSharp[25]構建您自己的libSkiaSharp.so[26]。我們僅為Intel x86-64提供預編譯的二進制文件。計劃支持ARM/ARM64。

6. 10支持哪些版本的macOS?

macOS High Sierra 10.13+

參考資料

[1]

Mono: https://www.mono-project.com/

[2]

.NET: https://dotnet.microsoft.com/zh-cn/

[3]

B/S架構的跨平臺: https://learn.microsoft.com/zh-cn/aspnet/core/?view=aspnetcore-7.0

[4]

MAUI跨平臺框架: https://learn.microsoft.com/zh-cn/dotnet/maui/?view=net-maui-7.0

[5]

Uno: https://platform.uno/

[6]

Avalonia UI: https://avaloniaui.net/

[7]

WPF XAML: https://learn.microsoft.com/zh-cn/dotnet/desktop/wpf/?view=netdesktop-6.0&viewFallbackFrom=netdesktop-7.0

[8]

Avalonia UI官方網站: https://avaloniaui.net/

[9]

.NET 7: https://dotnet.microsoft.com/zh-cn/learn

[10]

MAUI: https://learn.microsoft.com/zh-cn/dotnet/maui/?view=net-maui-7.0

[11]

麒麟OS: https://www.kylinos.cn/

[12]

Avalonia學習實踐(二)--跨平臺支持及發布: https://blog.csdn.net/lordwish/article/details/124767653

[13]

.Net: https://dotnet.microsoft.com/zh-cn/

[14]

Avalonia: https://github.com/AvaloniaUI/Avalonia

[15]

（搬運/英文）使用 Lunacy 設計一個網站首頁！: https://www.bilibili.com/video/BV1j3411b7G2/?spm_id_from=333.337

[16]

這里: https://learn.microsoft.com/zh-cn/dotnet/maui/?view=net-maui-7.0

[17]

Avalonia UI: https://avaloniaui.net/

[18]

WPF: https://learn.microsoft.com/zh-cn/dotnet/desktop/wpf/?view=netdesktop-6.0

[19]

數據綁定部分文檔: https://docs.avaloniaui.net/docs/data-binding/binding-to-controls#binding-to-an-ancestor

[20]

這里: https://docs.avaloniaui.net/docs/getting-started

[21]

Avalonia UI FAQ: https://docs.avaloniaui.net/misc/faq

[22]

Web Assembly: https://webassembly.org/

[23]

NodeEditor Demo: https://wieslawsoltes.github.io/NodeEditor/

[24]

社區指南: https://docs.avaloniaui.net/misc/community

[25]

SkiaSharp: https://github.com/mono/SkiaSharp

[26]

libSkiaSharp.so: https://github.com/mono/SkiaSharp

本文來自互聯網用戶投稿，該文觀點僅代表作者本人，不代表本站立場。本站僅提供信息存儲空間服務，不擁有所有權，不承擔相關法律責任。
如若轉載，請注明出處：http://www.pswp.cn/news/281062.shtml
繁體地址，請注明出處：http://hk.pswp.cn/news/281062.shtml
英文地址，請注明出處：http://en.pswp.cn/news/281062.shtml

如若內容造成侵權/違法違規/事實不符，請聯系多彩編程網進行投訴反饋email:809451989@qq.com，一經查實，立即刪除！

相關文章

網絡串流_串流NBA籃球的最便宜方式（無需電纜）

網絡串流_串流NBA籃球的最便宜方式（無需電纜）

網絡串流I love NBA basketball. Every year, I get really excited around the beginning of September because I know tip-off is approaching. This year, I also had to figure out how I’m going to watch the Bulls (lose almost every game) with a combination of st…
閱讀更多...
tornado 第一篇

tornado 第一篇

一&#xff1a;異步和非阻塞IO 實時的web特性通常需要每個用戶一個大部分時間&#xff0c;在傳統的同步web服務器中&#xff0c;這意味著需要給每個用戶分配一個專用的線程&#xff0c;這樣的開銷是十分巨大 tornado使用啦一種單線程事件循環的方式&#xff0c;這意味著所有的應…
閱讀更多...
最近找工作面的面試題目匯總（一）

最近找工作面的面試題目匯總（一）

網址&#xff1a;http://www.cnblogs.com/renyiqiu/p/6504839.html 目錄 1.抽象類的介紹&#xff0c;抽象類里的虛函數和抽象函數 參考文檔抽象類特征抽象方法特征2.虛函數和抽象方法 參考文檔虛方法的特點虛方法(virtual)和抽象方法(abstract)的區別3.靜態類和靜態類成員 參考…
閱讀更多...
你認識的C# foreach語法糖，真的是全部嗎？

你認識的C# foreach語法糖，真的是全部嗎？

本文的知識點其實由golang知名的for循環陷阱發散而來&#xff0c; 對應到我的主力語言C#&#xff0c; 其實牽涉到閉包、foreach。為了便于理解&#xff0c;我重新組織了語言&#xff0c;以倒敘結構行文。先給大家提煉出一個C#題&#xff1a;觀察for、foreach閉包的差異左邊輸出…
閱讀更多...
C#對window 硬件類操作，ManagementObjectSearcher

C#對window 硬件類操作，ManagementObjectSearcher

原文轉載&#xff1a;http://blog.csdn.net/da_keng/article/details/50589145 純屬轉載&#xff0c;復制過來方便編程時尋找。感謝作者&#xff1a;I-Awakening復制前補充&#xff1a; 在剛學C#&#xff0c;用ManagementObjectSearcher 竟然不能解析到頭文件&#xff0c;需要手…
閱讀更多...
2018第51周日

2018第51周日

從人們開始用電腦開始就面臨著文件版本控制的問題&#xff0c;從最原始的同一個文檔多個不同命名表示版本到使用本地的文件版本管理&#xff0c;到后面集中式版本管理如2000年的SVN&#xff0c;到再后來的分布式的版本控制系統&#xff0c;如2005年的Git。到現在用的最多的版本…
閱讀更多...
twitter批量取消關注_如何在Twitter上取消阻止“潛在敏感內容”

twitter批量取消關注_如何在Twitter上取消阻止“潛在敏感內容”

twitter批量取消關注Twitter推特Twitter blocks some tweets with a “potentially sensitive content” warning. You can disable this warning—even on an iPhone or iPad, where the option isn’t normally available. You can also disable sensitive content warnings …
閱讀更多...
mysql數值類型總結及常用函數

mysql數值類型總結及常用函數

最近在學習下&#xff0c;總結一下mysql數值類型&#xff1b; mysql字符類型分&#xff1a; 1、整數類型&#xff1a; 字節 值范圍 INTERGER 1 -127-128 SMALLINT 2 MEDIUMINT…
閱讀更多...
Semantic-UI的React實現（二）：CSS類構造模塊

Semantic-UI的React實現（二）：CSS類構造模塊

更簡單的類名標簽 Semantic-UI使用了更簡單的類名聲明。用過Bootstrap的同學都會被其復雜的類名標簽折磨過&#xff0c;例如一個簡單的按鍵樣式&#xff0c;不論顏色或是大小&#xff0c;都需要btn-前綴聲明&#xff1a; <button type"button" class"btn btn…
閱讀更多...
skype自動回復_如何在Windows 10上阻止Skype自動啟動

skype自動回復_如何在Windows 10上阻止Skype自動啟動

skype自動回復Microsoft微軟The Skype app included with Windows 10 now has a notification area icon. That’s great, but what if you never use Skype and don’t want it starting every time you sign in? Here’s how to get rid of it. Windows 10隨附的Skype應用程…
閱讀更多...
Vue 組件實例屬性的使用

Vue 組件實例屬性的使用

前言 因為最近面試了二、三十個人&#xff0c;發現大部分都還是只是停留在 Vue 文檔的教程。有部分連教程這部分的文檔也沒看全。所以稍微寫一點&#xff0c;讓新上手的 Vuer 多了解 Vue 文檔的其他更需要關注的點。 因為 Vue 文檔已經是個很成熟的文檔&#xff0c;并且實現的 …
閱讀更多...
C# 讀取硬盤信息類

C# 讀取硬盤信息類

在編寫工具檢查硬盤信息時&#xff0c;總結常用到的類&#xff1a; Win32_DiskDrive 這個用了檢查整個硬盤的信息&#xff0c;如果電腦只有一個硬盤&#xff0c;那只顯示一條信息。參考如下代碼&#xff0c;AddTextBox為自定義顯示函數。&#xff08;MSDN class 查詢&#xff1…
閱讀更多...
95后滬漂女孩深陷“狠”且“卷”職場，向上思維，永不過時！

95后滬漂女孩深陷“狠”且“卷”職場，向上思維，永不過時！

hi&#xff0c;這里是桑小榆。最近和一個伙伴oncall了很久&#xff0c;對我的文章以及思想轉變產生了很大的共鳴&#xff0c;她向我分享了一些職場經歷還有成長經歷等&#xff0c;她的這些經歷也讓我引發了一定的思考。光光&#xff0c;最近剛升任了部門主管&#xff0c;對于當…
閱讀更多...
PHP：6種GET和POST請求發送方法

PHP：6種GET和POST請求發送方法

在i94web博客中&#xff0c;我試過了暢言和多說兩種社會化評論框&#xff0c;后來還是拋棄了暢言&#xff0c;不安全。 無論是暢言還是多說&#xff0c;我都需要從遠程抓取文章的評論數&#xff0c;然后存入本地數據庫。對于多說&#xff0c;請求的格式如下&#xff1a; // 獲取…
閱讀更多...
解決Ubuntu 16.04下提示boot分區空間不足的辦法

解決Ubuntu 16.04下提示boot分區空間不足的辦法

原文地址: http://www.jb51.net/article/106976.htm　　　https://www.linuxidc.com/Linux/2015-09/123227.htm 因為linux內核一直在更新&#xff0c;更新后&#xff0c;舊的內核就不在使用&#xff0c;但舊的內核文件還在boot里面&#xff0c;占據著空間&#xff0c;更新幾次過…
閱讀更多...
3d鏡頭 適配_您是否應該將鏡頭適配器與無反光鏡相機一起使用？

3d鏡頭 適配_您是否應該將鏡頭適配器與無反光鏡相機一起使用？

3d鏡頭 適配Canon佳能Mirrorless cameras aren’t the future, they’re the present. If you’re switching from an older DSLR, though, the obvious thing to do is just buy an adapter so you can keep using your old gear. 無反光鏡相機不是未來&#xff0c;而是現在。…
閱讀更多...
C#彈窗提示并自動關閉方法

C#彈窗提示并自動關閉方法

剛學C#不久&#xff0c;就寫個工具&#xff0c;總結寫一個簡便自定義提示窗口方法&#xff0c;并自動關閉。 1.在項目添加windows form&#xff08;非user control&#xff09;&#xff0c;命名為Form_wait。 2.在Form_wait,加入需要控件與一個定時器timer1。 數字10為計時顯…
閱讀更多...
dotNET 7：最小 API 使用

dotNET 7：最小 API 使用

最小 API 并不是在 .NET 7 中才加入的&#xff0c;記得應該是在 .NET 6 中就已經提供&#xff0c;只是對我來說&#xff0c;到現在才開始使用。創建一個最小 API在 VS 2022 中創建 WebAPI 項目&#xff0c;不勾選使用控制器&#xff0c;創建出來的就是最小 API &#xff1a;不勾…
閱讀更多...
Taro小程序采坑記

Taro小程序采坑記

Taro&#xff0c;京東凹凸實驗室出品的適配多端的一個框架&#xff0c; Taro 是一套遵循 React 語法規范的 多端開發 解決方案。現如今市面上端的形態多種多樣&#xff0c;Web、React-Native、微信小程序等各種端大行其道&#xff0c;當業務要求同時在不同的端都要求有所表現的…
閱讀更多...
struts入門

struts入門

struts工作過程&#xff1a; 反射代碼&#xff1a; Class clazz Class.forName("action全路徑"); Method m clazz.getMethod("execute"); Object o m.invoke(); package標簽&#xff1a; 轉發&#xff1a;地址欄不變 修改struts默認常量值&#xff1a; 常…
閱讀更多...
最新文章

Copyright @ 2022~2023