集合小组件
“集合小组件”是可在集合内包含一系列重复混搭的高级小组件。“集合小组件”使用信息表服务动态定义可视内容。“集合小组件”与“重复器小组件”类似，但包含提供更多选项和更佳性能的多个属性。
 |
“集合小组件”可用于 ThingWorx 8.2 及更高版本。建议您使用“集合小组件”而不是“重复器小组件”。
|
主要功能
• 允许精细控制间距、填充、页眉、页脚、章节、动画等的 60 多个属性
• 包括能够将动态数据添加到每个单元格的功能
• 性能优于“重复器”小组件。为了提高内存使用率，“集合”小组件会缓存大量可视化信息。与“重复器”小组件相比，运行时浏览和滚动更快、更流畅。
可在“集合小组件”中使用以下两种视图：
• 流式布局：响应式、水平换行。此布局与“重复器小组件”最为类似。
• 表格布局：竖直堆栈、每行允许一个混搭。
使用摘要
MashupPropertyBinding 是“集合小组件”中的重要属性。必须给定将信息表字段名称与混搭参数相关联的 JSON 字符串，以便传递数据。例如：
{"events":"eventsName","min_temp":"minTemp","max_temp":"maxTemp","precipitation":"precipitation","image":"image","wind":"wind","sourceType":"sourceType","date":"date","week":"week","id":"rowId"}
可选 MashupGlobalPropertyBinding 使您能够添加定义用于在变量数据中传递的自定义属性 (在“集合”的每个单元格中应显示为相同的属性)，如产品名称。请考虑将其用于以下任意数据：如不使用，则会成为所包含混搭的一部分或在服务中冗余传递到每行 (通过 MashupPropertyBinding)。
MashupGlobalPropertyBinding 使用相同的 JSON 格式，但每个条目必须将唯一的属性名称 (您所定义的) 包含为密钥，将 ThingWorx 基本类型包含为其值 (即 STRING、NUMBER、BOOLEAN)。在 MashupGlobalPropertyBinding 字段外进行选取时，每个条目将为集合小组件提供可绑定的自定义属性。
用数据填充小组件
您可以通过多种方法配置“集合小组件”，以在运行时填充小组件的“混搭”：
• 您可以通过将属性设置为混搭名称来定义混搭。
• 可绑定到 Mashup 名称属性。
• 您可以使用服务提供每个单元格的混搭名称。
• 您可以定义单元格处于选定状态或为空时显示的“混搭”。
已知的浏览器限制
“集合小组件”在 Chrome 和 Firefox 上的执行和加载速度更快。在 Edge 上工作良好。在 Internet Explorer 11 上加载时间较长且性能较低。
属性
|
属性名称
|
说明
|
基本类型
|
默认值
|
是否可绑定?(Y/N)
|
是否可本地化?(Y/N)
|
||
|---|---|---|---|---|---|---|---|
|
Data
|
表示小组件的数据源。
|
INFOTABLE
|
不可用
|
Y
|
N
|
||
|
View
|
布局类型。选项为 Flow 和 Table。流式布局为响应式，表格布局为栅格状，每行允许一个混搭。
|
STRING
|
流式
|
Y
|
N
|
||
|
Mashup
|
将用于数据项的混搭。
|
MASHUPNAME
|
不适用
|
Y
|
N
|
||
|
MashupHeight
|
默认单元格高度。
|
INTEGER
|
120
|
N
|
N
|
||
|
MashupWidth
|
默认单元格宽度。
|
INTEGER
|
400
|
N
|
N
|
||
|
UIDField
|
表示集合项的唯一标识符。应为 NUMBER 基本类型，以便在排序时获得最佳结果。这可以是唯一标识项的任何字段类型。使用现有服务时，如果字段具有选择的“是主键”特性，则应该用于 UIDField。如果未定义主键，请考虑使用服务来将现有信息表组合到包括字段 (将 GUID 或 NUMBER 基本类型设置为主键) 的新信息表。这可能还需要添加包括 GUID 字段的数据形状。
|
INFOTABLE
|
不适用
|
N
|
N
|
||
|
SortField
|
进行设置或绑定时，将标识排序章节内容所依照的信息表字段 (基于 Data 属性)。排序在客户端执行，不会影响源信息表或绑定到数据集的其他小组件。此选项不是必需选项，但不能保证服务每次都回按特定顺序返回行。请考虑将其设置为 UIDField 的相同字段。
|
INFOTABLE
|
不可用
|
Y
|
N
|
||
|
SortAscending
|
配合使用 SortField。启用时，将执行升序排序，否则将执行降序排序。
|
BOOLEAN
|
不可用
|
Y
|
N
|
||
|
SectionField
|
可选。表示用于对各个项进行分组的章节标识符。如果已设置，则项将按章节进行分组。仅支持一个章节。章节将通过 SectionField 中找到的公共值对行进行分组。例如，可能用于将包含周数字段的行分组到周章节。此外，页眉和页脚可用于显示每周的开始和结束位置。
|
INFOTABLE
|
不适用
|
N
|
N
|
||
|
SectionInsetLeft
|
如果使用章节，则该方法可用于将章节内容缩进或从视觉上分离到左侧。
|
INTEGER
|
0
|
N
|
N
|
||
|
SectionInsetTop
|
如果使用章节，则该方法可用于将章节内容缩进或从视觉上分离到顶部。
|
INTEGER
|
0
|
N
|
N
|
||
|
SectionInsetRight
|
如果使用章节，则该方法可用于将章节内容缩进或从视觉上分离到右侧。
|
INTEGER
|
0
|
N
|
N
|
||
|
SectionInsetBottom
|
如果使用章节，则该方法可用于将章节内容缩进或从视觉上分离到底部。
|
INTEGER
|
0
|
N
|
N
|
||
|
LeftAlignFinalRow
|
如果启用，则每个章节的最后一行将对齐到左侧而非居中。
|
BOOLEAN
|
不适用
|
N
|
N
|
||
|
FlowLayoutGravity
|
用于控制单元格在其行内的分布方式。
选项包括：“边”、“间距”、“居中”或“展开”。
边：单元格将对齐到将其包含在内的最近一侧，否则将保持等间距。
间距：单元格和将其包含在内的小组件侧之间保持等间距。
居中：单元格将在可用宽度范围内居中显示，同时在每行显示尽可能多的单元格。
展开：单元格将展开以填充可用宽度，即使超出 MashupWidth 属性设置。
|
STRING
|
不适用
|
N
|
N
|
||
|
FlowLayoutAlignment
|
必须与“流式”布局一起使用。控制将在行中垂直对齐单元格的方法。
此属性可用于控制单元格高度变化时的垂直对齐。通过 CellHeightField 属性从服务中获取单元格高度，或使用 MashupNameField 属性并将 UseMashupDimensions 属性设置为真时，可以预期这种情况。
上：对齐相邻单元格至行顶部。
居中：对齐相邻单元格至行中心。
下：对齐相邻单元格至行底部。
展开：相邻单元格调整高度以匹配最高单元格。
|
STRING
|
居中
|
N
|
N
|
||
|
FlowLayoutContentGravity
|
必须与“流式”布局一起使用。控制内容大小小于集合视图时在集合视图中的垂直对齐方式。
可用选项包括“上”、“居中”和“下”。
上：单元格将从顶部开始填充空间。
居中：单元格将从垂直中心开始填充空间。
下：单元格将从底部开始填充空间。
|
STRING
|
不适用
|
N
|
N
|
||
|
RowSpacing
|
用于控制页眉、行和页脚的间距。
|
INTEGER
|
44
|
N
|
N
|
||
|
MinimumSpacing
|
用于控制单元格之间的最小水平间距/
|
||||||
|
TopPadding
|
用于控制顶部边框与第一项之间的填充。
|
INTEGER
|
22
|
N
|
N
|
||
|
BottomPadding
|
用于控制底部边框与最后一项之间的填充。
|
INTEGER
|
22
|
N
|
N
|
||
|
MashupNameField
|
提供用于数据项的混搭名称。如果设置，此属性将取代 Mashup 和 SelectedFieldMashup 中的选择。
|
||||||
|
PinHeadersToTop
|
如果启用，则当前可见的章节页眉将在滚动查看其内容时粘贴至小组件的顶部边缘。
|
BOOLEAN
|
不适用
|
N
|
N
|
||
|
PinFootersToBottom
|
如果启用，则当前可见的章节页脚将在滚动查看其内容时粘贴至小组件的底部边缘。
|
BOOLEAN
|
不适用
|
N
|
N
|
||
|
MashupPropertyBinding
|
JSON 字符串，用于将信息表字段名称与混搭参数相关联。每个密钥名称应该为信息表字段，用来为每个包含的混搭提供数据。每个值应为绑定到“集合小组件”所含混搭中的小组件的相应混搭参数名称。
例如：
{"events":"eventsName","min_temp":"minTemp","max_temp":"maxTemp","precipitation":"precipitation","image":"image","wind":"wind","sourceType":"sourceType","date":"date","week":"week","id":"rowId"}
|
STRING
|
不适用
|
N
|
N
|
||
|
MashupGlobalPropertyBinding
|
可选。用于创建可绑定自定义属性的 JSON 字符串。此属性可用于动态绑定应在每个所包含混搭中相同的数据，如产品名称、全局状况指示符等。每个密钥名称可以是您想要添加到小组件的任何合法属性名称。每个值必须是进行添加时属性将分配的数据类型，即 "STRING"、"NUMBER"、"BOOLEAN"。在 MashupGlobalPropertyBinding 属性外进行选取且经过验证后，属性将添加到小组件中。在属性窗口中向下滚动或在属性筛选器中键入其名称。这可能用于将数据绑定到自定义特性，以将其传递到小组件所含混搭的混搭参数。
|
STRING
|
不适用
|
N
|
N
|
||
|
CellWidthField
|
要从服务中定义单元格默认宽度的字段。值将取代 CellWidth。
|
||||||
|
CellHeightField
|
要从服务中定义单元格默认高度的字段。值将取代 CellHeight。
|
||||||
|
CellMashupSelectedField
|
可选。如果指定，这表示将接收所绑定对象的选定状态的混搭参数。这使您能够标识用来提供小组件中每个单元格的选择状态的信息表字段。
|
STRING
|
不适用
|
N
|
N
|
||
|
UseMashupDimensions
|
可选。必须与 MashupNameField 属性和静态单元格混搭配合使用。单元格大小将与其包含的混搭相匹配。
|
||||||
|
AllowSelection
|
如果启用，则可以选择单元格，否则，此集合小组件无法选择单元格。
|
BOOLEAN
|
不适用
|
N
|
N
|
||
|
MultiSelect
|
启用多项选择。集合小组件中的多项选择不需要 CTRL + click 或 SHIFT + click。单击以根据需要选择多个单元格，然后单击单元格以取消选择。不支持通过鼠标选择范围。
|
BOOLEAN
|
不适用
|
N
|
N
|
||
|
HasSelectedCells
|
只要在此“集合小组件”中至少选择了一个单元格，即会设置为 true。
|
BOOLEAN
|
false
|
Y
|
N
|
||
|
SelectedCellsCount
|
包含集合视图中的所选单元格数量。
|
INTEGER
|
0
|
Y
|
N
|
||
|
ScrollsToSelectedCell
|
启用所选内容更改，可使得集合滚动至第一个选定单元格。
|
BOOLEAN
|
不适用
|
N
|
N
|
||
|
AutoSelectFirstCell
|
当数据已更新且未选择任何其他单元格时，“集合小组件”将自动选择第一个可用的单元格。
|
BOOLEAN
|
不适用
|
N
|
N
|
||
|
SelectedItems
|
提供绑定以从服务设置当前所选单元格。将在集合中更新多个部分的最新选择。
|
INFOTABLE
|
不可用
|
Y
|
N
|
||
|
SelectedMashupName
|
可选。设置后覆盖 CellSelectedStyle。定义混搭，该混搭将在运行时选择单元格时替换 Mashup 或 MashupFieldName 属性中所定义的混搭。在大多数情况下，SelectedMashup 应具有与默认混搭相同的尺寸。也可能具有部分、所有或更多作为默认混搭的混搭参数。此功能的用例将在选择单元格时提供更详细的数据视图，或显示所呈现数据的附加选择或筛选选项。
|
MASHUPNAME
|
不适用
|
N
|
N
|
||
|
HandleSelectionUpdates
|
如果启用，集合将接收选择更新并传输至数据服务。此操作可以切换数据小组件在混搭更新彼此选择中共享公用服务的常规方法。例如，当您单击栅格行并突出显示绑定到相同服务的图表点。
|
BOOLEAN
|
不适用
|
N
|
N
|
||
|
CellStyle
|
控制单元格的背景。仅使用样式的背景颜色属性。
|
样式
|
不适用
|
N
|
N
|
||
|
CellSelectedStyle
|
控制所选单元格的背景颜色。仅使用样式的背景颜色属性。
|
样式
|
不适用
|
N
|
N
|
||
|
CellHoverStyle
|
悬停鼠标时，控制单元格的背景颜色。仅使用样式的背景颜色属性。
|
样式
|
不适用
|
N
|
N
|
||
|
CellActiveStyle
|
进行选择时，控制单元格的背景颜色。仅使用样式的背景颜色属性。
|
样式
|
不适用
|
N
|
N
|
||
|
RippleEffectStyle
|
这必须与 UseRippleEffect 属性配合使用。仅使用此样式的背景颜色属性，会将其应用至涟漪动画效果。
|
样式
|
不适用
|
N
|
N
|
||
|
UseRippleEffect
|
如果启用，单击单元格时将使用涟漪动画效果。使用此选项会使得单元格将其溢出属性设置为隐藏。涟漪效果仅可见于不包含带背景颜色 (必须设置为透明) 混搭的单元格部分。
|
BOOLEAN
|
不适用
|
N
|
N
|
||
|
CellBorderRadius
|
将应用至单元格的可选边界半径。将此值设置为非空字符串时，例如 12px，单元格会将其溢出属性设置为隐藏。
|
STRING
|
不适用
|
N
|
N
|
||
|
CellBoxShadow
|
当设置为非空字符串时，将用作单元格的框阴影。阴影设置尺寸依照 CSS 框阴影规范和语法：
box-shadow: none|h-offset v-offset blur spread color |inset|initial|inherit;
应相对于间距属性考虑阴影尺寸，以避免阴影与相邻单元格重叠。
|
STRING
|
不适用
|
N
|
N
|
||
|
CellPointer
|
可选。显式设置将鼠标悬停在单元格时的鼠标指针外观，而非取决于默认浏览器光标行为。
|
STRING
|
Auto
|
N
|
N
|
||
|
CellMenuStates
|
可选。提供可通过右键单击单元格进行访问的菜单。菜单选择项由此属性中选择的状态定义进行定义。可用于提供到其他混搭的导航。
|
STATEDEFINITION
|
DefaultMenuStates
|
N
|
N
|
||
|
CellMenuStatesIconSize
|
这必须与 CellMenuStates 属性配合使用。菜单图标将设置为此大小。最大值为 64。
|
INTEGER
|
不适用
|
N
|
N
|
||
|
CellMenuStatesIconGravity
|
必须与 CellMenuStates 属性配合使用。用于控制图标在菜单条目文本中的定位方式。选项包括“靠左”、“靠上”、“靠右”和“靠下”
|
STRING
|
不适用
|
N
|
N
|
||
|
CellMenuStatesOrientation
|
必须与 CellMenuStates 属性配合使用。用于控制菜单条目的布局方式。选项包括“水平”或“垂直”。
|
STRING
|
不适用
|
N
|
N
|
||
|
ShowHeaders
|
如果启用且使用章节，则每个章节都有页眉。
|
BOOLEAN
|
不适用
|
N
|
N
|
||
|
HeaderMashupName
|
用于页眉的混搭，必须与 SectionField 和 ShowHeaders 属性配合使用。页眉混搭应为响应式，以避免布局中的装配不显示滚动条的问题。
|
MASHUPNAME
|
不适用
|
N
|
N
|
||
|
HeaderSectionParam
|
必须在“页眉混搭”中设置的混搭参数，以接收来自 SectionField 属性中所定义集合小组件章节字段的值。
|
STRING
|
不适用
|
N
|
N
|
||
|
HeaderHeight
|
页眉混搭高度。
|
INTEGER
|
44
|
N
|
N
|
||
|
ShowFooters
|
如果启用且使用章节，则每个章节都有页脚。
|
BOOLEAN
|
不适用
|
N
|
N
|
||
|
FooterMashupName
|
要用于页脚的混搭。这必须与 SectionField 和 ShowFooters 属性搭配使用。页脚混搭应为响应式，以避免布局中的装配不显示滚动条的问题。
|
MASHUPNAME
|
不适用
|
N
|
N
|
||
|
FooterSectionParam
|
用于接收章节标识符的混搭参数。
|
STRING
|
不适用
|
N
|
N
|
||
|
FooterHeight
|
页脚混搭高度。这必须与 SectionField 和 ShowFooters 属性搭配使用。
|
INTEGER
|
44
|
N
|
N
|
||
|
EmptyMashupName
|
如果指定，此混搭将在数据集为空时显示。这可能会在搭配使用“日期筛选器小组件”与用来填充“集合小组件”的服务时发生。这可用于显示包含“无结果”消息的混搭。
|
MASHUPNAME
|
不适用
|
N
|
N
|
||
|
PlaysIntroAnimation
|
加载数据后启用单元格的“滑入”过渡动画。
|
BOOLEAN
|
不适用
|
N
|
N
|
||
|
Deselect
|
调用后，集合将取消选择其数据集中的所有行。
|
不可用
|
Y
|
N
|
|||
|
SelectAll
|
调用后，集合将选择其数据集中的所有行。
|
不可用
|
Y
|
N
|
事件
CellMenuStates：CellMenuStates 属性将为添加到“集合小组件”的 StateDefinition 中的每个状态添加事件。每个事件的名称将对应于每个状态的名称。
CellWasClicked：单击或点击任何单元格都会触发。
CellWasRightClicked：单击右键时触发。
CellWasDoubleClicked：双次单击或点击任何单元格都会触发。
CellWasLongClicked：长时间单击或点击任何单元格都会触发。
MashupPropertyBinding：MashupPropertyBinding 属性中每个条目的密钥将产生“集合小组件”的源绑定属性。单击单元格时，可用于将单元格级数据从“集合小组件”绑定到混搭中的其他小组件。