组件/表单组件引入于 1.3.0

EKnob 旋钮

import EUI 1.0

示例与代码

数值旋钮

QML 代码QML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EKnob { value: 65 }

效果

运行代码，体验组件交互

可修改文字、属性和事件，再点击运行。

代码在当前浏览器中运行 许可

步长和范围

QML 代码QML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EKnob { to: 20 from: -20 value: 10 stepSize: 5 }

效果

运行代码，体验组件交互

可修改文字、属性和事件，再点击运行。

代码在当前浏览器中运行 许可

百分比

QML 代码QML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EKnob { value: 40 suffix: "%" }

效果

运行代码，体验组件交互

可修改文字、属性和事件，再点击运行。

代码在当前浏览器中运行 许可

自定义颜色与宽度

QML 代码QML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EKnob { value: 75 strokeWidth: 16 color: "#67c23a" }

效果

运行代码，体验组件交互

可修改文字、属性和事件，再点击运行。

代码在当前浏览器中运行 许可

只读状态

QML 代码QML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EKnob { value: 80 readOnly: true }

效果

运行代码，体验组件交互

可修改文字、属性和事件，再点击运行。

代码在当前浏览器中运行 许可

属性

属性说明取值与默认值

fromreal

旋钮范围的一个端点。

默认值0

toreal

旋钮范围的另一个端点。

默认值100

valuereal

旋钮当前数值。

默认值0

stepSizereal

数值交互时的步长；非正值按 1 处理。

默认值1

suffixstring

显示在数值后的文本。

默认值""

strokeWidthint

圆形轨道和数值弧的线宽。

默认值10

readOnlybool

保持内容可见并禁止用户修改。

默认值false

colorcolor

数值弧的颜色。

默认值EPaletteManager.ThemePalette.fetchColorForStyle(EStyle.Primary)

maximumreal只读

from 与 to 中较大的值。

默认值Math.max(from, to)

minimumreal只读

from 与 to 中较小的值。

默认值Math.min(from, to)

effectiveValuereal只读

限制在有效范围内的显示值。

默认值isFinite(value) ? Math.max(minimum, Math.min(maximum, value)) : minimum

信号

签名作用

moved(real value)

用户拖动旋钮改变数值时触发，value 为当前数值。

方法

签名作用

setValue(next)

设置新的数值，并应用组件的取值范围限制。