为什么捐赠
API 浏览器
联系站长
时间线

QTimeline 组件按时间顺序显示事件列表。它通常是一个图形设计,显示一个长条形图,在其旁边标注日期,通常是事件。时间线可以使用任何时间尺度,具体取决于主题和数据。

QTimeline 有 3 种布局:

  • dense (默认) 在时间线的时间线指定侧(默认是右侧)显示头部,标题,副标题和内容。
  • comfortable 在时间线的时间线指定侧(默认是右侧)显示头部,标题和内容,在另一侧显示副标题。
  • loose 在中间显示头部,在条目指定侧(默认在右侧)显示标题和内容,在另一侧显示副标题。

QTimeline API

正在加载 QTimeline API...

QTimelineEntry API

正在加载 QTimelineEntry API...

用法

基础

基础



仅使用属性

下面是相同的示例,但仅使用 QTimelineEntry 属性而不是默认插槽:

仅使用属性



仅使用插槽

下面再次是相同的示例,但仅使用 QTimelineEntry 插槽:

仅使用插槽



暗色设计

强制暗色模式



布局和侧面选择

WARNING

QTimelineEntry 仅在 QTimeline 具有 loose 布局时才会考虑其 side 属性。

布局和侧面选择



响应式

TIP

下面的示例使用 $q.screen 检测窗口大小的变化,以查看所有 3 种布局的效果。

响应式布局



Basic



Props only



Slots only



Force dark mode



Layouts and side selection



Responsive layout