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 の場合、handle.first およびhandle.second を通じて、2つのハンドルを個別にスタイル設定できます。

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 は、hovered やpressed など、コントロールが新しい状態に移行した際にスタイルプロパティにアニメーションを適用するために使用されます。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
        }
    }
}