MahApps.Metro.IconPacks在Avalonia平台下的替代方案

在Windows平台使用WPF开发应用的时候,经常会使用MahApps.Metro.IconPacks来显示小图标。
但是这个控件不支持跨平台,不能在Avalonia平台下使用。所以需要寻找替代方案。
同一个开发者出一个库:
https://github.com/MahApps/Avalonia.IconPacks
看着有打算移植到Avalonia平台下,但现在这个库里是空的。

目前几种替代方案,但貌似都没有MahApps.Metro.IconPacks用着顺手。

HeroIcons.Avalonia

安装:

Install-Package HeroIcons.Avalonia

添加引用:

xmlns:heroIcons="clr-namespace:HeroIconsAvalonia.Controls;assembly=HeroIconsAvalonia"

使用图标控件:

<heroIcons:HeroIcon Foreground="White" Type="Pencil" />

指定图标的颜色:

<heroIcons:HeroIcon Foreground="White" Type="Pencil" Foreground="White" Kind="Solid" />

图标的大小默认是24个象素,如果要调小成20象素,把Min设置成True:

<heroIcons:HeroIcon Type="Pencil" Foreground="White" Kind="Outline" Min="True"/>

这个控件的使用方式倒还是简单,但是查找图标还是有点麻烦。还是不太会用。不像IconPacks直接提供一个直接查找的工作。
https://github.com/russkyc/heroicons-avalonia

Projektanker.Icons.Avalonia

安装:

Install-Package Projektanker.Icons.Avalonia
Install-Package Projektanker.Icons.Avalonia.FontAwesome
Install-Package Projektanker.Icons.Avalonia.MaterialDesign

需要先在应用入口注册一下:

class Program
{
    // Initialization code. Don't use any Avalonia, third-party APIs or any
    // SynchronizationContext-reliant code before AppMain is called: things aren't initialized
    // yet and stuff might break.
    public static void Main(string[] args)
    {
        BuildAvaloniaApp()
            .StartWithClassicDesktopLifetime(args);
    }

    // Avalonia configuration, don't remove; also used by visual designer.
    public static AppBuilder BuildAvaloniaApp()
    {
        IconProvider.Current
            .Register<FontAwesomeIconProvider>()
            .Register<MaterialDesignIconProvider>();

        return AppBuilder.Configure<App>()
            .UsePlatformDetect()
            .LogToTrace();
    }
}

添加命名空间引用:

xmlns:i="https://github.com/projektanker/icons.avalonia"

使用图标控件:
单独使用:

<i:Icon Value="fa-brands fa-anchor" />

按钮中使用:

<Button i:Attached.Icon="fa-brands fa-anchor" />

菜单中使用:

<MenuItem Header="About" i:MenuItem.Icon="fa-solid fa-circle-info" />

设置应用的图标大小:

<i:Icon Value="fa-brands fa-anchor" FontSize="24" />

动画:

<i:Icon Value="fa-spinner" Animation="Pulse" />
<i:Icon Value="fa-sync" Animation="Spin" />

使用起来还行,不过用什么图标的话,名称需要去网站上搜索。

https://github.com/Projektanker/Icons.Avalonia

posted @ 2024-05-25 13:12  wzwyc  阅读(46)  评论(0编辑  收藏  举报