도형 만들기

Qt Quick 디자이너는 일반적인 드로잉 도구가 아닌 UI 디자인 도구이므로, 사용자의 필요에 따라 수정할 수 있는 기성 UI 컨트롤을 제공하는 데 중점을 둡니다. 컨트롤의 일부 속성 값은 스타일링을 통해 지정되므로 직접 변경할 수 없습니다.

그러나 ‘컴포넌트( Components) ’에 있는 일부 컴포넌트를 사용하여 사각형과 같은 기본 도형을 그릴 수 있습니다. 또한, ‘xml-ph-0000@deepl.internal’ 보기에서 Qt Quick Shapes Design Helpers 모듈을 설치하여 ‘ 2D ’ 뷰에서 타원, 다각형, 별 모양과 같은 더 복잡한 도형을 만들 수 있습니다.

Components 의 대부분의 시각적 컴포넌트는 ` Item ` 컴포넌트를 기반으로 합니다. 이 컴포넌트는 그 자체로는 시각적 모양이 없지만(예를 들어 마우스 영역과 유사하게), 위치, 크기, 표시 여부 등 시각적 컴포넌트 전반에 공통적으로 적용되는 모든 속성을 정의합니다. 자세한 내용은 ‘기본 컴포넌트 속성 설정’을 참조하십시오.

또한, 각 컴포넌트에는 시각적 모양과 동작을 지정하는 일련의 속성이 있습니다. 속성 값을 수정하여 도형의 채우기 색상, 테두리 색상, 획 두께 및 기타 특성을 설정할 수 있습니다.

다음 섹션에서는 사용 가능한 도형과 해당 속성에 대해 더 자세히 설명합니다. ‘ Properties ’ 보기에서 속성 값을 수정할 수 있습니다.

사각형

기본 ‘ Rectangle ’ 컴포넌트는 네 개의 변과 모서리, 그리고 실선으로 된 테두리를 가진 도형을 그리는 데 사용됩니다.

사각형은 ‘ Fill color ’ 필드에서 설정한 단색 채우기 색상이나 선형 그라데이션으로 채울 수 있습니다. 또한 색상 선택기를 사용하여 색상을 선택하거나, 그라데이션 선택기를 사용하여 미리 정의된 WebGradients 세트에서 그라데이션을 선택할 수도 있습니다.

Border color 및 Border width 필드의 값을 설정하여 직사각형에 고유한 색상과 두께를 가진 선택적 실선 테두리를 추가할 수 있습니다. 채우기 색상이 없는 테두리를 만들려면 색상을 투명하게 설정하는 ‘ ’ 버튼을 선택하십시오.

Radius 필드의 값을 설정하여 모서리가 둥근 도형을 만들 수 있습니다. 직사각형의 너비, 높이 및 반지름 속성 값을 적절히 조합하면 타원형 및 원형 도형을 만들 수 있습니다. 예를 들어, 완전한 원을 그리려면 먼저 네 변의 길이가 모두 같은 직사각형을 그린 다음, 그 반지름을 변 길이의 절반으로 설정하십시오.

곡선 가장자리를 그릴 때는 ‘ Advanced ’ 섹션에서 ‘ Antialiasing ’을 활성화하여 도형의 외관을 개선하는 것을 고려해 보세요.

RectangleShape

RectangleShape 직사각형의 각 모서리를 개별적으로 수정하거나 점선 테두리를 사용하려면, ‘ Components ’ > Qt Quick Shapes Design HelpersDefault Components > Basic 에 있는 기본 Rectangle 컴포넌트 대신 컴포넌트의 인스턴스를 생성하십시오.

Corner Radiuses 섹션에서 속성 값을 설정하면 각 모서리를 개별적으로 그릴 수 있습니다. 반경 값을 Corner Bevel 섹션의 값과 함께 사용하면 모서리가 잘린 도형을 만들 수 있습니다.

선형 그라데이션 외에도 ‘ Fill color ’ 필드에서 원뿔형 및 방사형 그라데이션을 지정할 수 있습니다.

‘ Stroke Details ’ 섹션에서는 테두리 모드, 선 스타일, 그리고 파선 및 점선용 대시 패턴을 지정할 수 있습니다.

EllipseShape

EllipseShape 전체 타원, 호 또는 채워진 파이 조각을 추가하려면 ‘ Components ’ > Qt Quick Shapes Design Helpers에서 제공되는 Start angle 컴포넌트의 인스턴스를 생성하십시오. 도형의 모양을 제어하려면 및 Sweep angle 을 설정하십시오.

기본적으로 이 유형은 전체 타원을 렌더링합니다. 내부 영역은 Fill color 값으로 채워지며, 윤곽선은 Stroke color, Stroke width 및 Stroke style 값에 따라 그려집니다.

호나 파이 조각을 만들려면, Start angle 및 Sweep angle 을 0~360도 사이로 설정하여 그릴 타원의 구간을 정의합니다.

간단한 호(윤곽선만 있는 경우)를 만들려면 Fill color 을 Transparent 로 설정하십시오. 호의 선 스타일은 Dash pattern 및 Dash offset 을 사용하여 사용자 정의할 수 있습니다.

채워진 파이 조각(중심과 연결된 부분)을 만들려면 ` Fill color`을 설정하십시오. 파이 조각의 윤곽선도 선으로 표시됩니다.

도넛 링(속이 빈 타원)을 만들려면 Inner arc ratio 을 0.0과 1.0 사이의 값으로 설정하십시오. 이는 안쪽 타원의 반지름과 바깥쪽 타원의 반지름 간의 비율을 정의합니다.

선 안쪽 영역은 ‘ Fill color ’에서 설정한 단색 채우기 색상이나, ‘ Shape gradient ’ 유형 중 하나로 정의되어 ‘ Fill gradient ’에 설정된 그라데이션 중 하나로 채워집니다. 색상과 그라데이션을 모두 설정하면 그라데이션이 사용됩니다.

별도의 색상과 두께를 가진 테두리를 추가하려면 ‘ Stroke color ’ 및 ‘ Stroke width ’을 설정하십시오. 채우기 색상 없이 테두리만 만들려면 색상을 투명하게 설정하십시오.

모서리가 둥근 타원을 그리려면 ` Corner radius`를 설정하십시오.

RegularPolygonShape

정다각형은 단순한 2D 다각형 모양의 획, 채우기, 또는 획과 채우기가 결합된 형태일 수 있습니다. Stroke Details 을 설정하여 윤곽선의 모양을 변경할 수 있습니다.

선 안쪽 영역은 단색 채우기 색상이나 그라데이션 중 하나로 채워집니다. 색상과 그라데이션을 모두 설정하면 그라데이션이 사용됩니다.

스트로크가 있는 다각형을 만들려면, ‘ Side count ’을 3에서 100 사이로 설정하고 ‘ Stroke width ’을 0보다 큰 값으로 설정하십시오.

모서리가 둥근 다각형을 그리려면 Corner radius 을 설정하십시오.

별 모양

별은 별 모양의 획, 채우기 또는 획과 채우기가 결합된 형태일 수 있습니다. Stroke Details 을 설정하여 윤곽선의 모양을 변경할 수 있습니다.

Point count 을 3에서 60 사이로 설정하여 별의 점 수를 지정합니다. 비율을 0.1에서 1 사이로 설정하여 별의 내부 점이 중심에서 떨어진 거리를 지정합니다.

선 안쪽 영역은 단색 채우기 색상이나 그라데이션 중 하나로 채워집니다. 색상과 그라데이션을 모두 설정하면 그라데이션이 사용됩니다.

선(stroke)이 있는 별을 만들려면 ‘ Side count ’을 3에서 100 사이로 설정하고, ‘ Stroke width ’을 0보다 큰 값으로 설정하십시오.

모서리가 둥근 별을 그리려면 ‘ Corner radius ’를 설정하십시오.

도형 구성 요소 요약

다음 표에는 도형을 그리는 데 사용할 수 있는 구성 요소가 나열되어 있습니다. '위치' 열은 ' Components'에서 해당 구성 요소의 위치를 나타냅니다. 'MCU 지원' 열은 MCU에서 지원되는 구성 요소를 나타냅니다.

아이콘	이름	위치	MCU 지원	용도
	EllipseShape	타원, 호 또는 파이 조각을 렌더링할 수 있는 모양 컴포넌트입니다.	아니요
	Rectangle	기본 컴포넌트 - 기본	예	단색 채우기 색상이나 선형 그라데이션으로 채워지고, 선택적으로 테두리가 적용된 사각형입니다. radius 속성을 사용하여 원을 그릴 수 있습니다.
	RectangleShape	Qt Quick 도형 디자인 보조 도구	아니요	단색 채우기 색상이나 선형, 원추형 또는 방사형 그라데이션으로 채워지고, 각 모서리를 서로 독립적으로 모양을 지정할 수 있는 확장된 사각형입니다.
	RegularPolygonShape	Qt Quick 도형 디자인 도우미	아니요	선택적으로 테두리를 적용할 수 있는 채워진 정다각형입니다.
	StarShape	Qt Quick 도형 디자인 도우미	아니요	선택적으로 테두리가 있는 채워진 별 모양의 다각형입니다.