QML动态添加标签

索鲁什·侯赛因普尔

好吧,我正在尝试使用 qml 制作一种信使。我有一个 textarea 和一个发送按钮。单击发送按钮时,文本区域内的文本将显示在屏幕上的某处。但是文本区域的任何其他更改都会更改标签的上下文。我尝试使用 createObject(...) 但它没有帮助。有没有其他方法可以动态创建标签(或任何其他组件)?

import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.3
import QtQuick.Controls.Material 2.1
ApplicationWindow {

    visible: true
    width: 640
    height: 480
    property var xPosition : 500
    property var yPosition: 200
    title: qsTr("server")
    Rectangle{
        width: parent.width
        height: parent.height

        Button{
            id: sentButton
            width: parent.width / 14
            x: parent.height + 112
            y: parent.width - 200
            Material.accent: Material.Blue
            Material.background: Material.DeepOrange
            Text {
                id: name
                text: qsTr("Send")
                color: "white"
                x:parent.width / 4
                y:parent.height / 4
            }
            onClicked: {
                //add label with the context of textarea


            }
        }

        Rectangle{
            id:back
            height: sentButton.height
            width: parent.width - sentButton.width
            x:0
            y: 435
            color: "white"
            border.width: 0.5

            TextArea{
                id:search
                placeholderText: qsTr("Search")
                x:7
                width: parent.width - 25
                background: null
            }

        }
    }

}
格雷科

Label我不会手动创建,而是将一行添加到模型(如ListModel)并使用ListView.

ListView将实例化一个委托模型,它的清洁比手工做的每一行。另外,您可以免费获得滚动行为。

这里的例子:

import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.3
import QtQuick.Controls.Material 2.1

ApplicationWindow {

    visible: true
    width: 640
    height: 480
    Material.accent: Material.DeepOrange

    ListModel {
        id: messageModel
    }

    ColumnLayout {
        anchors { fill: parent; margins: 8 }
        spacing: 16
        ListView {
            Layout.fillWidth: true; Layout.fillHeight: true
            model: messageModel
            delegate: ItemDelegate { text: model.message }
        }
        RowLayout {
            spacing: 16
            Layout.fillWidth: true; Layout.fillHeight: false
            TextField {
                id: textField
                Layout.fillWidth: true; Layout.fillHeight: true
            }
            Button {
                Material.foreground: "white"; Material.background: Material.DeepOrange
                Layout.fillHeight: true
                text: "Send"
                onClicked: {
                    messageModel.append({message: textField.text});
                    textField.text = "";
                }
            }
        }
    }
}

在这里,Button将追加一个新行ListModelTextFieldtext是消息的作用。然后ListView为模型的每一行实例化一个ItemDelegate显示消息角色。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

在QML中动态添加标签

来自分类Dev

动态添加标签upgradeElement

来自分类Dev

动态添加标签页qt 5.1

来自分类Dev

通过jQuery动态添加标签

来自分类Dev

为按钮动态添加标签/ android

来自分类Dev

在按键上,动态添加标签?

来自分类Dev

使用GWT中的标签项动态添加标签

来自分类Dev

如何动态地在标签之间添加标签?

来自分类Dev

如何动态地在标签之间添加标签?

来自分类Dev

如何一次动态添加标签?

来自分类Dev

动态向面板添加标签不会刷新面板

来自分类Dev

PyQt:添加标签

来自分类Dev

我如何动态添加ID并向每个复选框动态添加标签

来自分类Dev

Google条形图标签动态数据。如何添加标签?

来自分类Dev

Tkinter添加标签框架

来自分类Dev

在Seaborn酒吧添加标签

来自分类Dev

添加标签视图android

来自分类Dev

Tkinter添加标签框架

来自分类Dev

使用HtmlGenericControl添加标签

来自分类Dev

如何添加标签图标?

来自分类Dev

使用 Jquery 添加标签

来自分类Dev

向动态添加的边缘d3js强制布局添加标签

来自分类Dev

在uiview中动态添加标签,然后将uiview添加到scrollview ios

来自分类Dev

在uiview中动态添加标签,然后将uiview添加到scrollview ios

来自分类Dev

sencha如何在tabpanel中动态添加标签,并将列表添加到tabpanel

来自分类Dev

向动态添加的边缘d3js强制布局添加标签

来自分类Dev

XML替换标签的值并添加标签

来自分类Dev

在R中的标签上添加标签

来自分类Dev

JTable,通过MousClick在具体单元格中动态添加标签