RadioButton 컨트롤 스타일 지정 팁

아티클
10/11/2017

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

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

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

Ee341408.a79fb949-5f67-4c15-afd5-5f28abd2ae07(KO-KR,Expression.30).png

원하는 RadioButton 컨트롤 속성 설정

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

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

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

여러 RadioButton 개체가 연결되어 있는 경우에는 실행 중인 응용 프로그램에서 개체를 한 번에 하나씩만 선택할 수 있습니다. GroupName 속성에 같은 이름을 입력하면 여러 RadioButton 개체를 연결할 수 있습니다. 기본적으로 Microsoft Expression Blend에서 아트보드에 추가되는 모든 RadioButton 개체에는 빈 GroupName 속성이 연결됩니다.

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

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

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

RadioButton 컨트롤의 모양은 컨트롤의 상태에 따라 변경됩니다. 템플릿 편집 모드에서 상태 패널의 상태를 선택하여 각 상태의 모양을 수정할 수 있습니다.

자세한 내용은 다음 목록의 상태와 컨트롤에 대해 다른 시각적 상태 정의를 참조하십시오.

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

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

RadioButton 템플릿의 파트

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

RadioButton 컨트롤 상태

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

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

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

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

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

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

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

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

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

개체를 RadioButton 컨트롤로 변환

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

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

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