解決WPF+Avalonia在openKylin系統下預設字型問題

踏平扶桑發表於2023-09-21

一、openKylin簡介

openKylin(開放麒麟) 社群是在開源、自願、平等和協作的基礎上,由基礎軟硬體企業、非營利性組織、社團組織、高等院校、科研機構和個人開發者共同創立的一個開源社群,致力於透過開源、開放的社群合作,構建桌面作業系統開源社群,推動Linux開源技術及其軟硬體生態繁榮發展。

“開放麒麟”(openKylin)是中國首個桌面作業系統開發者平臺,由國家工業資訊保安發展研究中心等單位聯合成立,透過開放作業系統原始碼的方式打造具有自主創新技術的開源桌面作業系統。

系統映象下載地址:https://www.openkylin.top/downloads/index-cn.html

二、Avalonia簡介(https://avaloniaui.net/)

Avalonia是一個跨平臺的.NET框架,用於構建漂亮、現代的圖形使用者介面(GUI)。

使用Avalonia,您可以從單個程式碼庫建立適用於Windows、macOS、 Linux、iOS、Android和Web Assembly的原生應用程式。

Avalonia相容所有支援.NET Standard 2.0的平臺。

 Avalonia官方支援下列平臺:

  •  Windows 8 及更高版本(雖然它也能在Windows 7上正常工作)
  •  macOS High Sierra 10.13 及更高版本
在Linux上,下列發行版支援Avalonia:
  • Debian 9 (Stretch) 及更高版本
  • Ubuntu 16.04 及更高版本
  •  Fedora 30 及更高版本

Avalonia11版本的中文官方文件地址:https://docs.avaloniaui.net/zh-Hans/docs/next/welcome

隨著信創、作業系統國產化替換的推廣程式,一些客戶端專案也會有需要轉移到Linux桌面的巨大的市場需求。

目前Linux下桌面程式開發的常見工具的有:QT、Electron、Blazor。而現在WPF有了Avalonia的加持,勢必會在開發原生跨平臺應用時更具有優勢和價效比。

三、VS2022安裝Avalonia開發外掛

首先要安裝visual studio2022的開發工具,然後在頂部選單==>擴充套件中開啟管理擴充套件,安裝以下兩個外掛(注意版本)。

四、openKylin安裝.NET Core環境

在openKylin官方網站上下載映象後,可用虛擬機器進行安裝,安裝後進入到桌面,然後根據微軟官方安裝教程:https://learn.microsoft.com/zh-cn/dotnet/core/install/linux透過指令碼或者下載手動安裝的方法進行安裝.NET Core環境。

需要注意的是,openKylin建立的登入賬戶不具備root許可權,所以在安裝完成後需要配置以下環境變數,否則執行dotnet時會提示沒有這個命令提示。

具體方法是開啟一個終端,然後輸入 

sudo -s

輸入密碼回車,然後終端會變成root許可權的終端,接著輸入下面命令後回車

vim /etc/profile

會開啟一個編輯介面,我們按鍵盤的i鍵進入編輯模式,然後到文件最後插入一行,輸入安裝完.NET Core環境後提示的PATH路徑,比如:

exprot PATH=$PATH:/home/作業系統登入名/.dotnet

然後按esc,輸入:wq回車,儲存退出。隨後重啟OpenKylin系統,重啟後進入到桌面,開啟終端,輸入

dotnet --info

回車,看到.NET Core的輸出資訊,證明安裝和配置.NET Core環境沒有問題。

五、使用VS2022建立Avalonia桌面專案

在安裝完Avalonia外掛和模板後,我們在建立新的專案的時候,可以直接搜尋avalonia關鍵字,直接建立一個Avalonia C# Project,會有建立嚮導,按照嚮導提示一步一步建立完畢。

點選Create按鈕後,稍等片刻即可完成專案建立,我們把建立的帶Desktop結尾的專案設定為啟動專案,然後我們直接F5執行專案,沒有意外的話會看到一個介面,一句英文提示。

六、解決Avalonia桌面專案在openKylin下報Default font name can't be null or empty的問題

 我們把ViewModels\MainViewModel.cs把英文的文字改成中英混合的文字。 

public string Greeting => "歡迎使用 Avalonia!";

點選頂部選單的生成==>釋出選定內容,目標執行時選linux-x64,然後釋出專案。

 釋出成功後,我們把專案複製貼上到openKylin的環境下,然後在終端中定位到專案目錄,執行

dotnet StudyAvalonia.Desktop.dll

 會看到經典的 Default font name can't be null or empty. 的錯誤提示:

 

可見目前它對中文Linux系統的預設字型支援不太好,有的解決辦法是給作業系統設定為英文,但我們國產系統目標群體絕大部分都需要使用中文環境。因此我們在開發專案時自己指定一下專案要用的預設字型來解決這個問題。

這裡我們選用阿里巴巴的免費可商用的字型==>阿里巴巴普惠體:https://www.alibabafonts.com/#/font

下載後按照下面目錄結構放入字型檔案(也可自定義其它路徑,只要程式碼中的路徑做出對應調整即可)

 在Desktop專案中新建兩個類檔案

 FontSettings.cs

public class FontSettings
{
    public string DefaultFontFamily = "fonts:MyDesignFontFamilies#Alibaba PuHuiTi 2.0";
    public Uri Key { get; set; } = new Uri("fonts:MyDesignFontFamilies", UriKind.Absolute);
    public Uri Source { get; set; } = new Uri("avares://StudyAvalonia.Desktop/Assets/Fonts/AliBaba", UriKind.Absolute);
}

AvaloniaAppBuilderExtensions.cs

 1 public static class AvaloniaAppBuilderExtensions
 2 {
 3     public static AppBuilder UseFontAlibaba([DisallowNull] this AppBuilder builder, Action<FontSettings>? configDelegate = default)
 4     {
 5         var setting = new FontSettings();
 6         configDelegate?.Invoke(setting);
 7 
 8         return builder.With(new FontManagerOptions
 9         {
10             DefaultFamilyName = setting.DefaultFontFamily,
11             FontFallbacks = new[]
12             {
13                 new FontFallback
14                 {
15                     FontFamily = new FontFamily(setting.DefaultFontFamily)
16                 }
17             }
18         }).ConfigureFonts(manager => manager.AddFontCollection(new EmbeddedFontCollection(setting.Key, setting.Source)));
19     }
20 }

在Program.cs中註冊一下新建的AppBuilder(.UseFontAlibaba())

 1 class Program
 2 {
 3     // Initialization code. Don't use any Avalonia, third-party APIs or any
 4     // SynchronizationContext-reliant code before AppMain is called: things aren't initialized
 5     // yet and stuff might break.
 6     [STAThread]
 7     public static void Main(string[] args) => BuildAvaloniaApp()
 8         .StartWithClassicDesktopLifetime(args);
 9 
10     // Avalonia configuration, don't remove; also used by visual designer.
11     public static AppBuilder BuildAvaloniaApp()
12         => AppBuilder.Configure<App>()
13             .UsePlatformDetect()
14             .UseFontAlibaba()
15             .WithInterFont()
16             .LogToTrace()
17             .UseReactiveUI();
18 }

 然後在編譯釋出專案,複製到OpenKylin系統中,重新執行,就可以看到可以正常的跑起來了,介面顯示中文沒有問題了。

七、鳴謝:

https://www.raokun.top/archives/ru-he-zai-avalonia11-zhong-she-zhi-zi-ding-yi-zi-ti

https://github.com/MicroSugarDeveloperOrg/AntDesign.Avalonia

八、轉載請註明來源:https://www.cnblogs.com/wdw984/p/17717864.html

相關文章