为Avalonia应用添加图标

流年似水柔情 / 04-02 / 10点赞 / 0评论 / 152阅读
## 前言 为了让自己开发的应用更加好看,开发者往往需要增加一些图标。 本文分享在开发Avalonia应用时如何为应用增加图标,希望可以帮助到正在学习使用Avalonia并有此需求的开发者。 ## 实践 经过搜索调用发现这个项目可以很好地解决该需求。 ![image-20250402090751387](https://cdn.res.knowhub.vip/c/2504/03/b7aded53.png?G1cAAMTydJz4c15gG3X4NlEkNAMWaQSVEtbrvXefJvL9RlD9M%2ftYdj78po9lElkKFUIwQeECiKolBmh1gUmzVuTk9zQ%3d) 先运行该项目的Demo看看效果。 ```cmd git clone https://github.com/SKProCH/Material.Icons.git ``` 将Avalonia.Demo设置为启动项目。 ![image-20250402090946590](https://cdn.res.knowhub.vip/c/2504/03/6903e5ca.png?G1cAAMTydJz4c558u406fJsoEpoBizSCSgnr9Z6z9i3y%2fU5Q4zNan74%2f%2fKb16ZJpRoUQLFCEAOJSywmoIRUzJAI5ruE%3d) 就可以看到项目包含的所有图标。 ![image-20250402091126907](https://cdn.res.knowhub.vip/c/2504/03/1bf70162.png?G1cAAMTydJz4c17qu406fJsoEpoBizSCSgnr9Z6z9i3y%2fU5Q4zNan74%2f%2fKb16ZJZKxVCsEARAgjTmhOgIUHV7CqW4hoO) 后面直接打开exe文件就行。 现在打开自己的Avalonia项目。 下载这个包。 ```cmd dotnet add package Material.Icons.Avalonia ``` 打开App.axaml。 ```xaml ``` 打开需要使用图标的页面。 添加: ```xaml xmlns:materialIcons="clr-namespace:Material.Icons.Avalonia;assembly=Material.Icons.Avalonia" ``` 以为Button添加图标为例: ```xaml ``` 实现效果: ![image-20250402092415352](https://cdn.res.knowhub.vip/c/2504/03/960c8a21.png?G1YAAETd9Ly0Ia2s7jvd0Q2cCtoMSGQRVEpYr%2fectW%2bR7w%2bClp%2fR%2boz94S%2btzxClOw1CsMCQPIhqrqhekrKoXqjMawQ%3d) 现在的关键在于如何寻找合适的图标。 以Chat相关的图标为例。 打开刚刚的那个Demo,输入chat,并点击选择的图标一下。 ![image-20250402092714472](https://cdn.res.knowhub.vip/c/2504/03/ee81531c.png?G1cAAMTsdJxI8kKj26hD2jvFHc2ARRpBpYT1es9Z%2byb6fgdD4zNan74%2f%2fKb16ZRgBmUCI7MiBAZXtSSMK4iIlWoFJa7h)
相关资源
为Avalonia应用添加图标Demo
查看内容