圓形儀表為輸出/輸入元件。
使用者用單一元件可以完成完整的表盤與指針設定,除了作為輸出用,還可以作為輸入元件,譬如結合圓形指針以及適當背景,可以做為觸控旋鈕使用。
此元件亦使用了旋轉影像,其效能表現與旋轉影像相似。
如欲快速入門,可以觀看博象教育影片,幫助了解圓形儀表
-
教育影片
元件屬性
圓形儀表
屬性名稱 | 屬性功能描述 | 操作型態 |
---|---|---|
元件名稱 | 元件實體名稱 | Name |
連結到使用手冊 | 連結至博象使用手冊 |
顯示/隱藏控制
屬性名稱 | 屬性功能描述 | 操作型態 |
---|---|---|
繫結顯示/隱藏 | 決定是否要綁定暫存器,藉由暫存器內容觸發隱藏元件 | Checkbox |
選擇顯示/隱藏 | 透過改變暫存器值決定顯示或不顯示元件 | Register Selector |
顯示設定
屬性名稱 | 屬性功能描述 | 操作型態 |
---|---|---|
顯示文字 | 決定是否要顯示文字標籤 | Checkbox |
文字內容 | 設定要顯示的文字 | Plain Text |
字型 | 設定文字標籤的字型樣式、字體大小、粗細及斜體 | Font Selector |
文字顏色 | 設定文字標籤的顏色 | Color Selector |
文字位置 | 設定文字標籤的座標 | Alignment Selector |
開始數字 | 對應到圓弧刻度開始角度的數值 | Number Editor |
結束數字 | 對應到圓弧刻度結束角度的數值 | Number Editor |
反向 | 決定是否要反向對應數值,開始數字對應到圓弧刻度結束角度,結束數字對應到圓弧刻度開始角度 | Checkbox |
開始角度 | 圓弧刻度開始角度(1-359),詳情參考Number Editor | Number Editor |
圓弧長度 | 圓弧刻度長度(1-360) | Number Editor |
指針行為設定
屬性名稱 | 屬性功能描述 | 操作型態 |
---|---|---|
最小資料值 | 對應指針到圓弧刻度開始角度的資料值,必須小於最大資料值 | Number Editor |
最大資料值 | 對應指針到圓弧刻度結束角度的資料值,必須大於最小資料值 | Number Editor |
綁定暫存器 | 暫存器的內容是最小資料值的話,指針會指向圓弧刻度開始角度,指針隨著暫存器數值增加而旋轉,直至暫存器是最大資料值時旋轉指針會指向到圓弧刻度結束角度 | Register Selector |
指針左上座標 | 設定指針左上的座標 | Alignment Selector |
指針右下座標 | 設定指針右下的座標 | Alignment Selector |
啟用滑鈕 | 決定是否要作旋鈕作用,如果作旋鈕作用,可以藉由操控旋轉指針改變暫存器的內容 | Checkbox |
載入指針圖片 | 從檔案系統選擇作為旋轉指針的圖片 | File Open Dialog Box |
純色背景設定
屬性名稱 | 屬性功能描述 | 操作型態 |
---|---|---|
顯示純色背景 | 決定是否要顯示純色背景 | Checkbox |
邊框顏色 | 設定純色背景邊框的顏色 | Color Selector |
邊框樣式 | 設定邊框的框線風格 | Dropdown List |
純色背景顏色 | 設定純色背景的顏色 | Color Selector |
背景圖片設定
屬性名稱 | 屬性功能描述 | 操作型態 |
---|---|---|
顯示背景圖片 | 決定是否要顯示背景圖片 | Checkbox |
圖片左上座標 | 設定圖片左上的座標 | Alignment Selector |
圖片右下座標 | 設定圖片右下的座標 | Alignment Selector |
載入背景圖片 | 從系統檔案選擇作為背景的圖片 | File Open Dialog Box |
刻度樣式設定
屬性名稱 | 屬性功能描述 | 操作型態 |
---|---|---|
刻度樣式 | 設定刻度是否要鏤空,或設定使用漸變顏色,並設定臨界值。詳情參考Color Selector | Dropdown List |
選擇刻度形狀 | 設定刻度是否要圓頭或矩形 | Dropdown List |
圓心位置 | 設定刻度圓心的座標 | Alignment Selector |
置中心點 | 將圓心水平垂直置中 | Alignment Selector |
主刻度設定
屬性名稱 | 屬性功能描述 | 操作型態 |
---|---|---|
顯示刻度 | 決定是否要顯示刻度 | Checkbox |
刻度分隔數 | 設定刻度的分格數 | Number Editor |
刻度開始位置百分比 | 設定刻度起始位置佔半徑的百分比(1-200%) | Number Editor |
刻度結束位置百分比 | 設定刻度結束位置佔半徑的百分比 (1-200%) | Number Editor |
刻度顏色 | 設定刻度的顏色 | Color Selector |
刻度樣式 | 設定刻度的框線風格 | Frame Selector |
顯示刻度數字 | 決定是否要顯示刻度數字 | Checkbox |
顯示開始數字 | 決定是否要顯示開始數字 | Checkbox |
顯示結束數字 | 決定是否要顯示結束數字 | Checkbox |
刻度數字開始百分比 | 設定刻度數字佔半徑的百分比(1-200%) | Number Editor |
數字字型 | 設定刻度數字的字型樣式、字體大小、粗細、及斜體 | Font Selector |
數字顏色 | 設定刻度數字的顏色 | Color Selector |
子刻度設定
屬性名稱 | 屬性功能描述 | 操作型態 |
---|---|---|
顯示刻度 | 決定是否要顯示子刻度 | Checkbox |
刻度分隔數 | 設定子刻度的分格數 | Number Editor |
刻度開始位置百分比 | 設定子刻度起始位置佔半徑的百分比 (1-200%) | Number Editor |
刻度結束位置百分比 | 設定子刻度結束位置佔半徑的百分比 (1-200%) | Number Editor |
刻度顏色 | 設子定刻度的顏色 | Color Selector |
刻度樣式 | 設子定刻度的框線風格 | Frame Selector |
顯示刻度數字 | 決定是否要顯示子刻度數字 | Checkbox |
顯示開始數字 | 決定是否要顯示開始數字 | Checkbox |
顯示結束數字 | 決定是否要顯示結束數字 | Checkbox |
刻度數字開始百分比 | 設定子刻度數字佔半徑的百分比(1-200%) | Number Editor |
數字字型 | 設定子刻度數字的字型樣式、字體大小、粗細、及斜體 | Font Selector |
數字顏色 | 設定子刻度數字的顏色 | Color Selector |
光暈與光源設定
屬性名稱 | 屬性功能描述 | 操作型態 |
---|---|---|
使用光暈與光源效果 | 決定是否要使用Filter,詳情請參閱SVG Filter | Checkbox |
陰影x座標 | 設定陰影的x軸位移 | Number Editor |
陰影y座標 | 設定陰影的y軸位移 | Number Editor |
鏡射平面 | 設定鏡射平面,詳情請參閱SVG Filter | Number Editor |
鏡射光常數 | 設定鏡射光常數,詳情請參閱 SVG Filter | Number Editor |
鏡射光指數 | 設定鏡射光指數,詳情請參閱 SVG Filter | Number Editor |
光源顏色 | 設定光源的顏色 | Color Selector |
光源x座標 | 設定光源的x座標,詳情請參閱 SVG Filter | Number Editor |
光源y座標 | 設定光源的y座標,詳情請參閱 SVG Filter | Number Editor |
光源z座標 | 設定光源的z座標,詳情請參閱 SVG Filter | Number Editor |
預覽
屬性名稱 | 屬性功能描述 | 操作型態 |
---|---|---|
顯示輔助器 | 決定是否要顯示輔助器 | Checkbox |
數值 | 設定輔助器的數值(1-100) | Number Editor |
元件上編輯器
屬性名稱 | 屬性功能描述 | 操作型態 |
---|---|---|
調整刻度圓弧的圓心 | Center Editor | |
調整文字標籤的位置 | Label Editor | |
調整刻度的位置 | Scale Editor | |
調整刻度的位置 | Image Editor |
右鍵選單
移動旋轉中心到圖形中心點
屬性名稱 | 屬性功能描述 | 操作型態 |
---|---|---|
移動旋轉中心到圖形中心點 | 將圓心水平垂直置中 | Center Editor |
刻度樣式
屬性名稱 | 屬性功能描述 | 操作型態 |
---|---|---|
刻度樣式 | 設定刻度是否要鏤空或設定使用漸變顏色,並設定臨界值,詳情參考Color Selector | Dropdown List |
選擇刻度形狀
屬性名稱 | 屬性功能描述 | 操作型態 |
---|---|---|
選擇刻度形狀 | 設定刻度是否要圓頭或矩形 | Dropdown List |
元件子功能
屬性名稱 | 屬性功能描述 | 操作型態 |
---|---|---|
載入背景圖片… | 從系統檔案選擇作為背景的圖片 | File Open Dialog Box |
從剪貼簿貼上旋轉影像 | 從剪貼簿貼上要作為背景的圖片 | |
編輯背景圖片 | 編輯背景圖片 | Image Editor Dialog Box |
連接到使用手冊… | 連結至博象使用手冊 |