RadialGradient QML Type

방사형 그라데이션을 그립니다. 더 보기...

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

속성

• angle : real
• cached : bool
• gradient : Gradient
• horizontalOffset : real
• horizontalRadius : real
• source : variant
• verticalOffset : real
• verticalRadius : real

상세 설명

그라데이션은 두 가지 이상의 색상이 매끄럽게 혼합되어 정의됩니다. 색상은 항목의 중앙에서 시작하여 가장자리에서 끝납니다.

예시

다음 예제는 이 효과를 적용하는 방법을 보여줍니다.

import QtQuick
import Qt5Compat.GraphicalEffects

Item {
    width: 300
    height: 300

    RadialGradient {
        anchors.fill: parent
        gradient: Gradient {
            GradientStop { position: 0.0; color: "white" }
            GradientStop { position: 0.5; color: "black" }
        }
    }
}

속성 설명

angle : real

이 속성은 그라디언트의 중심점을 기준으로 한 회전을 정의합니다. 이 회전은 ‘ horizontalRadius ’ 및 ‘ verticalRadius ’ 속성의 값이 서로 다를 때만 표시됩니다. 각도는 도(°) 단위로 지정되며, 기본값은 0 입니다.

cached : bool

이 속성을 사용하면 렌더링 성능을 향상시키기 위해 이펙트 출력 픽셀을 캐시에 저장할 수 있습니다.

소스나 효과 속성이 변경될 때마다 캐시에 저장된 픽셀을 업데이트해야 합니다. 효과 출력을 저장하기 위해 추가 메모리 버퍼가 필요하기 때문에 메모리 사용량이 증가합니다.

소스 또는 효과 속성이 애니메이션 처리될 때는 캐시를 비활성화하는 것이 좋습니다.

기본적으로 이 속성은 ' false'로 설정되어 있습니다.

gradient : Gradient

그라데이션은 두 가지 이상의 색상이 매끄럽게 혼합되어 정의됩니다. 색상은 ` GradientStop ` 자식 항목의 집합으로 지정되며, 각 항목은 0.0에서 1.0 사이의 그라데이션 내 위치와 색상을 정의합니다. 각 ` GradientStop `의 위치는 `position` 속성을 설정하여 정의됩니다. 색상은 `color` 속성을 설정하여 정의됩니다.

Gradient {
  GradientStop {
   position: 0.000
   color: Qt.rgba(1, 0, 0, 1)
  }
  GradientStop {
   position: 0.167
   color: Qt.rgba(1, 1, 0, 1)
  }
  GradientStop {
   position: 0.333
   color: Qt.rgba(0, 1, 0, 1)
  }
  GradientStop {
   position: 0.500
   color: Qt.rgba(0, 1, 1, 1)
   }
  GradientStop {
   position: 0.667
   color: Qt.rgba(0, 0, 1, 1)
  }
  GradientStop {
   position: 0.833
   color: Qt.rgba(1, 0, 1, 1)
  }
  GradientStop {
   position: 1.000
   color: Qt.rgba(1, 0, 0, 1)
  }
}

Gradient {
  GradientStop {
    position: 0.0
    color: "#F0F0F0"
  }
  GradientStop {
    position: 0.5
    color: "#000000"
  }
  GradientStop {
    position: 1.0
    color: "#F0F0F0"
  }
}

Gradient {
  GradientStop {
    position: 0.0
    color: "#00000000"
  }
  GradientStop {
    position: 1.0
    color: "#FF000000"
  }
}

horizontalOffset : real

horizontalOffset 및 verticalOffset 속성은 그라데이션의 중심점이 항목 중심에서 얼마나 떨어져 있는지를 픽셀 단위로 정의합니다.

값의 범위는 -inf에서 inf까지입니다. 기본적으로 이 속성들은 0 로 설정되어 있습니다.

horizontalRadius : real

horizontalRadius 및 verticalRadius 속성은 방사형 그라데이션의 모양과 크기를 정의합니다. 반지름이 같으면 그라데이션의 모양은 원이 됩니다. 수평 반지름과 수직 반지름이 다르면 모양은 타원이 됩니다. 반지름은 픽셀 단위로 지정됩니다.

값의 범위는 -inf에서 inf까지입니다. 기본적으로 horizontalRadius는 너비(width)에, verticalRadius 는 높이(height)에 연동됩니다.

source : variant

이 속성은 그라데이션으로 채워질 항목을 정의합니다. 소스 항목은 중간 픽셀 버퍼에 렌더링되며, 그 결과에서 얻은 알파 값을 사용하여 디스플레이에서 그라데이션 픽셀의 표시 여부를 결정합니다. 소스의 기본값은 정의되지 않았으며, 이 경우 효과 영역 전체가 그라데이션으로 채워집니다.

verticalOffset : real

horizontalOffset 및 verticalOffset 속성은 그라데이션의 중심점이 항목 중심에서 얼마나 떨어져 있는지를 픽셀 단위로 정의합니다.

값의 범위는 -inf에서 inf까지입니다. 기본적으로 이 속성들은 0 로 설정되어 있습니다.

verticalRadius : real

horizontalRadius 및 verticalRadius 속성은 방사형 그라데이션의 모양과 크기를 정의합니다. 반지름이 같으면 그라데이션의 모양은 원이 됩니다. 수평 반지름과 수직 반지름이 다르면 모양은 타원이 됩니다. 반지름은 픽셀 단위로 지정됩니다.

값의 범위는 -inf부터 inf까지입니다. 기본적으로 horizontalRadius 는 width에, verticalRadius는 height에 연동됩니다.