虽然Ant Design 4已经在2月份就推出了，而且相关文档已经到4.3.3了，可是我到现在才稍有闲暇时间下载来看看。本文首次发布在“xuesketch”公众号上。

虽然Ant Design 4已经在2月份就推出了，而且相关文档已经到4.3.3了，可是我到现在才稍有闲暇时间下载来看看。

以前我吐槽过Ant Desing的组件看起来很全，用起来很傻（移动端更傻），我还自己修改过一版发出来了。当初是3.0，如今是4.0，理论上应该会把那些不足都修复了吧，但是官方没详细说，只是说

“

使用全局的图层样式、文字样式进行管理，支持智能布局 (需要Sketch58版本以上，建议升级)

新增了「暗色模式」，新增了icon图标 https://ant.design/components/icon-cn/   

”

我想自己体验一下再把感受给大家分享出来。本次体验的计划是：

1. 了解全局图层样式、文字样式；

2. 了解智能布局；

3. 了解暗色模式；

4. 了解3.0欠缺的组件和细节是否完善。

• 全局样式

我看了一下，确实是以Color和Container为一级分类做了全局的图层样式，Color下设Dark、Grey、Light三个二级分类，再往下就是根据颜色的种类和深浅来分类了，这里的图层样式可以在任何一个组件上套用。

文字全局样式也是可以看到能正常使用的。而且从分类来说，也确实更加直观了。

• 智能布局

我理解的智能布局大概就是能按照实际应用场景模拟尺寸变化时的内部元素的相对位置布局，此前就遇到过3.0里面很蠢的布局设定，也就是利用sketch的resize功能来实现的。本次我随机挑选了几个典型组件来做了一下试验，结果如下图。

可以看到，侧边栏菜单、次按钮、下拉菜单是可以的；而主按钮、标题录入标题则还是没有做好（我又有事做了）。

• 暗色模式

直接把上图的底色改成深色，然后把组件替换成深色主题后，可以看到所有的深色组件都做了调整，包括主按钮的明度也都降低了。但是resize还是没做好，依旧延续了亮色主题的问题。

通过第2和第3条，可以得出，3.0遗留的问题还是没有得到改进。而且，带有图标的按钮现在不能换图标了...

Powered by Froala Editor