QDeclarativeItem based on QML (Load QML file from QDeclarativeItem)



  • I'm create a QtQuick application. I try to download Qt 5.0 and install this, but when a add a QML file to resource file, resource file not compile (resource.cpp don't does not appear in debug folder). Then I download the Qt 4.8.4 and all became well - resource file compile. Not the problem, although it can be considered as an error in Qt 5.0 (Platform Windows XP SP3, Visual Studio 2010 SP1, Qt Creator 2.6)

    I need to create hibryd from .cpp and .qml - some properties will be write in cpp, but view I want to create in QML because it is very convenient.

    I create MainWindow:

    @
    import QtQuick 1.1
    import ManagementButtonLib 1.0

    Rectangle {
    width: 800
    height: 600

    MouseArea {
        anchors.fill: parent
        property variant previousPosition
        onPressed: {
            previousPosition = Qt.point(mouseX, mouseY)
        }
        onPositionChanged: {
            if (pressedButtons == Qt.LeftButton) {
                var dx = mouseX - previousPosition.x
                var dy = mouseY - previousPosition.y
                viewerWidget.pos = Qt.point(viewerWidget.pos.x + dx,
                                            viewerWidget.pos.y + dy)
            }
        }
    }
    
    Rectangle {
        id: viewArea
        color: "#606060"
        anchors.fill: parent
        border.width: 1
        border.color: "#000000"
        transformOrigin: Item.Center
        anchors.rightMargin: 1
        anchors.bottomMargin: 1
    
        ManagementButton
        {
            anchors.top: parent.top
            anchors.topMargin: 6
            anchors.right: parent.right
            anchors.rightMargin: 6
        }
    }
    

    }@

    then I create ManagementButton.h

    @
    #ifndef MANAGEMENTBUTTON_H
    #define MANAGEMENTBUTTON_H

    #include <QtCore>
    #include <QtDeclarative>

    class ManagementButton : public QDeclarativeItem
    {
    Q_OBJECT
    public:
    ManagementButton(QDeclarativeItem *parent =0);
    ~ManagementButton();
    Q_ENUMS(buttonType)
    enum buttonType {
    Close = 0,
    Minimize,
    Browse };
    };

    #endif // MANAGEMENTBUTTON_H
    @

    then the cpp file

    @
    #include "ManagementButton.h"

    ManagementButton::ManagementButton(QDeclarativeItem *parent) : QDeclarativeItem(parent)
    {
    setCursor(Qt::PointingHandCursor);
    setProperty("height", 30);
    setProperty("width", 30);
    QDeclarativeEngine engine;
    QDeclarativeComponent component(&engine, QUrl("qrc:/Content/qml/SetupCollectionAgent/ManagementButton2.qml"));
    QDeclarativeItem qmlView = qobject_cast<QDeclarativeItem>(component.create());
    qmlView->setParentItem(this);

    }

    ManagementButton::~ManagementButton(){

    }
    @

    and main.cpp code for understaning:

    @
    #include <QApplication>
    #include <QDeclarativeEngine>
    #include <QtDeclarative>
    #include <QtDeclarative/QDeclarativeContext>
    #include <QTextCodec>
    #include "qmlapplicationviewer.h"
    #include "managementButton.h"

    Q_DECL_EXPORT int main(int argc, char *argv[])
    {
    QTextCodec *utfcodec = QTextCodec::codecForName("UTF-8");
    QTextCodec::setCodecForTr(utfcodec);
    QTextCodec::setCodecForCStrings(utfcodec);

    QScopedPointer<QApplication> app(createApplication(argc, argv));
    
    QmlApplicationViewer viewer;
    qmlRegisterType<ManagementButton>("ManagementButtonLib", 1, 0, "ManagementButton");
    QDeclarativeContext *context = viewer.rootContext();
    context->setContextProperty("viewerWidget", &viewer);
    viewer.setWindowFlags(Qt::FramelessWindowHint);
    viewer.setOrientation(QmlApplicationViewer::ScreenOrientationAuto);
    viewer.setSource(QUrl("qrc:/Content/qml/SetupCollectionAgent/main.qml"));
    viewer.showExpanded();
    
    
    return app->exec&#40;&#41;;
    

    }
    @

    ManagementButton2.qml code:

    @
    import QtQuick 1.1
    Rectangle {
    enabled: true
    height: 30
    width: 30
    color: "#00000000"
    Rectangle {
    id: borderRectangle
    color: "#00000000"
    border.width: 0
    border.color: "#CCCCCC"
    anchors.fill: parent
    anchors.rightMargin: 1
    anchors.bottomMargin: 1

        Image {
            id: buttonImage
            anchors.centerIn: parent
            width: 16
            height: 16
            source: "qrc:/Images/Images/close.png"
        }
    }
    
    MouseArea {
        enabled: true
        acceptedButtons: Qt.LeftButton
        hoverEnabled: true
        id: clickButtonArea
        anchors.fill: parent
        anchors.margins: 2
        onEntered:
        {
    
            borderRectangle.border.width = 1
            buttonImage.source = "qrc:/Images/Images/close_active.png"
        }
    
        onExited:
        {
            borderRectangle.border.width = 0
            buttonImage.source = "qrc:/Images/Images/close.png"
        }
        onClicked: {
            Qt.quit();
        }
    }
    
    }
    

    @

    When I start the project all ok, but MouseArea declarative in ManagementButton2.qml don't work.



  • If I do this:
    main.qml

    @
    import QtQuick 1.1
    import ManagementButtonLib 1.0

    Rectangle {
    width: 800
    height: 600

    MouseArea {
        anchors.fill: parent
        property variant previousPosition
        onPressed: {
            previousPosition = Qt.point(mouseX, mouseY)
        }
        onPositionChanged: {
            if (pressedButtons == Qt.LeftButton) {
                var dx = mouseX - previousPosition.x
                var dy = mouseY - previousPosition.y
                viewerWidget.pos = Qt.point(viewerWidget.pos.x + dx,
                                            viewerWidget.pos.y + dy)
            }
        }
    }
    
    Rectangle {
        id: viewArea
        color: "#606060"
        anchors.fill: parent
        border.width: 1
        border.color: "#000000"
        transformOrigin: Item.Center
        anchors.rightMargin: 1
        anchors.bottomMargin: 1
    
        ManagementButton
        {
            ManagementButton2{}
            anchors.top: parent.top
            anchors.topMargin: 6
            anchors.right: parent.right
            anchors.rightMargin: 6
        }
    }
    

    }
    @

    and this in ManagementButton.cpp:
    @
    #include "ManagementButton.h"

    ManagementButton::ManagementButton(QDeclarativeItem *parent) : QDeclarativeItem(parent)
    {
    setCursor(Qt::PointingHandCursor);
    setProperty("height", 30);
    setProperty("width", 30);

    }

    ManagementButton::~ManagementButton(){

    }
    @

    mousearea work fine, but I need to connect with the possibilities of the form QML of C++. I want to make the item which you can use to choose the image transfer, and of the other properties will be issued automatically. What am I doing wrong? Information and there is no such example.


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.