Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. QML animation + loader
Forum Updated to NodeBB v4.3 + New Features

QML animation + loader

Scheduled Pinned Locked Moved QML and Qt Quick
1 Posts 1 Posters 1.7k Views 1 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • L Offline
    L Offline
    Lyven
    wrote on last edited by
    #1

    Hi to you all!

    Following problem is driving me insane!

    Main.qml
    @import QtQuick 1.1

    Rectangle {
    id: mainScreen;
    width: 1000;
    height: 700;

    property int currentStep: 1;
    property int counter;
    
    ListModel{
        id: quoteModel;
        ListElement { stepWidth: 910; stepN: 1; stepA: true; stepC: "#c0c0c0"; stepNaam: "Hoofdsilo"}
        ListElement { stepWidth: 30; stepN: 2; stepA: false; stepC: "#8c8c8c"; stepNaam: "Weegsysteem"}
        ListElement { stepWidth: 30; stepN: 3; stepA: false; stepC: "#464646"; stepNaam: "Buffer"}
        ListElement { stepWidth: 30; stepN: 4; stepA: false; stepC: "#0c0c0C"; stepNaam: "Voersysteem"}
    }
    
    Item{
        anchors.fill: parent;
    
        Row{
            id: quote;
            anchors.fill: parent;
    
            Repeater{
                model: quoteModel;
    
                Step{
                    id: repStep;
    
                    stepID: stepN;
                    stepActive: stepA;
                    stepColour: stepC;
                    stepName: stepNaam;
    
                    anchors.top: parent.top;
                    anchors.bottom: parent.bottom;
                    width: stepWidth;
    
                    onStepActiveChanged: {
                        if(stepActive){
                            stepSizeOpen.start();
                        }else{
                            stepSizeClose.start();
                        }
                    }
    
                    PropertyAnimation{
                        id: stepSizeOpen;
                        target: repStep;
                        property: "width";
                        to: 910;
                        duration: 500;
                    }
    
                    PropertyAnimation{
                        id: stepSizeClose;
                        target: repStep;
                        property: "width";
                        to: 30;
                        duration: 500;
                    }
    
                    MouseArea {
                        id: mouseArea
                        anchors.fill: parent
    
                        onPressed: {
                            currentStep = stepN;
                            stepActive = true;
    
                            for(counter = 0; counter < 4; counter++){
                                if(counter !== (currentStep - 1)){
                                    quote.children[counter].stepActive = false;
                                }
                            }
                        }
                    }
                }
            }
        }
    }
    

    }
    @

    step.qml
    @// import QtQuick 1.0 // to target S60 5th Edition or Maemo 5
    import QtQuick 1.1

    Item {
    id: step;

    property int stepID;
    property bool stepActive;
    
    property string stepColour;
    property string stepName;
    
    
    onStepActiveChanged: {
        console.log(stepID + " " + stepActive + " " + stepName)
    }
    
    Rectangle{
        anchors.fill: parent;
        color: stepColour;
        border.color: "Black";
    
        Text{
            id: stepNaam;
            text: stepName.toString();
            font.family: "Arial";
            font.pointSize: 20;
            font.bold: true;
            color: "#FFFFFF";
    
            y:  stepNaam.paintedWidth + 10;
            transform: Rotation { origin.x: 0; origin.y: 0; angle: -90}
        }
    
        Loader{
            id: contentPane;
            anchors.fill: parent;
            anchors.leftMargin: stepNaam.paintedHeight + 1;
            source: "Weegsysteem.qml";
        }
    }
    

    }
    @

    weegsysteem.qml

    @// import QtQuick 1.0 // to target S60 5th Edition or Maemo 5
    import QtQuick 1.1

    Item {
    width: 100
    height: 62

    Rectangle{
        anchors.fill: parent;
        color: "black";
    }
    

    }
    @

    So as you can see, I have a loader in step.qml. If I have don't try to use the loader in my visualisation (the containers that getting smaller and bigger) are working ok. The moment I add it, it also works but when I try to select the first tab again, it looks like the animation to make that container big again does not work (just copy paste and run)

    This is really driving me insane as I can log it in my console and it claims that the animation is playing. Someone has an idea because i just can't figure it out!

    thanks in advance!

    regards

    Lieven

    1 Reply Last reply
    0

    • Login

    • Login or register to search.
    • First post
      Last post
    0
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    • Get Qt Extensions
    • Unsolved