【无标题】

使用qml编写,实现类似qlistview的多页切换风格,子页中还有表格以及相关toolbar的实现

效果图:

候补

具体实现:

配置:

QT += quick

CONFIG += c++11

# The following define makes your compiler emit warnings if you use
# any Qt feature that has been marked deprecated (the exact warnings
# depend on your compiler). Refer to the documentation for the
# deprecated API to know how to port your code away from it.
DEFINES += QT_DEPRECATED_WARNINGS

# You can also make your code fail to compile if it uses deprecated APIs.
# In order to do so, uncomment the following line.
# You can also select to disable deprecated APIs only up to a certain version of Qt.
#DEFINES += QT_DISABLE_DEPRECATED_BEFORE=0x060000    # disables all the APIs deprecated before Qt 6.0.0

SOURCES += \
        EasyTableModel.cpp \
        main.cpp \
        tableviewmodel.cpp

RESOURCES += qml.qrc \
    source.qrc

# Additional import path used to resolve QML modules in Qt Creator's code model
QML_IMPORT_PATH =

# Additional import path used to resolve QML modules just for Qt Quick Designer
QML_DESIGNER_IMPORT_PATH =

# Default rules for deployment.
qnx: target.path = /tmp/$${TARGET}/bin
else: unix:!android: target.path = /opt/$${TARGET}/bin
!isEmpty(target.path): INSTALLS += target

HEADERS += \
    EasyTableModel.h \
    tableviewmodel.h

main.cpp

#include 
#include 
#include 

#include "EasyTableModel.h"
#include "tableviewmodel.h"

int main(int argc, char *argv[])
{
    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);

    QGuiApplication app(argc, argv);

    TableViewModel modol;
    QQmlApplicationEngine engine;
    engine.rootContext()->setContextProperty("myModel", &modol);

    qmlRegisterType("EasyModel",1,0,"EasyTableModel");

    const QUrl url(QStringLiteral("qrc:/main.qml"));
    QObject::connect(&engine, &QQmlApplicationEngine::objectCreated,
                     &app, [url](QObject *obj, const QUrl &objUrl) {
        if (!obj && url == objUrl)
            QCoreApplication::exit(-1);
    }, Qt::QueuedConnection);    
    engine.load(url);

    return app.exec();
}

TableViewModel实现
#ifndef TABLEVIEWMODEL_H
#define TABLEVIEWMODEL_H

//#include 
//#include 
#include 

struct Person
{
    QString name;
    int age;
public:
    Person(int age=0, const QString& name="")
        :name(name), age(age){}
};

class TableViewModel : public QAbstractListModel
{
    Q_OBJECT
    Q_PROPERTY(QStringList userRoleNames READ userRoleNames CONSTANT)
public:
    TableViewModel(QObject* parent=nullptr);

    enum MyModelRoles
    {
        UserName = Qt::UserRole+1,
        UserAge
    };

    QStringList userRoleNames();
    int rowCount(const QModelIndex& parent=QModelIndex())const;
    QVariant data(const QModelIndex& index, int role = Qt::DisplayRole)const;
    QHash roleNames()const;

public:
    void addPerson(const Person& person);

private:
    QList mPersons;
};

#endif // TABLEVIEWMODEL_H






#include "tableviewmodel.h"

TableViewModel::TableViewModel(QObject* parent)
    : QAbstractListModel(parent)
{
    mPersons.append(Person(36, "Jack"));
    mPersons.append(Person(68, "Mike"));
    mPersons.append(Person(56, "Zero"));
}

QStringList TableViewModel::userRoleNames()
{
    QStringList ret;
    foreach (auto p, mPersons) {
        ret.append(p.name);
    }

    return ret;
}

int TableViewModel::rowCount(const QModelIndex &parent) const
{
    Q_UNUSED(parent)

    return mPersons.count();
}

QVariant TableViewModel::data(const QModelIndex &index, int role) const
{
    if(!index.isValid())
        return QVariant();

    if(index.row() >= mPersons.size())
        return QVariant();

    if(role == MyModelRoles::UserName)
        return mPersons.at(index.row()).name;
    else if(role == MyModelRoles::UserAge)
        return mPersons.at(index.row()).age;

    return QVariant();
}

QHash TableViewModel::roleNames() const
{
    static QHash roles
    {
        {MyModelRoles::UserName, "name"},
        {MyModelRoles::UserAge, "age"}
    };

    return roles;
}

void TableViewModel::addPerson(const Person &person)
{
    beginInsertRows(QModelIndex(), rowCount(), rowCount());
    mPersons<

main.qml

import QtQuick 2.14
import QtQuick.Window 2.14


Window {
    visible: true
    width: 940
    height: 680
    color: "#ababab"
    title: qsTr("Orthodontics System")

    ToolBox{
        id: tool
        visible: false
        x: 10
        y: (parent.height-height)/2
        width: parent.width-50
    }

    TableView2{
        visible: false
    }

    Component.onCompleted: {
        tool.open()
        setX(Screen.width/2-width/2)
        setY(Screen.height/2-height/2)
    }
}

ToolBox.qml

import QtQuick 2.0
import QtQuick.Controls 2.14

Popup{
    id: root
    width: 600
    height: 480
    visible: true

    ListView{
        id: list
        width: 80
        height: parent.height
        interactive: false //ban to drag-move
        //anchors.fill: parent
        model: ListModel{
            ListElement{norl: "qrc:/img/res/img/tool3-n.png"; selc:"qrc:/img/res/img/tool3.png"}
            ListElement{norl: "

你可能感兴趣的:(QtDemo,qt,qml,qtquick,表格,分页,listiew)