StyleVariation QML Type

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

このタイプはテクノロジープレビュー段階にあり、変更される可能性があります。

• 継承されたメンバーを含むすべてのメンバーの一覧

プロパティ

• name : string

関連するプロパティ

• controlType : int
• variations : list<string>

詳細な説明

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

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

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

インスタンスのバリエーションは、影響を受けるStyle またはTheme 内で定義されます：

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

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

そして、これらは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 を必要とせずに、特定の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 に対してローカルに適用されます。テーマは、スタイル内で定義された StyleVariation 全体をシャドウすることはできません。他のスタイルプロパティと同様に、その中の個々のプロパティのみを上書きすることができます。

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

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

以下のスニペットでは、StyleVariation.variations: ["alert"] を持つボタンは、ライトテーマでは赤、ダークテーマではシアンになり、どちらでも4ピクセルのボーダーが付きます。ダークテーマではbutton.background.radius が6 に上書きされるため、そのプロパティがStyleのバリエーションで設定された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, {StyleKit Property Resolution} 。

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

name : string

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

この名前は、instance variation として使用される際に、このバリエーションを識別するためのものです。

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

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

StyleVariation.controlType : int [attached]

このプロパティは、それが付加されている項目のcontrol type を識別します。

StyleKit は、このプロパティを使用して子孫コントロールの「type variations 」を解決します。親アイテムの「controlType 」が、Style で「variations 」が定義されているコントロールタイプと一致する場合、それらのバリエーションはすべての子孫コントロールに適用されます。

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

「 ControlStyle.variations 」および「StyleReader.controlType 」も参照してください 。

StyleVariation.variations : list<string> [attached]

このプロパティには、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も参照してください 。