ControlStyleProperties QML Type

コントロールのスタイラスプロパティを定義します。詳細...

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

プロパティ

• background : DelegateStyle
• bottomPadding : real
• handle : HandleStyle
• indicator : IndicatorStyle
• leftPadding : real
• padding : real
• rightPadding : real
• spacing : real
• text : TextStyle
• topPadding : real
• transition : Transition

詳細説明

ControlStyleProperties は、コントロールのスタイル可能なプロパティを定義します: ビジュアルビルディングブロックbackground 、indicator 、handle 、text 、およびpadding 、spacing 、transition のようなレイアウトプロパティ。

スタイル・プロパティは、ControlStyle やStyleReader のような継承された型を通してアクセスされます。

ControlStyle,StyleReader,ControlStateStyle,DelegateStyleも参照してください 。

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

background : DelegateStyle

コントロールの背景をスタイリングするためのグループ化されたプロパティ。

backgroundデリゲートは通常、コントロールの背後にあるメインの視覚的な四角形です。colors,borders,radii,shadows,gradients,images を設定するために使用します。

bottomPadding : real

コントロールのbottom padding 。設定されていない場合はpadding に戻る。

padding,topPadding,leftPadding,rightPaddingも参照のこと 。

handle : HandleStyle

コントロールのハンドルをスタイリングするためのグループ化されたプロパティ。

ハンドルは、Switch 、Slider 、RangeSlider などのコントロールで使用されます。RangeSlider の場合、2つのハンドルはhandle.first とhandle.second を通して個別にスタイルを設定することができます。

HandleStyle とDelegateStyleも参照して ください。

indicator : IndicatorStyle

コントロールのインジケータをスタイリングするためのグループ化されたプロパティ。checkBox の場合、インジケータは枠であり、そのforeground はチェックマークである。slider の場合、インジケータは溝で、前景は塗りつぶしです。

DelegateStyleも参照 。

leftPadding : real

コントロールのleft padding 。設定されていない場合はpadding に戻る。

padding,rightPadding,topPadding,bottomPaddingも参照のこと 。

padding : real

control's content area and the bounds of the control の一様な間隔。これを設定すると、leftPadding 、rightPadding 、topPadding 、bottomPadding のデフォルト値となる。各辺は個別にオーバーライドできる。

leftPadding,rightPadding,topPadding,bottomPaddingも参照 。

rightPadding : real

コントロールのright padding 。設定されていない場合はpadding に戻る。

padding,leftPadding,topPadding,bottomPaddingも参照のこと 。

spacing : real

コントロール内のビジュアル要素間の間隔、例えばインジケータとラベルの間隔。

text : TextStyle

コントロールのテキストラベルをスタイリングするためのグループ化されたプロパティ。

topPadding : real

コントロールのtop padding 。設定されていない場合はpadding に戻る。

padding,bottomPadding,leftPadding,rightPaddingも参照のこと 。

transition : Transition

Transition コントロールがホバーされた状態や押された状態など、新しい状態になったときにスタイル プロパティをアニメーション化するために使用されます。null （デフォルト）に設定すると、プロパティの変更はアニメーションなしで即座に適用されます。

button {
    background.color: "mistyrose"
    hovered.background.color: "plum"
    transition: Transition {
        ColorAnimation {
            properties: "background.color, background.shadow.color, handle.color"
            easing.type: Easing.OutQuad
            duration: 500
        }
        NumberAnimation {
            properties: "background.leftRadius, background.rightRadius"
            easing.type: Easing.OutQuad
            duration: 500
        }
    }

    // I only want a fade-out effect (not fade-in). So while the button
    // is hovered, remove the transition, so that it only applies in the
    // normal state. In other words, it's the state being entered that
    // determines the transition, not the state that is left.
    hovered.transition: null
}

デリゲートごとに同じターゲット プロパティが繰り返されるのを避けるために、StyleKit は、StyleAnimation を提供しており、標準アニメーションの代わりに、または標準アニメーションと組み合わせて使用できます：

comboBox {
    background.color: "mistyrose"
    hovered.background.color: "plum"
    transition: Transition {
        StyleAnimation {
            animateColors: true
            animateBackgroundRadii: true
            animateIndicatorRadii: true
            animateBackgroundShadow: true
            easing.type: Easing.OutQuad
            duration: 500
        }
    }
}

また、ColorAnimation は、property とproperties が未設定のままだと、状態変更中に変更されたすべてのカラー・プロパティをアニメーション化する特別な機能を持っていることに注意してください。