StyleVariation QML Type

特定のコントロールの代替スタイルを定義します。詳細...

• 継承されたメンバを含むすべてのメンバのリスト

プロパティ

• name : string

付属物件

• controlType : int
• variations : list<string>

詳細な説明

StyleVariation を使用すると、アプリケーション内の特定のコントロール(インスタンス バリエーション) や、特定の親コントロール タイプのすべての子孫コントロール(タイプ バリエーション) に適用できる代替スタイルを定義できます。たとえば、サイドバー内のコントロールをコンパクトに見せたり、すべてのtoolbars 内のボタンを他のボタンとは異なる外観にすることができます。

インスタンスバリエーション

インスタンス・バリエーションは、アプリケーション内の任意のアイテムにvariations attached プロパティを設定することで有効になります。そのアイテムの子または子孫であるすべてのStyleKit コントロールは、代替スタイリングを受け取ります。バリエーションは複数の階層レベルで同時に設定することもでき、競合する場合はコントロールに最も近いバリエーションが優先されます。

インスタンスのバリエーションは、Style またはTheme で定義されます：

Style {
    StyleVariation {
        name: "mini"
        control {
            padding: 2
            background.implicitHeight: 15
            indicator.implicitWidth: 15
            indicator.implicitHeight: 15
            handle.implicitWidth: 15
            handle.implicitHeight: 15
        }
    }

    StyleVariation {
        name: "alert"
        abstractButton.background.color: "red"
    }
}

そして、variations attached プロパティを使用してアプリケーションから適用されます：

GroupBox {
    title: "Mini controls"
    StyleVariation.variations: ["mini"]

    Row {
        spacing: 10
        Button { text: "Save" }
        CheckBox { text: "Option" }
        // This button also has the "alert" variation, in addition to "mini"
        Button {
            text: "Delete"
            StyleVariation.variations: ["alert"]
        }
    }
}

アプリケーションから参照されるバリエーション名のうち、アクティブなスタイル（またはテーマ）で定義されていないものは無視され、スタイル作成者が実装するか未処理のままにするかを選択できるヒントとして機能します。

タイプのバリエーション

型バリエーションは、name を必要とせずに、特定のControlStyle のvariations プロパティに割り当てられます。インスタンス・バリエーション（アプリケーションが明示的に選択する必要がある）とは異なり、型バリエーションは、指定された親コントロール型の子孫であればいつでも、指定された型のすべてのコントロールに自動的に適用されます。

次のスニペットは、Frame 内のすべてのButtons を、他の場所にあるボタンと区別できるようにする方法を示しています：

Style {
    frame {
        variations: StyleVariation {
            button {
                text.color: "ghostwhite"
                background.border.width: 0
                background.color: "slategrey"
            }
        }
    }

    groupBox {
        // groupBox falls back to frame. Therefore, if the varations set on a
        // frame is not wanted on a groupBox, just override it and set it back to [].
        variations: []
    }
}

groupBox はスタイル階層でframe に戻るため、frame に設定された型バリエーションはgroupBox にも自動的に継承されます。これを避けるには、サブタイプのバリエーションをリセットします。

伝播順序

StyleVariation は、それが定義されたStyle またはTheme に対してローカルです。他のスタイル プロパティと同様に、その中の個々のプロパティのみをオーバーライドできます。

例えば、Style とアクティブなTheme の両方がframe.variations を定義している場合、両方のタイプ・バリエーション配列はFrame に対して有効になります。個々のプロパティの解決順序は、テーマのバリエーション・プロパティがテーマのダイレクト・プロパティよりも優先され、スタイルのバリエーション・プロパティがスタイルのダイレクト・プロパティよりも優先されます。

インスタンスのバリエーションも同様です。Theme で定義された StyleVariation は、Theme の直接プロパティよりも優先されます。同じname を持つ StyleVariation がStyle にも定義されている場合、上述と同じ解決順序に従って、両方が有効になります。

次のスニペットでは、StyleVariation.variations: ["alert"] を持つボタンは、明るいテーマでは赤、暗いテーマではシアン色になり、両方で 4 ピクセルのボーダーが付きます。ダーク テーマではbutton.background.radius が6 に上書きされるため、このプロパティはスタイルのバリエーションで設定されたbackground.radius よりも優先されます。その結果、ボタンの半径はダークテーマでは6 になりますが、ライトテーマでは0 になります：

Style {
    button.background.radius: 2
    StyleVariation {
        name: "alert"
        button.background.border.width: 4
        button.background.radius: 0
    }

    light: Theme {
        StyleVariation {
            name: "alert"
            button.background.color: "red"
        }
    }

    dark: Theme {
        button.background.radius: 6
        StyleVariation {
            name: "alert"
            button.background.color: "cyan"
        }
    }
}

Style,Theme,ControlStyle.variations,StyleVariation.variationsも参照してください 。

プロパティのドキュメント

name : string

このバリエーションの名前。

この名前はinstance variation として使われるときにこのバリエーションを識別する。

variations およびInstance Variationsも参照してください 。

付属プロパティのドキュメント

StyleVariation.controlType : int

このプロパティは、それがアタッチされているアイテムのcontrol type を識別する。

StyleKit type variations 親アイテムのcontrolType が、variations で定義されているコントロール・タイプと一致する場合、Style のバリエーションはすべての子孫コントロールに適用されます。

組み込みコントロールは、このプロパティを自動的に設定する。カスタム・コントロールが型のバリエーション解決に参加するには、明示的に設定する必要がある。

ControlStyle.variations およびStyleReader.controlTypeも参照のこと 。

StyleVariation.variations : list<string>

このプロパティは、Control と、その子孫コントロールに対してアクティブにするinstance variations のリストを保持する。

リスト内の複数のバリエーションが同じプロパティを設定する場合、リスト内の最初のものが優先される。

親アイテムと子孫コントロールの両方にバリエーションが設定されている場合、両方のセットが適用され、コントロール自身のバリエーションが親から継承されたものより優先される。

GroupBox {
    title: "Mini controls"
    StyleVariation.variations: ["mini"]

    Row {
        spacing: 10
        Button { text: "Save" }
        CheckBox { text: "Option" }
        // This button also has the "alert" variation, in addition to "mini"
        Button {
            text: "Delete"
            StyleVariation.variations: ["alert"]
        }
    }
}

nameも参照してください 。