复杂的模型和显示数据

时间:2013-05-31 00:56:35

标签: c++ qt

我刚刚开始学习C ++和Qt Framework,我已经遇到了问题。问题是如何创建和显示不仅仅是字符串而是对象的数据,我可以访问和显示哪些属性。例如,我有一份员工列表,我想显示一个如下所示的列表:

---------------------
John Smith
Salary: 50,230
---------------------
Max Mustermann
Salary: 67,000
---------------------

目标是列表中的每个项目都是可点击的,并打开一个包含详细信息的新窗口。此外,重要的是我能够以不同的方式设置属性。

1 个答案:

答案 0 :(得分:1)

Qt为我们提供了模型和视图框架,它非常灵活。 您可以按“模型”保存数据,通过“查看”显示“模型”的数据 并通过“委托”确定如何播放您的数据

c ++的代码有点冗长,所以我使用文档中的qml来表达这个想法

    import QtQuick 2.1
import QtQuick.Window 2.1
import QtQuick.Controls 1.0

Rectangle {
    width: 640; height: 480

    //the new window
    Window{
        id: newWindow
        width: 480; height:240      

        property string name: ""
        property string salaryOne: ""
        property string salaryTwo: ""

        Rectangle{
            anchors.fill: parent

            Text{
                id: theText
                width:width; height: contentHeight
                text: newWindow.name + "\nSalaryOne : " + newWindow.salaryOne + "\nSalaryTwo : " + newWindow.salaryTwo
            }

            Button {
                id: closeWindowButton
                anchors.centerIn: parent
                text:"Close"
                width: 98
                tooltip:"Press me, to close this window again"
                onClicked: newWindow.visible = false
            }
        }
    }

    ListModel {
        id: salaryModel
        ListElement {
            name: "John Smith"
            SalaryOne: 50
            SalaryTwo: 230
        }
        ListElement {
            name: "Max Mustermann"
            SalaryOne: 67
            SalaryTwo: 0
        }
    }

    //this is the delegate, determine the way you want to show the data
    Component {
        id: salaryDelegate
        Item {
            width: 180; height: 40
            Column {
                Text { text: name }
                Text { text: "Salary : " + SalaryOne + ", " + SalaryTwo }
            }

            MouseArea{
                anchors.fill: parent

                //set the value of the window and make it visible
                onClicked: {
                    newWindow.name = model.name
                    newWindow.salaryOne = model.SalaryOne
                    newWindow.salaryTwo = model.SalaryTwo
                    newWindow.visible = true                    

                    view.currentIndex = index                          
                }
            }
        }
    }

    ListView {
        id: view
        anchors.fill: parent
        model: salaryModel
        delegate: salaryDelegate
    }
}

您可以将窗口或ListView分成不同的qml文件,结合c ++,qml和javascript的强大功能。像qml这样的声明语言非常适合处理UI。

c ++版

#include <memory>

#include <QApplication>
#include <QListView>
#include <QSplitter>
#include <QStandardItemModel>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);   

    QStandardItemModel model(2, 1);
    model.appendRow(new QStandardItem(QString("John Smith\nSalary: %1, %2\n").arg(50).arg(230)));
    model.appendRow(new QStandardItem(QString("Max Mustermann\nSalary: %1, ").arg(67) + QString("000\n")));

    QSplitter splitter;

    QListView *list = new QListView(&splitter);
    list->setModel(&model);

    splitter.addWidget(list);

    splitter.show();

    return a.exec();
}

根据您的需要增强它们,c ++版本也支持委托。 您可以封装QListView并在打开时打开一个新窗口 用户点击索引(你需要QItemSelectionModel来检测哪个 您选择的项目。。在您可以设计高度自定义UI之前,您有 研究Qt的很多模型和视图框架。既然你的情况 非常简单,默认的QListView和QStandardItemModel就足够了。

补充:如何检测您选择的索引?

//the type of model_selected is QItemSelectionModel*
model_selected = list->selectionModel();

connect(model_selected, SIGNAL(selectionChanged(QItemSelection, QItemSelection)),
            this, SLOT(selection_changed(QItemSelection, QItemSelection)));


void imageWindow::selection_changed(QItemSelection, QItemSelection)
{
    //do what you want
}