為何捐款
API 瀏覽器
滑桿

QSlider 是一個很棒的組件,讓使用者可以在最小值和最大值之間指定一個數值,並可選擇在有效值之間設定步進。滑桿也具有焦點指示器(高亮顯示的滑桿按鈕),允許透過鍵盤調整滑桿。

另請查看它的「兄弟」組件 QRange

載入 QSlider API 中...

用法

警告

您有責任調整 QSlider 周圍的空間,以避免標籤和標記標籤與頁面上的其他內容重疊。您可以使用 CSS 的 margin 或 padding 來達到此目的。

標準

標準



垂直

垂直方向



具有內部最小值/最大值
v2.4+

有時您需要將模型值限制在軌道長度內的一個區間。為此,請使用 inner-mininner-max 屬性。第一個屬性需要大於或等於 min 屬性,而後者需要小於或等於 max 屬性。

內部最小值/最大值



具有步進

具有步進



step 屬性也可以是浮點數(如果您需要無限精度,則可以是數值 0)。

浮點數



對齊步進



具有標籤

在以下範例中,移動滑桿以查看標籤。

具有標籤



總是顯示標籤



自訂標籤值



以下範例更好地突顯了 QSlider 如何處理標籤定位,使其始終保持在 QSlider 的水平框內。

長標籤



標記

標記



標記標籤
v2.4+

標記標籤



關於插槽的提示

為了使用標記標籤插槽(見下方),您必須使用 marker-labels 屬性啟用它們。

標記標籤插槽



其他自訂
v2.4+

顏色自訂



隱藏選取列



自訂軌道圖片



軌道與滑塊尺寸



延遲輸入

延遲輸入



空值

空值



反向

反向



強制暗黑模式

強制暗黑模式



唯讀與停用

唯讀



停用



搭配 QItem

搭配 QItem



原生表單提交

當處理具有 actionmethod 的原生表單時(例如,當將 Quasar 與 ASP.NET 控制器一起使用時),您需要在 QSlider 上指定 name 屬性,否則 formData 將不會包含它(如果應該包含)。

原生表單