CheckBox 컨트롤 스타일 적용 팁

아티클
10/11/2017

Ee371151.0b2c798e-86c6-4ea2-a8a6-5cf1f12be1e2(KO-KR,Expression.30).png

CheckBox 컨트롤은 마우스, 키보드 또는 기타 입력 장치로부터의 사용자 입력에 반응하는 개체를 나타냅니다. 이 개체에는 각각 연관된 이벤트를 발생시키는 서로 다른 세 상태(Checked, Indeterminate, Unchecked)가 차례로 적용됩니다.

모든 컨트롤과 마찬가지로 CheckBox 컨트롤도 기본 모양과 완전히 다르게 수정할 수 있습니다. CheckBox 컨트롤의 기본 모양은 다음과 같습니다.

Ee371151.1b2a1e45-ffdd-4ac8-941a-d6625b797fd0(KO-KR,Expression.30).png

원하는 CheckBox 컨트롤 속성 설정

CheckBox 컨트롤은 콘텐츠 컨트롤이므로 속성 패널의 공용 속성에서 Content 속성을 설정하여 CheckBox 컨트롤에 텍스트를 표시할 수 있습니다.

ClickMode 속성을 설정하면 Click 이벤트가 발생하는 시기(마우스를 클릭하거나 놓을 때 또는 포인터를 CheckBox 컨트롤 위에 놓을 때)를 확인할 수 있습니다.

또한 IsChecked 속성을 설정하여 CheckBox 컨트롤을 Checked 상태로 표시하고 IsThreeState 속성을 설정하여 CheckBox 컨트롤이 Checked 및 Unchecked 상태 이외에 Indeterminate 상태를 사용하도록 할 수 있습니다.

기본 시스템 템플릿을 사용하는 CheckBox 컨트롤의 Checked 상태

Ee371151.df888d99-f032-4084-a93e-3de14ad1c19c(KO-KR,Expression.30).png

다음과 같은 방법으로 이러한 속성을 설정할 수 있습니다.

개체 속성 설정 - 아트보드에서 CheckBox 개체를 그린 후에 개체의 속성을 직접 설정할 수 있습니다. 여러 CheckBox 컨트롤이 같은 값을 사용하도록 하려면 이러한 속성을 스타일에서 설정하면 됩니다.
스타일에서 속성 설정 이러한 속성을 CheckBox 개체의 스타일에서 설정하는 경우에는 해당 스타일을 사용하는 모든 CheckBox 개체가 해당 값을 사용합니다. 특정 개체의 값을 덮어쓸 수 있습니다.

자세한 내용은 스타일 만들기을 참조하십시오.

CheckBox 컨트롤의 모양은 컨트롤의 상태에 따라 변경됩니다. 템플릿 편집 모드에서 상태 패널의 상태를 선택하여 각 상태의 모양을 수정할 수 있습니다. 자세한 내용은 다음 목록에 나오는 상태 및 컨트롤에 대해 다른 시각적 상태 정의를 참조하십시오.

CheckBox 컨트롤을 클릭할 때 수행되는 작업을 지정하려면 동작을 CheckBox 개체 또는 CheckBox 템플릿의 개체로 끌어 놓습니다. 자세한 내용은 개체에 동작 추가을 참조하십시오.

필요한 경우에는 Click 이벤트를 이벤트 처리기로 연결할 수 있습니다. 자세한 내용은 이벤트에 응답하는 코드 작성을 참조하십시오.

CheckBox 템플릿의 파트

CheckBox 컨트롤에는 파트가 없습니다.

CheckBox 컨트롤 상태

기본적으로 CheckBox 컨트롤은 CommonStates 상태 그룹에서 다음 네 상태 중 하나일 수 있습니다. 이 상태는 CheckBox 템플릿을 수정할 때 상태 패널에서 볼 수 있습니다.

상태 이름	설명
Normal	CheckBox 컨트롤과의 상호 작용이 없을 때의 컨트롤 모양입니다.
MouseOver	사용자가 CheckBox 컨트롤 위로 포인터를 이동할 때의 컨트롤 모양입니다.
Pressed	사용자가 CheckBox 컨트롤을 클릭하거나 컨트롤에 초점이 있을 때 사용자가 Enter 키 또는 스페이스바를 누르는 경우의 컨트롤 모양입니다.
Disabled	IsEnabled 속성이 False로 설정되어 있을 때의 CheckBox 컨트롤 모양입니다.

CheckBox 컨트롤은 FocusStates 상태 그룹의 다음 두 상태 중 하나일 수 있습니다.

상태 이름	설명
Unfocused	키보드 초점이 없을 때의 CheckBox 컨트롤 모양입니다.
Focused	키보드 초점이 있을 때의 CheckBox 컨트롤 모양입니다. 예를 들어 사용자가 Tab 키를 눌러 CheckBox 컨트롤에 키보드 초점이 있을 때까지 응용 프로그램의 개체를 차례로 이동할 수 있습니다.

CheckBox 컨트롤은 CheckStates 상태 그룹의 다음 세 상태 중 하나일 수 있습니다.

상태 이름	설명
Unchecked	IsChecked 속성이 False로 설정되어 있을 때의 CheckBox 컨트롤 모양입니다.
Checked	IsChecked 속성이 True로 설정되어 있을 때의 CheckBox 컨트롤 모양입니다.
Indeterminate	IsThreeState 속성이 True로 설정되고 IsChecked 속성이 Null로 설정될 때 CheckBox 컨트롤 모양입니다.

팁:
상태 그룹에는 동일한 논리적 범주에 속하며 동시에 표시될 수 없는 시각적 상태가 포함됩니다. 예를 들어 CommonStates 그룹에는 마우스 등의 입력 장치에 대한 사용자의 상호 작용과 관련된 상태가 포함됩니다. 단일 상태 그룹의 상태는 한 번에 하나씩만 표시될 수 있지만, 서로 다른 상태 그룹의 각 상태는 동시에 표시될 수 있습니다.

상태 그룹에는 동일한 논리적 범주에 속하며 동시에 표시될 수 없는 시각적 상태가 포함됩니다. 예를 들어 CommonStates 그룹에는 마우스 등의 입력 장치에 대한 사용자의 상호 작용과 관련된 상태가 포함됩니다. 단일 상태 그룹의 상태는 한 번에 하나씩만 표시될 수 있지만, 서로 다른 상태 그룹의 각 상태는 동시에 표시될 수 있습니다.

상태를 선택하면 상태 기록이 켜지고 해당 상태에 적용하는 모든 변경 내용이 기록됩니다. 상태 기록을 끄려면 아트보드에서 기록 단추 Ee371151.0dcc6415-6d4e-4fcf-a9a3-eb4664cb6cbc(KO-KR,Expression.30).png 를 클릭하거나 상태 패널에서 기준을 선택합니다. 서로 다른 두 상태가 활성화되어 있을 때 컨트롤 모양을 수정하려면 한 상태 그룹의 상태 미리 보기를 고정하고 다른 상태 그룹의 상태를 수정하면 됩니다.

개체를 CheckBox 컨트롤로 변환

CheckBox 컨트롤에는 파트가 없으므로 모든 개체를 CheckBox 컨트롤로 변환할 수 있습니다.

개체를 레이아웃 패널로 그룹화하고 레이아웃 패널을 선택한 다음 도구 메뉴에서 컨트롤로 만들기를 클릭합니다.
대화 상자가 나타나면 CheckBox을 선택하고 템플릿 이름을 지정한 다음 템플릿을 저장할 위치를 선택합니다.

위치에 대한 자세한 내용은 리소스 만들기를 참조하십시오.
확인을 클릭하고 나면 Microsoft Expression Blend가 템플릿 편집 모드로 전환되며 CheckBox 컨트롤을 구성하는 개체가 표시됩니다.
원본 개체 그룹이 TextBlock 개체 를 포함하고 있는 경우 TextBlock 개체는 CheckBox 컨트롤 템플릿에서 ContentPresenter 개체 로 변환됩니다. 이렇게 하면 CheckBox 개체가 텍스트를 표시할 수 있습니다. 원본 개체가 TextBlock 개체를 포함하지 않는 경우 ContentPresenter 개체는 자동으로 템플릿에 추가됩니다. 이 템플릿이 적용되는 CheckBox 개체의 Content 속성에 텍스트를 표시할 필요가 없는 경우 ContentPresenter 개체를 삭제할 수 있습니다.
이 모드에서 템플릿을 계속 수정할 수 있습니다. 예를 들어 개체를 추가 또는 수정하거나 상태 패널에서 상태를 선택해 해당 상태일 때의 템플릿 모양을 수정할 수 있습니다.
템플릿에 있는 개체의 일부 브러시 속성을 템플릿을 사용할 CheckBox 개체의 다음 속성에 바인딩할 수 있습니다.
- 배경
- BorderBrush
- Foreground
- BorderThickness
자세한 내용은 개체 속성을 템플릿으로 연장을 참조하십시오.
템플릿 편집 모드를 종료하려면 아트보드 위쪽의 이동 경로 탐색 막대에서 **[CheckBox]**를 클릭하거나 개체 및 타임라인 패널에서 범위를 UserControl1(으)로 되돌립니다.를 클릭합니다.