State QML Type

オブジェクトとプロパティの構成を定義します。詳細...

• 継承されたメンバーを含む全メンバーのリスト

プロパティ

• changes : list<Change>
• extend : string
• name : string
• when : bool

詳細説明

状態とは、デフォルトの構成から一括して変更されたものです。

すべてのアイテムには、オブジェクトとプロパティ値のデフォルト構成を定義するデフォルト状態があります。新しい状態を定義するには、states プロパティに State アイテムを追加します。こ れ ら の構成は、 た と えば、 異な る プ ロ パテ ィ 値群を適用 し た り 異な る ス ク リ プ ト を実行 し た り す る ために用い ら れます。

以下の例では、Rectangle を 1 つ表示します。デフォルトの状態では、矩形は黒く着色されています。ク リ ッ ク さ れた」 状態では、PropertyChanges オブジ ェ ク ト は長方形の色を赤に変えます。MouseArea 内をクリックすると、矩形の状態がデフォルトの状態と「クリックされた」状態の間で切り替わり、矩形の色が黒と赤の間で切り替わります。

import QtQuick

Rectangle {
    id: myRect
    width: 100; height: 100
    color: "black"

    MouseArea {
        id: mouseArea
        anchors.fill: parent
        onClicked: myRect.state == 'clicked' ? myRect.state = "" : myRect.state = 'clicked';
    }

    states: [
        State {
            name: "clicked"
            PropertyChanges { target: myRect; color: "red" }
        }
    ]
}

デフォルトの状態は、空の文字列（""）で参照されます。

ステートは一般的にトランジションと一緒に使用され、ステートの変更時にアニメーションを提供します。

ステートの例、Qt Quick ステート、トランジション、および Qt Qml.

プロパティの説明

Rectangle {
    id: myRect
    width: 100; height: 100
    color: "red"

    MouseArea { id: mouseArea; anchors.fill: parent }

    states: State {
        name: "hidden"; when: mouseArea.pressed
        PropertyChanges { target: myRect; opacity: 0 }
    }
}

Item {
    states: [
        State { name: "state1"; when: sharedCondition },
        State { name: "state2"; when: sharedCondition }
    ]
    // ...
}