Link Search Menu Expand Document

通用型進度條可作為輸出以及輸入元件,將滑鈕開啟時進度條為輸入元件,否則則為輸出元件。

通用型進度條可以有橫式以及直式兩種,視長寬的尺寸自行調整。此外通用型進度條可以調整背景、進度條和滑鈕的邊框、顏色、透明度以及圓角半徑等風格屬性。

當需要使用大量進度條時,此元件為兼顧美觀,效能與資源的最佳選擇。

如欲快速入門,可以觀看博象教育影片,幫助了解通用型進度條

  • 教育影片

元件屬性

通用型進度條

屬性名稱 屬性功能描述 操作型態
元件名稱 元件實體名稱 Name
連結到使用手冊 連結至博象使用手冊  

顯示/隱藏控制

屬性名稱 屬性功能描述 操作型態
繫結顯示/隱藏 決定是否要綁定暫存器,藉由暫存器內容觸發隱藏元件 Checkbox
選擇顯示/隱藏 透過改變暫存器值決定顯示或不顯示元件 Register Selector

行為設定

屬性名稱 屬性功能描述 操作型態
最小資料值 最小資料值,對應到進度條開始 Number Editor
最大資料值 最大資料值,對應到進度條結束 Number Editor
綁定數值暫存器 如果綁定的暫存器內容等於最小資料值,進度條顯示在開始位置
如果綁定的暫存器內容等於最大資料值,進度條顯示在結束位置
Register Selector
預覽段落狀態 選擇要預覽的段落狀態 Dropdown List

進度條風格設定

屬性名稱 屬性功能描述 操作型態
主要顏色 設定進度條的主要顏色 Color Selector
漸變顏色 設定進度條的漸變顏色 Color Selector
進度條不透明度 % 設定進度條的不透明度(0-100%) Number Editor
圓角半徑 設定進度條的圓角半徑 Number Editor
邊框顏色 設定進度條邊框的顏色 Color Selector
邊框寬度 設定進度條邊框的寬度 Number Editor
陰影顏色 設定進度條陰影的顏色 Color Selector
陰影寬度 設定進度條陰影的寬度 Number Editor

段落2風格設定

屬性名稱 屬性功能描述 操作型態
啟用段落 2 決定是否要顯示第二段落 Checkbox
段落開始數值 設定第二段落開始數值,當綁定的暫存器內容等於此數值時,顯示第二段落與其設定
必須小於第三段落開始數值
Number Editor
主要顏色 設定第二段落的主要顏色 Color Selector
漸變顏色 設定第二段落的漸變顏色 Color Selector
進度條不透明度 % 設定第二段落的不透明度(0-100%) Number Editor
圓角半徑 設定第二段落的圓角半徑 Number Editor
邊框顏色 設定第二段落邊框的顏色 Color Selector
邊框寬度 設定第二段落邊框的寬度 Number Editor
陰影顏色 設定第二段落陰影的顏色 Color Selector
陰影寬度 設定第二段落陰影的寬度 Number Editor

段落3風格設定

屬性名稱 屬性功能描述 操作型態
啟用段落 3 決定是否要顯示第三段落 Checkbox
段落開始數值 設定第三段落開始數值,當綁定的暫存器內容等於此數值時,顯示第三段落與其設定 Number Editor
主要顏色 設定第三段落的主要顏色 Color Selector
漸變顏色 設定第三段落的漸變顏色 Color Selector
進度條不透明度 % 設定第三段落的不透明度(0-100%) Number Editor
圓角半徑 設定第三段落的圓角半徑 Number Editor
邊框顏色 設定第三段落邊框的顏色 Color Selector
邊框寬度 設定第三段落邊框的寬度 Number Editor
陰影顏色 設定第三段落陰影的顏色 Color Selector
陰影寬度 設定第三段落陰影的寬度 Number Editor

滑鈕風格設定

屬性名稱 屬性功能描述 操作型態
啟用滑鈕 決定是否要顯示使用滑鈕,可以藉由滑鈕改變暫存器的值 Checkbox
主要顏色 設定滑鈕的主要顏色 Color Selector
漸變顏色 設定滑鈕的漸變顏色 Color Selector
滑鈕不透明度 % 設定滑鈕的不透明度(0-100%) Number Editor
圓角半徑 設定滑鈕的圓角半徑 Number Editor
邊框顏色 設定滑鈕邊框的顏色 Color Selector
邊框寬度 設定滑鈕邊框的寬度 Number Editor
陰影顏色 設定滑鈕陰影的顏色 Color Selector
陰影寬度 設定滑鈕陰影的寬度 Number Editor

進度條邊距設定

屬性名稱 屬性功能描述 操作型態
進度條和背景的上下邊距 調整進度條和背景的上下邊距,最大最小值隨元件高度而改變 Number Editor
進度條和背景的左右邊距 調整進度條和背景的左右邊距,最大最小值隨元件寬度而改變 Number Editor

進度條背景設定

屬性名稱 屬性功能描述 操作型態
主要顏色 設定進度條背景的主要顏色 Color Selector
漸變顏色 設定進度條背景的漸變顏色 Color Selector
背景不透明度 % 設定進度條背景的不透明度(0-100%) Number Editor
圓角半徑 設定進度條背景的圓角半徑 Number Editor
邊框顏色 設定進度條背景邊框的顏色 Color Selector
邊框寬度 設定進度條背景邊框的寬度 Number Editor
陰影顏色 設定進度條背景陰影的顏色 Color Selector
陰影寬度 設定進度條背景陰影的寬度 Number Editor

背景邊距設定

屬性名稱 屬性功能描述 操作型態
背景和元件的上下邊距 調整背景和元件外框的上下邊距,最大最小值隨元件高度而改變 Number Editor
背景和元件的左右邊距 調整背景和元件外框的左右邊距,最大最小值隨元件寬度而改變 Number Editor

右鍵選單

預覽段落狀態

屬性名稱 屬性功能描述 操作型態
預覽段落狀態 選擇要預覽的段落狀態  

元件子功能

屬性名稱 屬性功能描述 操作型態
連接到使用手冊… 連結至博象使用手冊