winform第三方界面开源库AntdUI的使用教程保姆级环境设置篇

ops/2025/1/13 3:45:51/
  • 1. AntdUI
    • 1.1. 导入项目
      • 1.1.1. 首先新建一个空白的基于.net的Winfrom项目
      • 1.1.2. 复制AntdUI中src目录到我们的解决方案下面
      • 1.1.3. 解决方案下添加现有项目
      • 1.1.4. 添加项目引用
    • 1.2. 编写代码
      • 1.2.1. 改写Form1类,让其继承自public partial class Form1 : AntdUI.Window
      • 1.2.2. 从工具箱拖入AntdUI.PageHeader控件,设置属性为Dock=Top
      • 1.2.3. 从工具箱拖入AntdUI.Chat.MsgList控件,设置属性Dock=Left
      • 1.2.4. 从工具箱拖入AntdUI.Chat.ChatList控件,设置属性Dock=Fill
      • 1.2.5. 添加图片到资源,设置ico
      • 1.2.6. 重写OnLoad(EventArgs e)函数,做点仿GPT对话的动画效果。
    • 1.3. 效果演示

1. AntdUI

AntdUI是一个开源的Winfrom第三方库,它可以使你的Winform窗体程序更加美观。

项目地址:

https://gitee.com/antdui/AntdUI

1.1. 导入项目

1.1.1. 首先新建一个空白的基于.net的Winfrom项目

文章配图

框架选择.net6

文章配图

1.1.2. 复制AntdUI中src目录到我们的解决方案下面

文章配图

源码下载无法编译?

编译器要求 Visual Studio 2022 以及以上

Visual Studio 安装 旧版本(.NET Framework 4.0 和 4.5)

1.1.3. 解决方案下添加现有项目

右键解决方案,添加现有项目,将AntdUI.csproj工程添加到当前解决方案中。

文章配图

1.1.4. 添加项目引用

现在两个工程都在同一解决方案下,但是MyChat(winform)还是无法引用到AntdUI程序集中的类库,所以需要对MyChat添加项目引用。我们手动修改MyChat.csproj文件,添加Antd项目引用


<ItemGroup><ProjectReference Include="..\src\AntdUI\AntdUI.csproj" /></ItemGroup>

文章配图

因为是手动修改的csproj文件,需要重启vs2022,可以看到MyChat中已经有了项目依赖。

文章配图

打开我们的工具箱。注意: 这里有的小伙伴工具箱可能会一片空白就像这样

文章配图

这是因为没有选中窗体的设计器,我们打开解决方案管理器-- >找到在主窗体文件-- >右击鼠标选择打开设计器-- >然后再次打开我们的工具箱,这样我们就能见到我们需要的组件了。

文章配图

  • ** 工具箱看不到AntdUI选项卡?**

1.需将 AntdUI.csproj 内 TargetFrameworks 只保留自己项目使用的框架版本,删除bin目录后,然后重新生成

2.并且重启VS让其重新加载。这样就能在vs工具箱看到AntdUI的控件了。

文章配图

1.2. 编写代码

代码编写起来很简单,这里只是简单应用一下。

1.2.1. 改写Form1类,让其继承自public partial class Form1 : AntdUI.Window

1.2.2. 从工具箱拖入AntdUI.PageHeader控件,设置属性为Dock=Top

1.2.3. 从工具箱拖入AntdUI.Chat.MsgList控件,设置属性Dock=Left

1.2.4. 从工具箱拖入AntdUI.Chat.ChatList控件,设置属性Dock=Fill

1.2.5. 添加图片到资源,设置ico

1.2.6. 重写OnLoad(EventArgs e)函数,做点仿GPT对话的动画效果。

1.3. 效果演示

短短几行代码就能实现很专业的UI,当然这里我们只是简单应用了一下antdUI库,要想提高编码设计能力,还需要认真研究antdUI的源码实现,看的时候要去思考别人是怎么写的(实现),为什么这么写(设计)。

文章配图

Reference

https://gitee.com/antdui/AntdUI/tree/main/example/ChatUI

http://www.clicksun.cn/mis/bbs/showbbs.asp?id=26670


http://www.ppmy.cn/ops/149633.html

相关文章

25/1/11 算法笔记 Yolov8物体识别

这几天做了给Yolov8检测物体的小任务&#xff0c;今天来做下总结。 首先介绍下整个Yolov8检测的步骤吧&#xff0c;安装库那些就不讲了。 这是我的文件包的对象树。 有images包&#xff0c;里面装了训练和验证的图像。 labels包&#xff0c;装了标注好的labels的txt文件&…

MongoTemplate 性能优化指南

MongoTemplate 性能优化指南 1. 查询优化 1.1 合理使用索引 为经常查询的字段创建索引使用复合索引优化多字段查询避免使用无索引的排序操作 // 创建索引示例 mongoTemplate.indexOps(Collection.class).ensureIndex(new Index().on("field1", Sort.Direction.AS…

【redis】centos7下安装redis7

在CentOS 7下安装Redis7可以通过以下两种方法实现&#xff1a;手动编译安装和使用YUM进行安装。 CentOS 7系统的环境和版本&#xff1a; $ cat /etc/centos-release CentOS Linux release 7.9.2009 (Core)手动编译安装 参考官方文档&#xff1a;https://redis.io/docs/lates…

Jenkins持续集成与交付安装配置

Jenkins 是一款开源的持续集成&#xff08;CI&#xff09;和持续交付&#xff08;CD&#xff09;工具&#xff0c;它主要用于自动化软件的构建、测试和部署流程。为项目持续集成与交付功能强大的应用。下面我们来介绍下它的安装与配置。 环境准备 更新系统组件&#xff08;这…

Docker 容器管理

容器是一个 image 的实例&#xff0c;它是我们用 image 文件生成出来的具体应用。 Nginx 服务器 我们在 pull 一个 Nginx image 到本地电脑&#xff0c;用它举例在介绍一些常用的容器管理命令。 // 获取 nginx 镜像 sudo docker pull nginx// 运行 nginx 镜像 sudo docker r…

在 Ubuntu 22.04 上从 Wayland 切换到 X11的详细步骤

在 Ubuntu 22.04 上从 Wayland 切换到 X11&#xff0c;步骤其实很简单&#xff0c;主要是在登录界面进行选择。以下是详细的步骤&#xff1a; 步骤 1&#xff1a;退出当前会话 首先&#xff0c;点击屏幕右上角的用户菜单&#xff0c;选择 注销 或 退出&#xff0c;以退出当前…

Flutter:吸顶效果

在分页中&#xff0c;实现tab吸顶。 TDNavBar的screenAdaptation: true, 开启屏幕适配。 该属性已自动对不同手机状态栏高度进行适配。我们只需关注如何实现吸顶。 view import package:ducafe_ui_core/ducafe_ui_core.dart; import package:flutter/material.dart; import p…

QT + Opencv 实现灰度模板匹配

QT Opencv 实现灰度模板匹配 实现思路 1.模板创建代码思路 1 初始化和准备&#xff1a; 使用 cv::buildPyramid 函数构建图像金字塔。图像金字塔是一种多分辨率表示&#xff0c;每个层级的图像分辨率逐步降低。 调整 m_TemplData 的大小以匹配图像金字塔的层级数。 计算每…