Qt 将ListView currentItem信息传递给外部组件

我正在使用Qt logic作为主干应用程序处理QML，我有以下情况： 启动时，显示QML

ApplicationWindow

及其

StatusBar

，其中包含两个状态图标和一个可检查的

按钮，名为
UeStaffSelector
，用于工作人员登录。当我按下
UeStaffSelector
，弹出名为
ueStaffView
（它包含
ListView
名为
ueListViewWorkers
）的
窗口，并从
ueListViewWorkers
中选择用户进行登录，如以下屏幕截图所示：


现在，我有另一个定制的QML
项
，名为
UeKeypad
，它代表用户的pin输入，这样他/她就可以成功登录到系统。从
ListView
中选择
delegate
后，必须弹出此
UeKeypad
。
问题是，我从哪里调用
UeKeypad
？从
委托
，
列表视图
或
应用程序窗口
？另外，如何将用户信息（用户图像、用户名和用户密码）传递到
UeKeypad
？
QML绑定非常酷。您可以声明键盘类型与当前代理中的类型（即当前
图像
和用户/密码）之间的直接连接，而不是强制传递数据。这样，只要选择了一个代理，就会设置键盘内的相应变量

可以使用
State
s实现此结果。我们定义了两个
状态
s，当没有可用的选择时，使用图像/用户名显示给用户的小键盘的
可见
状态和隐藏小键盘的
隐藏
状态。明智地使用
when
子句，即以互斥的方式，我们可以确保从不命中默认的-空字符串-
状态
，从而确保组件的整体
状态

使用
状态
s的一个副作用是，我们可以很容易地定义一个
转换
在两个
状态
s之间移动，从而定义您感兴趣的滑动效果。此外，通过以声明方式定义所有关联，表单仍然可以通过设计器进行编辑/查看。这在命令式代码中是不可能的

可以通过以下方式访问当前委托中的实际值：
currentItem
（
alias
ed，如果在顶级类型中不可用）内的值将被删除，或者通过型号
get
。请注意
索引的用法，它是
中继器
和
列表视图
的附加属性

下面的示例总结了这种方法，还提供了访问
ListView
数据的两种方法

import QtQuick 2.0
import QtQuick.Controls 1.3
import QtQuick.Extras 1.4
import QtQuick.Layouts 1.2
import QtQuick.Window 2.2

ApplicationWindow {
    width: 600
    height: 800
    visible: true

    Column {
        id: keypad
        x: parent.width - width     // put in the corner
        z: 2
        Row {
            width: 200
            spacing: 10
            Image {
                id: keyImage
                width: 100
                height: 100
            }
            Text {
                id: keyText
                anchors.verticalCenter: parent.verticalCenter
                font.pixelSize: 30
            }
        }

        Grid{
            columns: 3
            columnSpacing: 5
            rowSpacing: 5
            Repeater {
                model: 9
                Button {
                    text: index + 1
                    onClicked: console.info(text + " " + keyText.text)
                }
            }
        }

        states: [
            State {
                name: "HIDDEN"
                PropertyChanges {
                    target: keypad
                    y: keypad.parent.height
                }
                when: list.currentIndex < 0
            },
            State {
                name: "VISIBLE"
                PropertyChanges {
                    target: keypad
                    y: keypad.parent.height / 2 - keypad.height / 2
                }
                PropertyChanges {
                    target: keyImage
                    source: list.model.get(list.currentIndex).image//list.currentItem.imagePath
                }
                PropertyChanges {
                    target: keyText
                    text: list.model.get(list.currentIndex).user//list.currentItem.label
                }
                when: list.currentIndex >= 0
            }
        ]

        transitions: Transition {
            NumberAnimation {
                properties: "y";
                duration: 1000
                easing.type: Easing.InQuad
            }
        }
    }


    ListView {
        id: list
        anchors.fill: parent
        currentIndex: -1
        model: ListModel{
            ListElement {
                image: "http://www.theapricity.com/forum/image.php?u=9098&dateline=1442619767"
                user: "first"
            }

            ListElement {
                image: "http://a.dilcdn.com/bl/wp-content/uploads/sites/8/2013/10/angry-cat-200x200.jpg"
                user: "second"
            }

            ListElement {
                image: "http://images.all-free-download.com/images/graphicthumb/walking_sand_cat_516744.jpg"
                user: "third"
            }
        }

        delegate: Rectangle {
            width: ListView.view.width
            height: 220
            property alias imagePath: img.source
            property alias label: label.text
            RowLayout {
                anchors.fill: parent
                Image {
                    id: img
                    width: 100
                    height: 100
                    fillMode: Image.PreserveAspectFit
                    source: image
                    Layout.alignment: Qt.AlignLeft
                    Layout.preferredWidth: 100
                }

                Text {
                    id: label
                    Layout.fillWidth: true
                    Layout.alignment: Qt.AlignCenter
                    text: user
                    font.pixelSize: 30
                }
                MouseArea{
                    anchors.fill: parent
                    onClicked: list.currentIndex = index   //set the current item
                }
            }
            color: ListView.isCurrentItem  ? "steelblue" : "transparent"
            scale: ListView.isCurrentItem ? 1 : 0.7
        }
    }
}

导入QtQuick 2.0
导入QtQuick.Controls 1.3
导入QtQuick.Extras 1.4
导入QtQuick.Layouts 1.2
导入QtQuick.Window 2.2
应用程序窗口{
宽度：600
身高：800
可见：正确
纵队{
id：键盘
x:parent.width-width//放在角落里
z:2
划船{
宽度：200
间距：10
形象{
id:keyImage
宽度：100
身高：100
}
正文{
id:keyText
anchors.verticalCenter:父级.verticalCenter
font.pixelSize:30
}
}
网格{
栏目：3
列间距：5
行间距：5
中继器{
型号：9
钮扣{
文本：索引+1
onClicked:console.info（text+“”+keyText.text）
}
}
}
国家：[
陈述{
名称：“隐藏”
财产变动{
目标：键盘
y：键盘。家长。高度
}
时间：list.currentIndex<0
},
陈述{
名称：“可见”
财产变动{
目标：键盘
y:keypad.parent.height/2-keypad.height/2
}
财产变动{
目标：keyImage
来源：list.model.get（list.currentIndex.image//list.currentItem.imagePath
}
财产变动{
目标：关键字
文本：list.model.get（list.currentIndex）.user//list.currentItem.label
}
时间：list.currentIndex>=0
}
]
过渡：过渡{
数字化{
属性：“y”；
持续时间：1000
easing.type:easing.InQuad
}
}
}
列表视图{
id:列表
锚定。填充：父级
当前索引：-1
模型：ListModel{
李斯特伦{
图像：“http://www.theapricity.com/forum/image.php?u=9098&dateline=1442619767"
用户：“第一”
}
李斯特伦{
图像：“http://a.dilcdn.com/bl/wp-content/uploads/sites/8/2013/10/angry-cat-200x200.jpg"
用户：“第二”
}
李斯特伦{
图像：“http://images.all-free-download.com/images/graphicthumb/walking_sand_cat_516744.jpg"
用户：“第三”
}
}
代表：矩形{
宽度：ListView.view.width
身高：220
属性别名imagePath:img.source
属性别名标签：label.text
行布局{
锚定。填充：父级
形象{
id:img
宽度：100
身高：100
fillMode:Image.P