组件/表单组件引入于 1.3.0

EFloatLabel 浮动标签

import EUI 1.0

示例与代码

空值标签

QML 代码QML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EFloatLabel { width: 300 text: qsTr("名称") EInput { width: parent.width } }

效果

运行代码，体验组件交互

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

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

预填内容

QML 代码QML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EFloatLabel { width: 300 text: qsTr("名称") EInput { text: "EUI" width: parent.width } }

效果

运行代码，体验组件交互

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

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

密码输入

QML 代码QML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EFloatLabel { width: 300 text: qsTr("名称") EInput { text: "EUI2026!" showPassword: true width: parent.width } }

效果

运行代码，体验组件交互

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

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

禁用输入

QML 代码QML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EFloatLabel { width: 300 text: qsTr("名称") EInput { enabled: false width: parent.width } }

效果

运行代码，体验组件交互

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

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

可清除内容

QML 代码QML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EFloatLabel { width: 300 text: qsTr("名称") EInput { clearable: true text: "Clear me" width: parent.width } }

效果

运行代码，体验组件交互

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

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

属性

属性说明取值与默认值

contentalias

内容插槽；直接在组件内部声明 QML 子对象。

默认值fieldContainer.data

textstring

显示的文字内容。

默认值""

fixedbool

将标签固定在输入框内部顶端。

默认值false

targetItem

关联的目标控件。

默认值fieldContainer.children.length ? fieldContainer.children[0] : null

filledbool

字段是否已有值，可覆盖自动判断。

默认值

展开默认值

target ? target.text !== undefined ? String(target.text).length > 0 : target.value !== undefined && target.value !== null && String(target.value).length > 0 : false

raisedbool只读

标签是否处于抬起状态。

默认值fixed || filled || !!(target && target.activeFocus)