Avalonia（五）使用其他主题来写一个待办事项软件

type

status

date

slug

summary

前言

我们之前都是使用Avalonia自带的主题去写，感觉对于新手来说有点难（因为要好看的话得自己去写大量的风格跟自定义主题）。不过Avalonia的社区也有大量优秀的控件主题库。这次我们使用的是FluentAvalonia。

我个人还是比较喜欢这个控件主题库的。不过有个缺点就是图库资料有点少。

添加FluentAvalonia到项目中

我们需要将FluentAvalonia引用到项目中才可以使用:

从Nuget上下载

在终端上输入:

或者在Rider跟VS上搜索：FluentAvaloniaUI

在App.axaml中引用主题

在App.axaml上删除Avalonia自带的主题，添加FluentAvalonia的主题：

现在我们可以简单尝试一下：

我们尝试写一个Todo应用

这次我们不打算写什么EF什么的，就只是单纯的写个软件。毕竟这是Avalonia教程，不是数据库教程。

不妨让我们先想想这个应用应该长什么样子：

有一个主页用来介绍软件

左边为待办列表，右边为待办详情

左边待办列表分为上中下：上层为返回框，中间是数据列表，下面是添加按钮

右边详情从上至下分别为：待办名称，时间，详情说明

那基本上就先这样

Model

这次因为只需要写一个TodoModel，所以代码非常简单:

ViewModel

View

我们按照上面的来的话，那么我们的代码就应该是这样的：

我们这里使用Frame来作为我们显示详情的控件。

使用TaskDialog来添加待办

我们这里使用TaskDialog这个对话框容器来进行添加操作。

不过既然是容器，就得有相应的内容控件，这个是要我们自己写的。所以我们创建一个控件AddTodoDialog，代码如下:

然后在axaml.cs中添加一个方法:

同时在MainWindow中的按钮添加点击事件：

现在可以看看效果：

使用Frame面板

要使用Frame，就得先写相关的控件：HomePage跟TodoPage:

HomePage

TodoPage

对数据进行初始化:

将数据接上Frame

我们现在已经把Page的内容写好了，那么现在我们就要去书写Frame的NavigationFactory:

这个NavigationFactory 就类似于数据模板

现在让我们把数据接上：

现在基本上已经搞定了，来看一下：

结尾

现在我们学会了使用主题写应用。

这个系列也先就到这里了，这篇文章主要是Avalonia入门教程，不过也基本上能写一些基本应用了。

🗒️Avalonia（五）使用其他主题来写一个待办事项软件

前言