다음을 통해 공유

SimpleCheckBox

  • 아티클

이 페이지는 WPF 프로젝트에만 적용됨

확인란(CheckBox)은 선택한 상태, 선택하지 않은 상태, 확정되지 않은 상태의 세 가지 상태 값을 갖는 토글로 작동하는 콘텐츠 컨트롤입니다. IsChecked 상태는 확인란이 선택되었는지 여부를 나타냅니다. Microsoft Expression Blend에서는 확인란을 두 번 클릭한 후 요소를 그려 확인란에 콘텐츠를 넣을 수 있습니다. 확인란에 여러 요소를 넣으려면 먼저 Grid나 Canvas 같은 레이아웃 패널을 추가해야 합니다. 기본적으로 확인란에도 텍스트가 표시되며, 확인란을 마우스 오른쪽 단추로 클릭한 다음 텍스트 편집을 클릭하여 텍스트를 편집할 수 있습니다.

SimpleCheckBox 컨트롤의 아트보드 보기

Cc295106.b070f542-4f36-422b-a930-be4b1311b2ca(ko-kr,Expression.10).png

컨트롤 템플릿 분석

SimpleCheckBox 컨트롤 템플릿은 다음 항목으로 구성됩니다.

  • BulletDecorator 컨테이너 텍스트에 확인란을 맞추는 데 사용됩니다. BulletDecorator는 bullet 요소와 content 요소(예: ContentPresenter)라는 두 개의 자식 요소를 갖습니다. BulletDecorator는 다른 요소에 텍스트를 맞추어야 하는 RadioButton과 같은 다른 컨트롤에도 사용됩니다.

  • Bullet 요소 이 요소에는 Grid 패널이 포함되며 Grid 패널에는 CheckMark와 Border 요소라는 Path 요소가 포함됩니다. Path는 "x" 표시를 그리는 데 사용됩니다.

  • ContentPresenter 템플릿이 적용되는 확인란의 Content 속성을 표시하는 데 사용됩니다. 확인란의 콘텐츠를 표시하려면 이 요소가 있어야 합니다.

    개체 보기: SimpleCheckBox 컨트롤의 기본 구성 요소(템플릿)

    Cc295106.0d0b3635-222f-44ec-81d6-3bf59a1beca3(ko-kr,Expression.10).png

Cc295106.7e183f1f-37d8-4dcb-980c-19a5d61ca087(ko-kr,Expression.10).gif맨 위로 이동

속성 트리거 사용

컨트롤 템플릿의 속성 트리거는 컨트롤이 속성 변경에 응답하도록 하는 데 사용됩니다. 인터랙션 패널의 트리거 아래 항목을 클릭하여 트리거가 활성화될 때 변경되는 속성을 확인할 수 있습니다. 예를 들어 SimpleCheckBox 템플릿에서 IsChecked 속성이 False이면 CheckMark 패스 요소의 표시 유형이 Collapsed로 변경됩니다. 다른 트리거에서는 브러시 리소스를 사용하여 Border 요소의 배경을 변경합니다.

Cc295106.7e183f1f-37d8-4dcb-980c-19a5d61ca087(ko-kr,Expression.10).gif맨 위로 이동

브러시 사용

SimpleCheckBox 템플릿에서는 SimpleStyles.xaml 리소스 사전의 다음과 같은 브러시 리소스가 사용됩니다.

  • Border 요소의 Background 속성은 트리거가 활성화되지 않은 경우에는 NormalBrush를, IsMouseOver가 True인 경우에는 MouseOverBrush를, IsPressed가 True인 경우에는 PressedBrush를, IsEnabled가 False인 경우에는 DisabledBackgroundBrush를 사용하여 설정됩니다.

  • BorderBrush 속성은 트리거가 활성화되지 않은 경우에는 NormalBorderBrush를, IsPressed가 True인 경우에는 PressedBorderBrush를, IsEnabled가 False인 경우에는 DisabledBorderBrush를 사용하여 설정됩니다.

  • Foreground 속성은 IsEnabled가 False인 경우 DisabledForegroundBrush를 사용하여 설정됩니다.

  • CheckMark 요소의 Stroke 속성은 GlyphBrush를 사용하여 "x" 표시를 그립니다.

Cc295106.7e183f1f-37d8-4dcb-980c-19a5d61ca087(ko-kr,Expression.10).gif맨 위로 이동

모범 사례 및 디자인 지침

  • 일반적으로 응용 프로그램 UI(사용자 인터페이스) 디자이너가 컨트롤에 시각적 요소를 더 추가할 수 있도록 하려면 템플릿의 루트로 Grid 컨트롤을 사용합니다. 기본적으로 Expression Blend에서는 Grid 컨트롤과 같은 레이아웃 패널을 찾아 활성화함으로써 아트보드에 추가되는 새 요소가 해당 레이아웃 패널의 자식 요소가 되도록 합니다.

  • 확인란의 콘텐츠는 ContentPresenter 요소에 의해 표시됩니다. ContentPresenter 요소는 템플릿이 적용되는 컨트롤의 Content 속성에 템플릿을 자동으로 바인딩합니다. 확인란에서 템플릿 부모의 콘텐츠를 표시하려면 이 요소가 있어야 합니다.

  • 경우에 따라 사용하고 있는 컨트롤에 특성이 부족하여 컨트롤 템플릿에서 바인딩하지 못할 수 있습니다. 예를 들어 CheckBox 컨트롤은 CheckMark 요소의 브러시를 설정하는 특성을 제공하지 않습니다. 이런 경우 CheckMark의 스트로크는 더 쉽게 변경할 수 있도록 브러시로 설정됩니다. CheckBox 컨트롤을 기반으로 사용자 지정 클래스를 만들고 바인딩할 특성을 더 추가하거나, 기존 특성 중 하나에 바인딩할 수 있습니다. 이 사용자 가이드의 실습 정보: 사용자 지정 WPF 컨트롤 만들기에서 사용자 지정 클래스의 예를 참조하십시오.

  • CheckMark 패스 요소를 표시하고 숨길 수 있기 때문에 Grid 요소의 크기는 고정되어 있습니다. Grid 요소의 크기가 고정되어 있지 않으면 확인란의 선택 여부가 변경될 때 ContentPresenter의 텍스트가 이동하게 됩니다. Grid 크기를 고정하고 CheckMark 패스를 숨기는 대신 CheckMark 패스 개체에 대한 Stroke 속성의 불투명도를 0으로 변경할 수도 있습니다.

Cc295106.7e183f1f-37d8-4dcb-980c-19a5d61ca087(ko-kr,Expression.10).gif맨 위로 이동

참조

개념

실습 정보: SimpleCheckBox의 선택 표시 모양 사용자 지정