集合小器具
「集合小器具」是可讓您將一系列重複混搭包含在集合內的進階小器具。「集合小器具」可使用資料負載服務動態定義視覺化內容。「集合小器具」與「重複器小器具」類似，但包含的內容更多，因此提供的選項也更多，效能也更佳。
 |
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)。當您使用 Tab 切換至 MashupGlobalPropertyBinding 欄位以外時，每個項目都會提供可繫結至集合小器具的自訂內容。
將資料填入小器具
您可以使用多種方法配置「集合小器具」，來在執行時間將「混搭」填入小器具：
• 您可透過將內容設定為混搭名稱，來定義混搭。
• 您可繫結至 Mashup 名稱內容。
• 您可使用服務，為每個儲存格提供混搭名稱。
• 您可定義要在選取儲存格或儲存格為空時顯示的「混搭」。
已知瀏覽器限制
「集合小器具」在 Chrome 與 Firefox 中的執行及載入速度更快。它在 Edge 中的運作正常。而在 Internet Explorer 11 中，載入時間則比較長，效能也比較慢。
內容
|
屬性名稱
|
描述
|
基礎類型
|
預設值
|
可繫結?(Y/N)
|
可當地語系化?(Y/N)
|
||
|---|---|---|---|---|---|---|---|
|
Data
|
表示小器具的資料來源。
|
INFOTABLE
|
n/a
|
Y
|
N
|
||
|
View
|
版面配置類型。選項有 Flow 與 Table。「流動」為回應式，而「表格」與格點類似，允許每列一個混搭。
|
STRING
|
流動
|
Y
|
N
|
||
|
Mashup
|
用於資料項目的混搭。
|
MASHUPNAME
|
n/a
|
Y
|
N
|
||
|
MashupHeight
|
預設儲存格高度。
|
INTEGER
|
120
|
N
|
N
|
||
|
MashupWidth
|
預設儲存格寬度。
|
INTEGER
|
400
|
N
|
N
|
||
|
UIDField
|
表示集合項目的唯一識別元。為獲得最佳排序結果，基礎類型應為 NUMBER。這可以是可唯一識別項目之任何類型的欄位。使用現有服務時，如果欄位已選取「是主索引鍵」層面，應將其用於 UIDField。如果未定義主索引鍵，請考慮使用服務來將現有資料負載組合到包含 GUID 或 NUMBER 基礎類型設定為主索引鍵之欄位的新資料負載中。這也可能需要新增包含 GUID 欄位的資料形式。
|
INFOTABLE
|
n/a
|
N
|
N
|
||
|
SortField
|
設定或繫結後，此內容會識別用作部份內容排序依據的資料負載欄位 (如 Data 內容中所指定)。由於排序在用戶端執行，因此不會影響繫結至資料集的來源資料負載或其他小器具。此選項並非必要，但不保證服務每次都會以特定順序傳回列。請考慮將此內容設定為與 UIDField 相同的欄位。
|
INFOTABLE
|
n/a
|
Y
|
N
|
||
|
SortAscending
|
此內容需與 SortField 搭配使用。若啟用，將會以遞增順序排序，否則將會以遞減順序排序。
|
BOOLEAN
|
n/a
|
Y
|
N
|
||
|
SectionField
|
選用。表示用作項目分組依據的部份識別元。如果設定，會將項目分組為多個部份。僅支援一個部份。部份會將具有在 SectionField 中找到之通用值的列進行分組。例如，它可用來將包含週數欄位的列分組到週部份中。然後，可以使用頁首與頁尾來顯示每週開始與結束的位置。
|
INFOTABLE
|
n/a
|
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/a
|
N
|
N
|
||
|
FlowLayoutGravity
|
控制儲存格在其列中的分佈方式。
選項包括：「邊」、「已間隔」、「置中」或「展開」。
「邊」：儲存格會向包含它們的最近一條邊對齊，否則會在彼此之間保持相同的間距。
「已間隔」：儲存格會在彼此之間以及包含它們的小器具各邊之間保持相同的間距。
「置中」：儲存格會在可用寬度內置中，同時在每列中顯示適合的儲存格數。
「展開」：儲存格會展開以填滿可用寬度，甚至超出 MashupWidth 內容設定。
|
STRING
|
n/a
|
N
|
N
|
||
|
FlowLayoutAlignment
|
必須與「流動」版面配置搭配使用。控制儲存格在其列中的垂直對齊方式。
此內容用來在儲存格高度有變化時控制垂直對齊。當透過 CellHeightField 內容取得服務中的儲存格高度時，或當使用 MashupNameField 內容並將 UseMashupDimensions 內容設定為 true 時，可能會用到此內容。
「上」：將鄰接儲存格向列頂部對齊。
「置中」：將鄰接儲存格向列中心對齊。
「下」：將鄰接儲存格向列底部對齊。
「展開」：鄰接儲存格會調整高度以符合最高的儲存格。
|
STRING
|
置中
|
N
|
N
|
||
|
FlowLayoutContentGravity
|
必須與「流動」版面配置搭配使用。控制當內容大小小於集合檢視時，在集合檢視中垂直對齊內容的方式。
可用選項有「上」、「置中」與「下」。
「上」：儲存格會從頂部開始填充空間。
「置中」：儲存格會從垂直中心開始填充空間。
「下」：儲存格會從底部開始填充空間。
|
STRING
|
n/a
|
N
|
N
|
||
|
RowSpacing
|
控制頁首、列及頁尾之間的間距。
|
INTEGER
|
44
|
N
|
N
|
||
|
MinimumSpacing
|
控制儲存格之間的最小水平間距。
|
||||||
|
TopPadding
|
控制頂部邊距與第一個項目之間的邊框。
|
INTEGER
|
22
|
N
|
N
|
||
|
BottomPadding
|
控制底部邊距與最後一個項目之間的邊框。
|
INTEGER
|
22
|
N
|
N
|
||
|
MashupNameField
|
提供用於資料項目的混搭名稱。如果設定，此內容會取代 Mashup 與 SelectedFieldMashup 中的選取項。
|
||||||
|
PinHeadersToTop
|
如果啟用，目前可見部份頁首將會在您捲動內容時，貼上至小器具的頂部邊。
|
BOOLEAN
|
n/a
|
N
|
N
|
||
|
PinFootersToBottom
|
如果啟用，目前可見部份頁尾將會在您捲動內容時，貼上至小器具的底部邊。
|
BOOLEAN
|
n/a
|
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/a
|
N
|
N
|
||
|
MashupGlobalPropertyBinding
|
選用。用來建立可繫結自訂內容的 JSON 字串。此內容用來動態繫結在每個所含混搭中都應相同的資料，例如產品名稱、全域狀況指標等。每個索引鍵名稱都可以是要新增至小器具的任何合法內容名稱。每個值都必須是新增時為內容指派的資料類型，即 "STRING"、"NUMBER"、"BOOLEAN"。當您使用 Tab 切換至 MashupGlobalPropertyBinding 內容以外並對其進行驗證後，會將該內容新增至小器具。在內容視窗中向下捲動，或在內容篩選器中鍵入其名稱。此內容可用來將資料繫結至自訂內容，以將其傳入小器具中所含混搭的混搭參數。
|
STRING
|
n/a
|
N
|
N
|
||
|
CellWidthField
|
用於定義服務中儲存格預設寬度的欄位。值會取代 CellWidth。
|
||||||
|
CellHeightField
|
用於定義服務中儲存格預設高度的欄位。值會取代 CellHeight。
|
||||||
|
CellMashupSelectedField
|
選用。如果指定，此內容表示將接收與其繫結之物件所選狀態的混搭參數。這可讓您識別用來提供小器具中每個儲存格選取狀態的資料負載欄位。
|
STRING
|
n/a
|
N
|
N
|
||
|
UseMashupDimensions
|
選用。必須與 MashupNameField 內容及靜態儲存格混搭搭配使用。會使儲存格大小與其包含的混搭相符。
|
||||||
|
AllowSelection
|
如果啟用，可以選取儲存格，否則此集合小器具不能選取儲存格。
|
BOOLEAN
|
n/a
|
N
|
N
|
||
|
MultiSelect
|
啟用多重選取。「集合小器具」中的多重選取不需要 CTRL + click 或 SHIFT + click。按一下即可選取所需數量的儲存格，再按一下儲存格即可取消選取。不支援使用滑鼠進行範圍選取。
|
BOOLEAN
|
n/a
|
N
|
N
|
||
|
HasSelectedCells
|
當此「集合小器具」中至少有一個所選儲存格時，會設定為 true。
|
BOOLEAN
|
false
|
Y
|
N
|
||
|
SelectedCellsCount
|
包含集合檢視中所選儲存格的數目。
|
INTEGER
|
0
|
Y
|
N
|
||
|
ScrollsToSelectedCell
|
啟用選取變更以使集合捲動至第一個所選儲存格。
|
BOOLEAN
|
n/a
|
N
|
N
|
||
|
AutoSelectFirstCell
|
當資料已更新且未選取其他任何儲存格時，「集合小器具」會自動選取第一個可用儲存格。
|
BOOLEAN
|
n/a
|
N
|
N
|
||
|
SelectedItems
|
提供繫結，以設定服務中的目前所選儲存格。多個部份中的最新選取項會在集合中更新。
|
INFOTABLE
|
n/a
|
Y
|
N
|
||
|
SelectedMashupName
|
選用。若設定，會取代 CellSelectedStyle。定義當在執行時間選取儲存格時，將取代在 Mashup 或 MashupFieldName 內容中所定義混搭的混搭。在大多數情況下，SelectedMashup 應與預設混搭有相同的尺寸。它也可能擁有預設混搭的一些、全部或比之更多的混搭參數。此功能的使用案例是，在選取儲存格時提供更詳細的資料檢視，或針對呈現的資料，顯示其他選取或篩選選項。
|
MASHUPNAME
|
n/a
|
N
|
N
|
||
|
HandleSelectionUpdates
|
如果啟用，集合將會接收選取項更新並將其傳輸至其資料服務。這會切換在混搭中共用通用服務的資料小器具更新彼此選取項的常見方式。例如，當您按一下格點列時，繫結至相同服務的圖表點會反白。
|
BOOLEAN
|
n/a
|
N
|
N
|
||
|
CellStyle
|
控制儲存格的背景。僅使用樣式的背景顏色內容。
|
STYLE
|
n/a
|
N
|
N
|
||
|
CellSelectedStyle
|
控制所選儲存格的背景顏色。僅使用樣式的背景顏色內容。
|
STYLE
|
n/a
|
N
|
N
|
||
|
CellHoverStyle
|
控制將游標置於儲存格上時儲存格的背景顏色。僅使用樣式的背景顏色內容。
|
STYLE
|
n/a
|
N
|
N
|
||
|
CellActiveStyle
|
控制選取時儲存格的背景顏色。僅使用樣式的背景顏色內容。
|
STYLE
|
n/a
|
N
|
N
|
||
|
RippleEffectStyle
|
此內容必須與 UseRippleEffect 內容搭配使用。僅使用此樣式的背景顏色內容，此內容將會套用至波紋動畫效果。
|
STYLE
|
n/a
|
N
|
N
|
||
|
UseRippleEffect
|
如果啟用，按一下儲存格時，將會使用波紋動畫效果。使用此選項將會使儲存格的溢位內容設定為隱藏。只有在不包含具有背景顏色 (必須設定為透明) 之混搭的儲存格部份，才能看到波紋效果。
|
BOOLEAN
|
n/a
|
N
|
N
|
||
|
CellBorderRadius
|
要套用至儲存格的選用邊界半徑。當此值設定為非空字串 (例如 12px) 時，儲存格會將其溢位內容設定為隱藏。
|
STRING
|
n/a
|
N
|
N
|
||
|
CellBoxShadow
|
當設定為非空字串時，此內容將用作儲存格的方塊陰影。陰影設定尺寸遵循 CSS 方塊陰影規格與語法：
box-shadow: none|h-offset v-offset blur spread color |inset|initial|inherit;
應相對於間距內容考量陰影尺寸，以免陰影與鄰接儲存格重疊。
|
STRING
|
n/a
|
N
|
N
|
||
|
CellPointer
|
選用。明確設定將游標置於儲存格之上時滑鼠指標的外觀，而不是依賴預設瀏覽器游標行為。
|
STRING
|
自動
|
N
|
N
|
||
|
CellMenuStates
|
選用。提供可透過在儲存格上按一下滑鼠右鍵存取的選單。選單選取項由在此內容中選取的狀態定義所定義。您可以使用此項提供對其他混搭的導覽。
|
STATEDEFINITION
|
DefaultMenuStates
|
N
|
N
|
||
|
CellMenuStatesIconSize
|
此內容必須與 CellMenuStates 內容搭配使用。選單圖示會設定為此大小。最大值為 64。
|
INTEGER
|
n/a
|
N
|
N
|
||
|
CellMenuStatesIconGravity
|
必須與 CellMenuStates 內容搭配使用。控制圖示錨定至選單項目中文字的方式。選項有「左」、「上方」、「右」與「下方」
|
STRING
|
n/a
|
N
|
N
|
||
|
CellMenuStatesOrientation
|
必須與 CellMenuStates 內容搭配使用。控制選單項目的配置方式。選項有「水平」或「垂直」。
|
STRING
|
n/a
|
N
|
N
|
||
|
ShowHeaders
|
如果啟用並使用多個部份，每個部份都將具有頁首。
|
BOOLEAN
|
n/a
|
N
|
N
|
||
|
HeaderMashupName
|
用於頁首的混搭，必須與 SectionField 和 ShowHeaders 內容搭配使用。頁首混搭應該為回應式，以免發生與版面配置不合而不顯示捲軸的問題。
|
MASHUPNAME
|
n/a
|
N
|
N
|
||
|
HeaderSectionParam
|
這是一個混搭參數，必須在「頁首混搭」中設定，用來接收來自在 SectionField 內容中定義之「集合小器具」部份欄位的值。
|
STRING
|
n/a
|
N
|
N
|
||
|
HeaderHeight
|
頁首混搭的高度。
|
INTEGER
|
44
|
N
|
N
|
||
|
ShowFooters
|
如果啟用並使用多個部份，每個部份都將具有頁尾。
|
BOOLEAN
|
n/a
|
N
|
N
|
||
|
FooterMashupName
|
用於頁尾的混搭。此內容必須與 SectionField 和 ShowFooters 內容搭配使用。頁尾混搭應該為回應式，以免發生與版面配置不合而不顯示捲軸的問題。
|
MASHUPNAME
|
n/a
|
N
|
N
|
||
|
FooterSectionParam
|
將會接收部份識別元的混搭參數。
|
STRING
|
n/a
|
N
|
N
|
||
|
FooterHeight
|
頁尾混搭的高度。此內容必須與 SectionField 和 ShowFooters 內容搭配使用。
|
INTEGER
|
44
|
N
|
N
|
||
|
EmptyMashupName
|
如果指定，將會在資料集為空時顯示此混搭。當將「日期篩選器小器具」與用來填入「集合小器具」的服務搭配使用時，可能會發生此情況。這可用來顯示包含「無結果」訊息的「混搭」。
|
MASHUPNAME
|
n/a
|
N
|
N
|
||
|
PlaysIntroAnimation
|
在載入資料之後啟用儲存格的「滑入」轉移動畫。
|
BOOLEAN
|
n/a
|
N
|
N
|
||
|
Deselect
|
呼叫時，集合將會取消選取其資料集中的所有列。
|
n/a
|
Y
|
N
|
|||
|
SelectAll
|
呼叫時，集合將會選取其資料集中的所有列。
|
n/a
|
Y
|
N
|
事件
CellMenuStates：CellMenuStates 內容會針對新增至「集合小器具」之 StateDefinition 中的每個狀態，新增一個事件。每個事件的名稱將與每個狀態的名稱對應。
CellWasClicked：按一下或點選任何儲存格即會觸發。
CellWasRightClicked：按一下滑鼠右鍵即會觸發。
CellWasDoubleClicked：連按兩下或點兩下任何儲存格即會觸發。
CellWasLongClicked：長按或長點選任何儲存格即會觸發。
MashupPropertyBinding：MashupPropertyBinding 內容中每個項目中的索引鍵將針對「集合小器具」產生來源繫結內容。當按一下儲存格時，可以使用它們來將「集合小器具」中的儲存格層級資料繫結至混搭中的其他小器具。