DelegateStyle QML Type

컨트롤 내 요소의 시각적 모양을 정의합니다. 더 보기...

이 유형은 기술 미리보기 단계에 있으며 변경될 수 있습니다.

• 상속된 멤버를 포함한 모든 멤버 목록

속성

• alignment : Qt::Alignment
• border : BorderStyle
• bottomLeftRadius : real
• bottomMargin : real
• bottomRightRadius : real
• clip : bool
• color : color
• data : QObject
• delegate : Component
• fillHeight : bool
• fillWidth : bool
• gradient : Gradient
• height : real
• image : ImageStyle
• leftMargin : real
• margins : real
• minimumHeight : real
• minimumWidth : real
• opacity : real
• radius : real
• rightMargin : real
• rotation : real
• scale : real
• shadow : ShadowStyle
• topLeftRadius : real
• topMargin : real
• topRightRadius : real
• visible : bool
• width : real

상세 설명

DelegateStyle은 ControlStyle 내의 시각적 요소( background, indicator 또는 indicator.foreground 와 같은 하위 요소 등)의 시각적 외관을 정의합니다. 이 클래스는 size, color, border, radius, shadow, image, opacity 등을 제어하는 속성을 제공합니다.

ControlStyle, ControlStateStyle 및 FallbackStyle 참조도 참조하십시오 .

속성 문서

alignment : Qt::Alignment

부모 요소 내에서의 대리자 정렬 방식입니다. 기본값은 ‘ Qt.AlignLeft | Qt.AlignVCenter ’입니다.

border : BorderStyle

이 델리게이트의 테두리 스타일을 지정하기 위한 그룹화된 속성입니다.

bottomLeftRadius : real

왼쪽 하단 모서리의 반경입니다. 설정되지 않은 경우 radius 로 기본 적용됩니다.

radius, topLeftRadius, topRightRadius 및 bottomRightRadius도 참조하십시오 .

bottomMargin : real

이 델리게이트의 하단 여백입니다. 설정되지 않은 경우, 기본값은 margins 입니다.

margins, topMargin, leftMargin 및 rightMargin도 참조하십시오 .

bottomRightRadius : real

오른쪽 하단 모서리의 반경입니다. 설정되지 않은 경우, 기본값인 radius 이 적용됩니다.

radius, topLeftRadius, topRightRadius 및 bottomLeftRadius도 참조하십시오 .

clip : bool

델리게이트가 내용을 잘라내는지 여부입니다. 기본값은 ` false`입니다.

color : color

이 델리게이트의 채우기 색상입니다. 기본값은 transparent 입니다.

색상을 그라데이션으로 대체하는 ‘Quick Rectangle ’와 달리, StyleKit은 색상 위에 gradient 을 그립니다. 즉, 반투명한 그라데이션을 오버레이(예: 은은한 음영 효과)로 사용할 수 있으며, 그 아래의 색상이 비쳐 보입니다.

button {
    background.gradient: Gradient {
        GradientStop { position: 0.0; color: Qt.alpha("black", 0.0)}
        GradientStop { position: 1.0; color: Qt.alpha("black", 0.2)}
    }
    background.color: "lightsteelblue"
    hovered.background.color: Qt.darker("lightsteelblue", 1.1)
    pressed.background.color: Qt.darker("lightsteelblue", 1.2)
}

gradient 및 opacity도 참조하십시오 .

data : QObject

스타일에서 사용자 정의 delegate 컴포넌트로 사용자 정의 데이터를 전달하는 데 사용할 수 있는 임의의 객체입니다.

이를 통해 StyleKit API에서 제공하는 범위를 넘어 사용자 정의 스타일 속성을 정의할 수 있습니다. 데이터 객체는 상태와 테마에 따라 달라질 수 있으므로, 내장 속성으로는 처리할 수 없는 사용자 정의 delegate 내 요소의 스타일을 지정할 수 있습니다.

다음 코드 조각은 컨트롤의 상태에 따라 색상이 달라지는 오버레이 Text 을 그리는 사용자 정의 델리게이트를 사용합니다. 이 델리게이트는 ` StyledItem`을 상속받는데, 이는 선택 사항이지만 버튼 배경의 나머지 부분이 정상적으로 렌더링되도록 보장합니다.

component OverlayData : QtObject {
    property color overlayColor
}

toolButton {
    background.delegate: StyledItem {
        id: custom
        Text {
            color: custom.delegateStyle.data.overlayColor
            font.pixelSize: 30
            text: "シ"
        }
    }
    background.data: OverlayData {
        overlayColor: "sandybrown"
    }
    hovered.background.data: OverlayData {
        overlayColor: "magenta"
    }
}

delegate도 참조하십시오 .

delegate : Component

Qt Quick 컨트롤에서 DelegateStyle 을 렌더링하는 데 사용되는 델리게이트입니다.

기본값은 null 이며, 이 경우 렌더링에 StyledItem 가 대신 사용됩니다. 델리게이트를 완전히 숨기고(생성되지 않도록 하려면) visible 를 false 로 설정하십시오.

델리게이트는 다음의 필수 속성을 정의해야 합니다:

required property DelegateStyle delegateStyle
required property QtObject control

delegateStyle DelegateStyle 를 가리키며, 이는 델리게이트의 스타일을 어떻게 적용해야 하는지 설명합니다. 는 델리게이트를 소유한 control Qt Quick 컨트롤을 가리킵니다. 후자는 스타일에서 얻을 수 없는 컨트롤에 대한 추가 정보를 확인하는 데 사용할 수 있습니다.

소유 컨트롤의 구체적인 유형을 알고 있다면, control 속성에 QtObject 대신 해당 유형을 사용할 수 있습니다. 예를 들어, 아래 코드 조각의 핸들 델리게이트는 항상 Slider 내에서 사용되므로, 유형을 T.Slider 로 설정할 수 있습니다:

// import QtQuick.Templates as T

slider {
    handle.delegate: Rectangle {
        id: handle
        required property DelegateStyle delegateStyle
        required property T.Slider control
        implicitWidth: delegateStyle.width
        implicitHeight: delegateStyle.height
        radius: delegateStyle.radius
        color: delegateStyle.color
        Text {
            anchors.centerIn: parent
            text: handle.control.value.toFixed(0)
        }
    }
}

관련 항목: data, visible, StyledItem.

fillHeight : bool

델리게이트가 상위 항목의 사용 가능한 높이를 채워야 하는지 여부.

체크박스 표시기의 전경과 같은 일부 델리게이트는 고정된 높이를 갖는 것보다 표시기의 사용 가능한 높이(및 너비)를 채우도록 기대되는 경우가 많습니다. 이는 ` fillHeight `을 ` true`으로 설정하여 달성할 수 있습니다. 델리게이트와 상위 항목의 가장자리 사이에 공간을 추가하려면 ` margins ` 속성을 사용하십시오.

fillHeight 가 false 인 경우, 델리게이트의 높이는 height 에 의해 결정됩니다.

fillWidth 및 height항목도 참조하십시오 .

fillWidth : bool

델리게이트가 상위 항목의 사용 가능한 너비를 모두 채워야 하는지 여부.

Slider 의 그루브(groove)와 같은 일부 델리게이트는 고정된 암시적 너비를 갖는 것보다 컨트롤의 사용 가능한 너비를 채우도록 기대되는 경우가 많습니다. 이는 fillWidth 속성을 true 로 설정하여 달성할 수 있습니다. 델리게이트와 상위 항목의 가장자리 사이에 간격을 두려면 margins 속성을 사용하십시오.

fillWidth 가 false 인 경우, 델리게이트의 너비는 width 에 의해 결정됩니다.

fillHeight 및 width항목도 참조하십시오 .

gradient : Gradient

이 델리게이트의 그라데이션입니다. 기본값은 null (그라데이션 없음)입니다.

색상을 그라데이션으로 대체하는 Quick Rectangle 와는 달리, StyleKit은 색상 위에 그라데이션을 그립니다. 즉, 반투명한 그라데이션을 오버레이(예: 미묘한 음영 효과)로 사용할 수 있으며, 그 아래의 색상이 비쳐 보입니다.

button {
    background.gradient: Gradient {
        GradientStop { position: 0.0; color: Qt.alpha("black", 0.0)}
        GradientStop { position: 1.0; color: Qt.alpha("black", 0.2)}
    }
    background.color: "lightsteelblue"
    hovered.background.color: Qt.darker("lightsteelblue", 1.1)
    pressed.background.color: Qt.darker("lightsteelblue", 1.2)
}

‘ color’ 항목도 참조하십시오 .

height : real

이 델리게이트의 높이입니다.

이 델리게이트가 컨트롤의 최상위(예: background 또는 indicator )에 있는 경우, fillHeight 이 true 인 경우에도 컨트롤의 implicit height 을 계산할 때 이 델리게이트가 포함됩니다.

width, fillHeight, minimumHeight 및 StyleKit 속성 해결(StyleKit Property Resolution)항목도 참조하십시오 .

image : ImageStyle

이 델리게이트 내에 이미지를 배치하기 위한 그룹화된 속성입니다.

ImageStyle도 참조하십시오 .

leftMargin : real

이 델리게이트의 왼쪽 여백입니다. 설정되지 않은 경우, 기본값은 margins 입니다.

margins, rightMargin, topMargin 및 bottomMargin도 참조하십시오 .

margins : real

이 델리게이트를 둘러싼 균일한 여백입니다. 이 값을 설정하면 leftMargin, rightMargin, topMargin 및 bottomMargin 에 대한 기본값이 제공됩니다. 각 측면의 여백은 개별적으로 재정의할 수 있습니다.

leftMargin, rightMargin, topMargin 및 bottomMargin항목도 참조하십시오 .

minimumHeight : real

이 델리게이트의 최소 높이입니다. 델리게이트의 크기는 이 값보다 작아지지 않습니다.

minimumWidth : real

이 델리게이트의 최소 너비입니다. 델리게이트의 크기는 이 값보다 작아지지 않습니다.

opacity : real

이 델리게이트의 불투명도. 0.0 (완전히 투명)부터 1.0 (완전히 불투명)까지입니다. 기본값은 1.0 입니다.

visible 및 color도 참조하십시오 .

radius : real

이 델리게이트의 네 모서리 모두에 적용되는 모서리 반경입니다. 개별 모서리는 topLeftRadius, topRightRadius, bottomLeftRadius 및 bottomRightRadius 을 사용하여 재정의할 수 있습니다.

topLeftRadius, topRightRadius, bottomLeftRadius 및 bottomRightRadius도 참조하십시오 .

rightMargin : real

이 델리게이트의 오른쪽 여백입니다. 설정되지 않은 경우, margins 로 대체됩니다.

margins, leftMargin, topMargin 및 bottomMargin도 참조하십시오 .

rotation : real

이 델리게이트의 회전 각도(도 단위).

scale : real

이 델리게이트의 배율 계수입니다. 기본값은 1.0 입니다.

shadow : ShadowStyle

이 델리게이트 뒤에 드롭 섀도우를 적용하기 위한 그룹화된 속성입니다.

ShadowStyle도 참조하십시오 .

topLeftRadius : real

왼쪽 상단 모서리의 반경입니다. 설정하지 않으면 기본값인 radius 이 적용됩니다.

radius, topRightRadius, bottomLeftRadius 및 bottomRightRadius도 참조하십시오 .

topMargin : real

이 델리게이트의 상단 여백입니다. 설정되지 않은 경우, margins 로 대체됩니다.

margins, bottomMargin, leftMargin 및 rightMargin도 참조하십시오 .

topRightRadius : real

오른쪽 상단 모서리의 반경입니다. 설정되지 않은 경우, 기본값인 radius 이 적용됩니다.

radius, topLeftRadius, bottomLeftRadius 및 bottomRightRadius도 참조하십시오 .

visible : bool

이 델리게이트가 표시되는지 여부입니다. 기본값은 ` true`입니다.

visible 가 false 인 경우, delegate 는 생성되지 않습니다. 숨겨진 델리게이트를 생성해야 하는 경우, 대신 opacity 를 0 로 설정하는 것을 고려해 보십시오.

opacity도 참조하십시오 .

width : real

이 델리게이트의 너비입니다.

이 델리게이트가 컨트롤의 루트(예: background 또는 indicator )에 있는 경우, fillWidth 가 true 인 경우에도 컨트롤의 implicit width 를 계산할 때 이 델리게이트가 포함됩니다.

height, fillWidth, minimumWidth 및 StyleKit 속성 해결(StyleKit Property Resolution)항목도 참조하십시오 .