WinForm ReaLTaiizor UI 的 MaterialTabControl 使用

参考

• https://www.iconfont.cn
• https://www.bilibili.com/video/BV1SqEyz6E2U
• https://www.cnblogs.com/mq0036/p/17912832.html
• https://blog.csdn.net/XX_YZDY/article/details/126404178

环境

软件/系统	版本	说明
Windows	windows 10 专业版 22H2 64 位操作系统, 基于 x64 的处理器
Microsoft Visual Studio	Community 2022 (64 位) - Current 版本 17.13.6
.NET Framework	4.8
ReaLTaiizor	3.8.1.2	ReaLTaiizor 包含了 MaterialSkin 的控件

预览

步骤

1. 创建 WinForm 项目
2. 安装 ReaLTaiizor 库依赖
3. 将窗体继承的类修改为 MaterialForm
   

   using ReaLTaiizor.Forms;
   using System;
   using System.Collections.Generic;
   using System.ComponentModel;
   using System.Data;
   using System.Drawing;
   using System.Linq;
   using System.Text;
   using System.Threading.Tasks;
   using System.Windows.Forms;
   
   namespace WindowsFormsReaLTaiizor
   {
   	public partial class Form1 : MaterialForm
   	{
   		public Form1()
   		{
   			InitializeComponent();
   		}
   	}
   }
   
   

4. 给窗体添加一个 MaterialTabControl 控件，然后添加上需要的菜单项
5. MaterialTabControl 控件 Dock 属性设置为 Fill
6. 选中窗体，将 DrawerTabControl 设置为 MaterialTabControl 控件
   
   
7. 给窗体添加一个 ImageList 控件
   
   1. ImageSize 设置为 32，32
   2. ColorDepth 设置为 Depth32Bit
8. 选中 MaterialTabControl 控件，将 ImageList 属性设置为 ImageList 控件
9. 逐个设置 MaterialTabControl 控件中的 Tab 的显示区域，将 ImageKey 设置为对应的图片
   
10. 选中窗体，设置下面的几个属性，既可在界面正常显示菜单 Icon 了
    1. DrawerAutoShow: True （经过测试该项会出现鼠标选不中导致的奇怪问题）
    2. DrawerBackgroundWithAccent: True
    3. DrawerShowIconsWhenHidden: True