资讯专栏INFORMATION COLUMN

UDesign 组件更新 | 近期优化迭代

ernest.wang / 1448人阅读

摘要:一日期时间相关组件改版月初对日期时间相关组件交互上进行了一波大更新,主要是为了减少用户的操作成本,减少展示占用面积。单日期范围选择器中选择日期后,自动跳转至下一个框进行选择,都选择完成后自动确认。单日期范围选择器中使用双面板展示。

一、日期时间相关组件改版(DatePicker、TimePicker)

6 月初对日期时间相关组件 DatePickerTimePicker 交互上进行了一波大更新,主要是为了减少用户的操作成本,减少展示占用面积。

背景/现状

原先确定操作过多、体验比较复杂,其次样式上字体小、组件整体尺寸又偏大,窗口缩放时日历面板自适应定位体验不好,且内容可读性差。

优化逻辑和效果

  1. 在单日期选择确认时取消了确定按钮,点击日期后自动确认。

  2. 单日期范围选择器中选择日期后,自动跳转至下一个框进行选择,都选择完成后自动确认。

  3. 单日期范围选择器中使用双面板展示。

  4. 范围选择器添加选中范围展示条。

  5. 减小格子间隔、缩小面板大小。

  6. 增加清空按钮逻辑。

  7. 取消底部的快捷选择项。

还有一些细节上的调整如:范围选择器选中一个时间节点后另一个节点会按照前一个选中的节点来禁用部分事件等。

二、选择器组件改版( Select )

7 月初对 Select 组件进行了改版,主要为了确定后续 Select 组件的定位:只负责简单内容的选择,如列表项多、存在层级时需使用其它方案来替代。

背景/现状

原先多选结果展示可读性差,全选以及搜索功能下的全选逻辑复杂,实际效果与客户期望不一致。

优化逻辑和效果

  1. 搜索框与选择器进行合并,不再放到下拉区域。

  2. 搜索增加高亮展示。

  3. 全选勾选变更为按钮。

  4. 增加清空按钮。

  5. 多选增加了 tag 展示。

由于本次改动中交互存在与之前版本不兼容的问题:搜索区域、新版不支持多层数据结构,顾依旧保留之前的版本,在识别到配置不兼容时自动切换为旧版本:

  • 在使用了 renderSelector 并且需要搜索时

  • 使用了 Group 时

其它还有一些细节变动:如下拉最小宽度默认为选择器的宽度,搜索压缩 tag 展示等,选择后清空搜索等。

三、ActionList 增加自动伸缩功能

由于控制台中很多产品的表格中存在操作按钮列宽度与实际宽度不太匹配的情况,导致操作按钮折行的现象,因此在 ActionList 中添加了自动伸缩功能,使用 autoAdjustment 后 ActionList 会根据列宽自动调整展示数量,最多为 exposeCount,该参数在控制台中为默认启用。

如果在宽度确定时不建议使用该参数,因为自动调整需要不断重绘来测试可放置的数量,而表格中操作列都较多,一定程度上会影响性能。

四、其它更新

其它还有一些小更新如:

  1. 新增 Skeleton 组件

  2. Table 组件 中增加 columnResizable。



文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/127450.html

相关文章

  • iView 近期更新,以及那些“不为人知”的故事

    摘要:如图所示还有其它很多项的更新,比如新增属性,可以设置面板展开时默认显示的日期。目前最新版本支持键盘可访问性的组件有。期待你的加入下个版本预告下个版本计划重构组件,以全面支持表单组件的键盘可访问性,敬请期待。 在过去的两个多月里,iView 陆续发布了 2.9.0 和 2.10.0 两个重要版本。这两个版本总共有 255 个 commit,超过 40 项更新。来看一下,iView 具体都...

    UsherChen 评论0 收藏0
  • 产品的金钥匙:一致性

    摘要:为什么第一张图片没有出现可口可乐的产品图片产品介绍等信息,但我们还是可以分辨出可口可乐其实这都是因为可口可乐有一套高一致性的系统。产品一致性主要指产品的设计理念、品牌形象、逻辑结构、操作交互以及视觉形象等设计基因能够在设计中较好的保持一致和统一。通过采用用户熟悉的交互模式、视觉元素,使处于不同平台、不同设备的一个产品可以让用户顺利地解决问题。用户在这个过程中根据以往的经验,以他们理解的方式去...

    ernest.wang 评论0 收藏0
  • 阿里HBase的数据管道设施实践与演进

    摘要:摘要第九届中国数据库技术大会,阿里巴巴技术专家孟庆义对阿里的数据管道设施实践与演进进行了讲解。它必须在把风险做完,风控是根据长期的历史信息近期历史的信息和实时的信息三个方向做综合考量。 摘要:第九届中国数据库技术大会,阿里巴巴技术专家孟庆义对阿里HBase的数据管道设施实践与演进进行了讲解。主要从数据导入场景、 HBase Bulkload功能、HImporter系统、数据导出场景、H...

    LMou 评论0 收藏0

发表评论

0条评论

ernest.wang

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<