qml ListView 语法

最新推荐文章于 2025-04-12 11:50:10 发布

a1317338022

最新推荐文章于 2025-04-12 11:50:10 发布

阅读量208

点赞数

分类专栏： QT

本文链接：https://blog.youkuaiyun.com/a1317338022/article/details/112260742

版权

QT 专栏收录该内容

57 篇文章

订阅专栏

这篇博客介绍了Qt QML中ListView组件的使用，特别是`onClicked`信号和设置当前选中项的语法，如`wrapper.ListView.view.currentIndex = index`。还提到了`manufacturer`等相关属性的运用，是学习Qt界面开发的一个实用参考。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick 2.2
import QtQuick.Controls 1.2
import QtQuick.Layouts 1.1

Window {
    width: 640
    height: 480
    visible: true
    title: qsTr("Hello World")



    Rectangle {
        width: 360;
        height: 300;
        color: "#EEEEEE";


        ListView {
            id: listView;
            anchors.fill: parent;

            Component {
                id: phoneDelegate;
                Item {
                    id: wrapper;
                    width: parent.width;
                    height: 30;

                    MouseArea {
                        anchors.fill: parent;
                        onClicked: wrapper.ListView.view.currentIndex = index;
                    }

                    RowLayout {
                        anchors.left: parent.left;
                        anchors.verticalCenter: parent.verticalCenter;
                        spacing: 8;
                        Text {
                            id: col1;
                            text: name;
                            color: wrapper.ListView.isCurrentItem ? "red" : "black";
                            font.pixelSize: wrapper.ListView.isCurrentItem ? 22 : 18;
                            Layout.preferredWidth: 120;
                        }

                        Text {
                            text: cost;
                            color: wrapper.ListView.isCurrentItem ? "red" : "black";
                            font.pixelSize: wrapper.ListView.isCurrentItem ? 22 : 18;
                            Layout.preferredWidth: 80;
                        }

                        Text {
                            text: manufacturer;
                            color: wrapper.ListView.isCurrentItem ? "red" : "black";
                            font.pixelSize: wrapper.ListView.isCurrentItem ? 22 : 18;
                            Layout.fillWidth: true;
                        }
                    }
                }
            }


            delegate: phoneDelegate;

            model: ListModel {
                id: phoneModel;
                ListElement{
                    name: "iPhone 3GS";
                    cost: "1000";
                    manufacturer: "Apple";
                }
                ListElement{
                    name: "iPhone 4";
                    cost: "1800";
                    manufacturer: "Apple";
                }

            }

            focus: true;

            highlight: Rectangle{
                color: "lightblue";
            }
        }
    }
}

onClicked: wrapper.ListView.view.currentIndex = index;

manufacturer等语法

这行代码的用法挺不错的，可以参考一下