一、概述
功能簡介:【輪播器組件】是一種容器,可以将其他各型別組件(不包含輪播器組件本身,不支援組合)拖入【輪播器組件】,并按照一定規則輪播。
本文僅為大家介紹【輪播器組件】特有功能,其他屬性不贅述。
組件互動請參見:FVS組件框架互動屬性 。表格組件僅支援監控重新整理設定。
組件動畫請參見:FVS組件框架動畫屬性 。
組件屬性請參見:FVS組件屬性 。
二、添加輪播器組件
新建一張【大屏範本】,如下圖1所示。
在頁面中新增一個【輪播器組件】,預設顯示【請将組件拖入輪播組件中,添加的組件将自适應充滿整個輪播區域】。如下圖2所示。
使用者可選中本頁面中其他各型別組件拖入到輪播組件内。當出現提示【釋放進入輪播組件】時,松開滑鼠,即可将組件加入輪播列表中。如下圖3所示。
注:組合不支援拖入【輪播器組件】,【輪播器組件】不支援拖入【輪播器組件】。若将組合/【輪播器組件】拖入【輪播器組件】中,提示【該組件/組合不支援拖入輪播組件】。
三、輪播列表
1
展示方式。
每個輪播頁僅能顯示一個組件,不支援顯示多個組件。
組件被拖入輪播組件後,不再存在於圖層區。組件大小變為和輪播組件一樣大。
2
展示順序。
按照組件拖入的順序,先拖入的在上,後拖入的在下。
預覽時,按照從上到下的順序進行輪播。
可選中輪播列表中的某個組件,上下拖動調整組件順序。
3
組件編輯。
在輪播列表中,可對組件進行編輯、重命名、移出、删除等操作。
編輯:修改組件内的資料配置、互動等屬性。
重命名:可對該組件的名稱進行修改。
移出:将組件從輪播組件中移出到頁面中,重新出現在圖層列表裏。
删除:删除該組件。
四、輪播按鈕
若勾選【顯示輪播按鈕】,支援兩型別輪播按鈕:導航器按鈕、Tab欄按鈕。
1
導航器按鈕。
導航器按鈕設定如下圖1所示。
各設定項的具體說明如下表所示。
導航器和導航點的位置如下圖2所示。
設定 | 說明 |
顯示策略 | 支援兩種顯示策略: 固定顯示:當預覽該頁面時,導航器按鈕預設顯示在組件上。 懸浮顯示:當預覽該頁面時,導航器按鈕預設不顯示。當滑鼠懸浮在輪播組件上時,導航器按鈕出現。 |
大小 | 用於調整導航器按鈕的尺寸大小。 |
顔色 | 用於調整導航器按鈕的顔色。 |
不透明度 | 用於調整導航器按鈕的透明度。 |
導航點 | 控制底部導航點是否出現。 |
2
Tab欄按鈕。
Tab欄按鈕設定如下圖所示。
各設定項的具體說明如下表所示。
Tab欄按鈕的顯示範例如下圖所示。
設定 | 說明 |
顯示策略 | 支援兩種顯示策略: 固定顯示:當預覽該頁面時,Tab欄按鈕預設顯示在組件上。 懸浮顯示:當預覽該頁面時,導航器按鈕預設不顯示。當滑鼠懸浮在輪播組件上時,導航器按鈕出現。 |
按鈕樣式 | 輪播組件内置了多種Tab欄樣式,使用者可自行選擇。 |
佈局樣式 | 支援兩種佈局樣式: 自然佈局:根據組件名稱的長度和按鈕字号,按照合适的長度自适應顯示Tab欄。 等分佈局:根據組件的長度/高度,以及輪播列表中組件的個數,等分Tab欄,每個Tab框的長度一緻。 |
色相 | 用於調整Tab框的色相,不改變Tab框中的文字顔色。 |
位置 | 用於調整Tab欄的位置,支援上、下、左、右四種。 |
按鈕字号 | 用於調整Tab框中的文字大小,Tab框的大小随之自适應調整。 |
樣式 | 用於設定Tab框中的文字顔色,不改變Tab框的顔色。 |
位置 | 僅當【佈局樣式】選擇【等分佈局】時,出現該設定項可設定Tab框中的文字位置,支援居左、居中、居右。 |
五、自動輪播
選中【輪播器組件】,點擊【互動】,使用者可自行選擇是否【開啓自動輪播】。如下圖所示。
【自動輪播】預設開啓,輪播間隔預設為 6000 毫秒。
若不開啓自動輪播,當預覽該頁面時,輪播組件預設顯示輪播列表中的第一個組件。使用者需要透過輪播按鈕方可查看其他輪播内容。
若開啓自動輪播,當預覽該頁面時,根據輪播列表的順序和輪播間隔,循環展示各個組件的内容,但無法暫停自動輪播。
六、已完成範本
已完成範本請參見:FVS輪播器組件範例.fvs。
七、注意事項
使用者可選中輪播器組件,複制粘貼輪播器組件和輪播列表中的全部内容。
使用者不可選中輪播列表中的某個組件,單獨複制粘貼到頁面中。
使用者可對輪播器組件本身設定組件内容、組件動畫和組件佈局。組件互動僅支援【輪播設定】,不支援【點擊事件】和【監控重新整理】。
使用者可對輪播列表中的每個組件,設定組件内容、組件互動(【點擊事件】和【監控重新整理】),不支援設定組件動畫和組件佈局。
進行聯動設定時,支援聯動到輪播組件本身,支援聯動到輪播列表中的每個組件。
輪播組件整體可以與其他組件合并成組合。輪播組件中的單個組件不可成組。
不支援拖曳輪播組件/組合進入輪播組件。