在易企办中,水平时间轴控件提供了一种动态和直观的方法来展示随时间变化的数据。这种控件非常适用于项目管理、事件时间线展示或任何需要沿时间序列展示关键信息的场景。
业务场景和用途
项目管理:利用时间轴展示项目的关键里程碑和完成阶段,帮助团队成员跟踪进度。
事件规划:显示即将发生的事件或重大活动的顺序,提供清晰的时间规划。
年度规划:企业的年度规划可以通过水平时间轴展示,涵盖各个季度的重点目标、预算安排、以及关键决策节点。
水平时间轴控件是一种高效的工具,用于在表单或自定义页面中以视觉吸引的方式展示时间序列数据。本指南详细介绍如何配置水平时间轴控件的各种属性,以优化数据展示和用户交互。
添加水平时间轴控件
首先,在控件添加面板中找到水平时间轴控件。然后,将其拖放到表单设计器中的某个部分或容器中。
拖放:点击看板控件并将其拖动到您的表单或自定义页面上的期望位置。
此控件可以用于审批表单、数据列表的列表表单和自定义页面,为您在应用的不同领域提供灵活的管理选项。
内容设置
数据
选择水平时间轴控件后,转到设置面板并导航至内容 > 数据。
数据设置:
数据过滤: 点击过滤条件按钮以从选定的数据列表中过滤数据。
设置数据顺序: 确定主要和次要顺序,以正确排序您的数据,确保按照期望的顺序显示。
注意:在设计模式中,只显示前3列,但在预览模式或发布后,将显示实际的列数。
显示
列:设置时间轴的列数。默认情况下,列数设置为3。
查看项目表单:选择是否允许用户查看看板控件中每个项目的详细信息。
默认布局:用户点击项目时,默认打开默认的项目查看页面。
自定义列表表单:如果您设计了特定的查看项目表单,可以从下拉菜单中选择自定义布局。
无:如果您不希望用户打开项目的详细视图,请选择“无”。
自定义URL:您还可以设置自定义URL,当用户点击项目时重定向,允许更高级的交互。
打开方式:选择项目表单的显示方式(例如,滑入、弹出窗口、全页等)。
尺寸: 选择表单显示的尺寸(默认、大、中、小、全屏窗口)。
值为空时隐藏:这个选项允许你设置控件在其值为空时不在界面上显示。
备用:当控件的主要数据源不可用或不显示任何数据时,你可以设置一个备用的显示选项。
显示卡片箭头:选择是否显示可以滚动卡片的箭头。
水平对齐:这个设置决定了时间轴上时间轴的水平位置相对于卡片本身。选项包括:
垂直对齐:这个设置控制卡片相对于时间轴的垂直位置。选项包括:
滚动卡片:选择翻页时滚动卡片的个数,默认为1。
动态显示规则:当您设置动态显示规则时,它会根据特定条件和规则有不同的表现。
隐藏:当满足条件时,此选项将隐藏水平时间轴控件。这对于想要有条件地从用户界面中移除水平时间轴的场景非常有效。例如:如果用户没有被分配任务,您可能想要隐藏控件。
显示:当定义的条件满足时,使用此选项显示水平时间轴控件。这在您只希望在特定情况下显示水平时间轴时非常有用。例如:您可以设置规则,只有当用户具有特定角色或存在特定数据时才显示垂直时间轴。
分页设置
起始于:此选项用于设定时间轴的起始记录点,数值为0表示从数据的第一条记录开始显示,也可以切换为动态文本,与相关变量关联。
仅显示部分记录:当开启时,控件将只展示设定数量的记录,而不是全部记录。
记录限数:打开按钮后,在记录限数中可以输入显示记录的最高数量。
每页记录数:当启用按钮时,此设置用于确定每页或每次加载时显示的记录数量,默认设置为20。这允许用户根据需要调整每页展示的数据量。
如何使用水平时间轴控件
一旦您将数据源与水平时间轴连接,时间轴上放将显示所有集合项的空白块。
空白单元格: 选择数据源后,您会看到横向排列的3个空白网格,每个单元格代表选定数据源中一个项目的容器。空白格的数量会随着您设置的时间轴记录数量变动。
设计模式: 水平时间轴控件将在设计模式中以固定表示形式显示空白单元格。这有助于您预览设计将会呈现的样子。
预览实际数据: 要查看时间轴中的实际数据,请通过点击左侧控件面板底部的“预览”按钮切换到预览模式。这允许您实时查看数据将如何显示。
向单元格添加控件: 要自定义每个单元格,请打开控件面板并将控件拖动到任何单元格中。当一个控件被添加到一个单元格时,它将自动在水平时间轴中的所有单元格中复制。这确保了所有项目中设计的一致性。
当一个控件(如文本、容器、图片等)被添加到水平时间轴的一个块中时,它将自动在每个其他空白块中复制。您可以同时在每个集合块中插入静态或动态内容。
当集合块中的一个控件与数据源连接时,使用表达式编辑器的控件默认内容将被数据源的相应内容替换。
例如,您可以配置集合中的文本控件。然后相应的数据(描述)将自动添加到每个集合块中。
样式设置
卡片
项目间隙:控制每个项目之间的空间量。
间距:控制时间轴与项目之间的空间量。
元素垂直对齐:控制包含的项目将如何根据在方向字段中选择的方向在其中心轴上对齐。
元素水平对齐:控制包含的项目将如何根据在方向字段中选择的方向在其水平轴上对齐。
垂直对齐:在集合容器内元素控件沿垂直均匀分布内容。
水平对齐:在集合容器内元素控件沿水平对齐内容。
内容内边距:设置集合中内容的填充。
常态/悬停:为集合内容的常态和悬停状态设置不同的样式。以下样式支持为常态和悬停状态分别设置。
文字颜色:选择集合容器内文字的颜色。
背景颜色:设置集合容器的背景颜色。
边框类型:选择边框类型,可选无、实线、双线、点状、虚线或槽形。
边框半径:设置边框半径以控制角落圆滑度。
阴影:为每个集合项目添加阴影效果。
显示更多选项:设置显示更多选项的样式设置
箭头:设置箭头的更多样式
节点
文本/图标的排版样式:设置时间轴节点中文本与图标的布局方式,确保信息展示清晰且吸引用户注意。
如果时间轴节点类型设置的是图标,则需要设置图标排版。如果节点类型设置的是文本,则设置文本排版。
点的大小:调整节点点的直径大小,使其与时间轴的整体设计协调。
边框类型和半径:为节点设置边框样式和圆角,增强视觉效果。选择适合的边框样式(如实线、虚线等)和适当的边框圆角大小。
颜色和背景色设置:定制常规/悬停/活动模式下节点的颜色和背景色。
线
标题
外边距和内边距:调整标题周围和内部的空间,确保标题区域的视觉清晰度和整洁性。
排版:设置标题的字体、大小和样式。
边框类型和半径:为标题设置边框,选择合适的边框样式和圆角度。
颜色和背景色:定制标题在常规和悬停状态下的颜色和背景色,使其在时间轴上突出显示。
滑动箭头
尺寸、颜色和背景色:设置滑动箭头在不同状态(常规、悬停、活动)下的尺寸、颜色和背景色,确保箭头在界面上的一致性和功能性。
边框类型和半径:为箭头选择适当的边框样式和圆角。
阴影:为箭头添加阴影效果。
缩进:调整向前箭头和向后箭头的左右缩进,以优化箭头的位置和功能性。
高级设置
设置适用于此控件的高级选项。