Как в QML сделать переход между состояниями

состояние, QML

Рекомендуем хостинг TIMEWEB

Стабильный хостинг, на котором располагается социальная сеть EVILEG. Для проектов на Django рекомендуем VDS хостинг.

Добрый день.

Без кода тут даже подсказывать нечего.

import QtQuick 2.4
import QtQuick.Controls 2.2

Item {
    id: element
    width: 400
    height: 600
    property alias page1ButtonMenu: page1ButtonMenu

    Button {
        id: page1Button0
        x: 66
        y: 172
        width: 128
        height: 128
        //font.capitalization: Font.AllUppercase
        //display: AbstractButton.TextOnly
        //topPadding: 5
        Image {
            id: image
            width: 130
            height: 130
            anchors.topMargin: 0
            anchors.leftMargin: 0
            anchors.rightMargin: 0
            anchors.bottomMargin: 0
            anchors.fill: parent
            source: "qrc:/images/images/close.png"
            fillMode: Image.Stretch
        }
    }

    Button {
        id: page1Button1
        x: 251
        y: 172
        width: 130
        height: 130
        Image {
            id: image1
            width: 130
            height: 130
            anchors.rightMargin: 0
            anchors.bottomMargin: 0
            anchors.fill: parent
            source: "qrc:/images/images/close.png"
            fillMode: Image.Stretch
        }
    }

    Button {
        id: page1ButtonMenu
        x: 150
        y: 479
        text: qsTr("МЕНЮ")
        font.pointSize: 18
    }

    Label {
        id: page1labe0
        x: 57
        y: 47
        width: 286
        height: 33
        text: qsTr("Выберете красный цвет")
        horizontalAlignment: Text.AlignHCenter
        font.pixelSize: 22
        font.family: "Verdana"
        font.weight: Font.Thin
    }

    Label {
        id: page1Label1
        x: 122
        y: 358
        width: 156
        height: 56
        text: qsTr("Побед: 0%")
        font.pointSize: 20
        horizontalAlignment: Text.AlignHCenter
    }
    states: [
        State {
            name: "State1"

            PropertyChanges {
                target: image
                source: "images/red.png"
            }

            PropertyChanges {
                target: image1
                source: "images//black.png"
            }
        },
        State {
            name: "State2"

            PropertyChanges {
                target: image
                source: "images//black.png"
            }

            PropertyChanges {
                target: image1
                source: "images//red.png"
            }
        }
    ]
}

и отсюда еще один вопрос: фактически 3 состояния, а в коде только 2. почему так? как с этим работать?

как я понял нужно сделать третий states и вызвавть так states:имя состояния

Хотя почему то не работает.
В файле main.qml прописал

    Loader
              {
                  id: loader
                  anchors.fill: parent
                  source: "Page1.qml"
                  state: "Page1State1"
              }

но почему то состояние не меняется. Скажите пожалуйста почему так и как исправть.

а если я в описании страницы Page1 прописываю state: "Page1State2", то почему то не загружаются картинки

Извините, с картинками разобрался, но вот как включать нужное состояние из других частей проекта, пока не понятно

Также попробовал прикрепить переход к сигналу кнопки, но переход не работает

    page1Button0.onClicked: {  //left button
        state: "Page1State0"
    }

Вот так заработало

    page1Button0.onClicked: {  //left button
        state = "Page1State2"
    }