Blend에서 사용자 상호 작용에 대한 응답의 상태 변경

  • 아티클

자신의 사용자 정의 컨트롤을 만드는 경우 상태 및 상태 그룹을 추가하여 해당 상태에 따라 사용자 정의 컨트롤의 모양을 변경할 수 있습니다. 사용자 상호 작용(예: 클릭)에 대한 응답으로 이러한 상태를 변경하려면 이벤트 처리기 메서드를 추가하여 GoToState 메서드를 호출합니다.

참고

Microsoft Silverlight 프로젝트에서 단추와 같은 시스템 컨트롤의 템플릿을 수정하는 경우 사용자 상호 상호 작용에 대한 컨트롤의 응답뿐 아니라 기본 상태가 이미 정의되어 있습니다.기본 상태는 추가하거나 제거할 수 없습니다.하지만 다음 절차에 따라 상태를 변경하여 여러 상태에서의 컨트롤 모양을 변경할 수 있습니다.

클릭에 대한 응답으로 상태 변경

GoToStateAction 동작이나 이벤트 처리기 메서드를 사용하여 상태를 변경할 수 있습니다.

동작 사용에 대한 자세한 내용은 개체에 동작 추가를 참조하세요.

이벤트 처리기 메서드를 추가하여 상태를 변경하는 방법이 다음 절차에 나와 있습니다.

클릭에 대한 응답으로 상태를 변경하려면

  1. 상태 그룹 및 상태를 아직 만들지 않았다면 사용자 정의 컨트롤에 대한 여러가지 시각적 상태 및 전환을 정의할 수 있습니다. 예를 들어 다음 그림에는 카드 게임의 카드를 나타내는 사용자 정의 컨트롤이 나와 있습니다. SideDisplayed 상태 그룹에는 카드 앞면을 표시하는 상태(FaceUp)와 카드 뒷면을 표시하는 상태(FaceDown)가 포함되어 있습니다.

    자세한 내용은 사용자 정의 컨트롤의 다양한 시각적 상태 및 전환 시간 정의을 참조하십시오.

    JJ170611.74c3b2ef-32ab-4aaa-839d-852741d9b2c2(ko-kr,VS.120).png

  2. 상태에서 기본을 선택하여 상태 기록을 해제합니다.

  3. 개체 및 타임라인 패널에서, [UserControl] 개체를 선택하여 전체 사용자 정의 컨트롤 노출 영역을 통한 작업에 응답할 이벤트를 연결합니다.

  4. 속성 패널에서 이벤트 JJ170611.6c67bb3b-e8a2-4a63-bad5-54d5c15b04dd(ko-kr,VS.120).png를 클릭하여 속성 보기에서 이벤트 보기로 전환합니다.

    팁

    속성 패널에서 다시 속성 보기로 전환하려면 속성 JJ170611.cee1494c-ef95-4dd4-9fbc-9d02edfa78b7(ko-kr,VS.120).png을 클릭합니다.

  5. MouseLeftButtonDown 이벤트 옆에 이벤트 처리기 메서드의 이름(예: "goClick")을 입력합니다.

    팁

    또는 이벤트 텍스트 상자를 두 번 클릭하여 이벤트 처리기 메서드의 기본 이름을 생성할 수도 있습니다.

    ENTER 키를 누르면 Blend for Visual Studio가 코드 편집기에 사용자 정의 컨트롤에 대한 코드 숨김 파일을 열고 이벤트 처리기 메서드 코드를 붙여넣습니다.

    private void goClick(object sender, MouseButtonEventArgs e)
{

}

    Private Sub goClick(ByVal sender As System.Object, ByVal e As System.Windows.Input.MouseButtonEventArgs)

End Sub

    자세한 내용은 코드 숨김 파일 수정을 참조하십시오.

  6. 사용자 정의 컨트롤에 의해 상태가 변경되도록 하기 위해, 상태 이름이 포함된 GoToState 메서드를 호출합니다. 예를 들어 다음과 같은 굵은 글꼴 코드를 코드 숨김 파일에 붙여넣습니다.

    private bool isFaceUp = false;  

private void goClick(object sender, MouseButtonEventArgs e)
{
  if (isFaceUp)  
  {  
    VisualStateManager.GoToState(this, "FaceDown", true);  
  }  
  else  
  {  
    VisualStateManager.GoToState(this, "FaceUp", true);  
  }  
  isFaceUp = !isFaceUp;  
}

    Private isFaceUp As Boolean = False  

Private Sub goClick(ByVal sender As System.Object, ByVal e As System.Windows.Input.MouseButtonEventArgs)
  If isFaceUp Then  
    VisualStateManager.GoToState(Me, "FaceDown", True)  
  Else  
    VisualStateManager.GoToState(Me, "FaceUp", True)  
  End If  
  isFaceUp = Not (isFaceUp)  
End Sub

  7. 프로젝트를 빌드합니다(Ctrl+Shift+B).

  8. 프로젝트를 테스트한(F5) 다음 사용자 정의 컨트롤을 클릭하여 상태가 변경되는지 확인합니다.

JJ170611.collapse_all(ko-kr,VS.120).gif문제 해결

  • 만약 Blend의 이벤트 패널에 이름을 입력했을 때 "코드 숨김 파일을 변경할 수 없습니다. 다음 클래스가 없습니다."라는 오류가 발생하면 외부 코드 편집기(대개 Microsoft Visual Studio)로 전환하여 솔루션을 다시 로드해야 합니다. 다시 로드하면 누락된 클래스를 정의하는 새 파일이 포함됩니다.

  • Visual Studio 2010에서 "솔루션을 로드할 수 없습니다."라는 오류가 발생한 경우에는 Visual Studio 2010용 Silverlight Tools이 설치되어 있지 않은 것일 수 있습니다. 이 도구를 설치한 다음 Blend의 이벤트 패널에 이름을 다시 입력해 보세요.

    자세한 내용은 Microsoft Visual Studio 2010용 Silverlight Tools를 참조하세요.

  • 프로젝트를 테스트(F5)할 때 사용자 정의 컨트롤을 확인할 수 없는데 브라우저 창에서 오류가 표시되지 않는 경우에는 시작 문서에서 사용자 정의 컨트롤에 대한 인스턴스를 작성하지 않은 것일 수 있습니다. 시작 문서란 응용 프로그램을 실행할 때 표시되는 첫 문서입니다. 사용자 정의 컨트롤을 별도의 문서에 작성한 경우에는 프로젝트를 빌드하고(Ctrl+Shift+B), 시작 문서(일반적으로 Page.xaml)를 열고, 자산 패널을 열고(자산 JJ170611.0d8b8d29-1af9-418f-8741-be3097d76eab(ko-kr,VS.120).png 클릭), 프로젝트 범주에서 사용자 정의 컨트롤을 선택한 다음 아트보드에 사용자 정의 컨트롤을 그려야 합니다.

  • 응용 프로그램을 빌드하는 데 문제가 있다면 올바른 버전의 Silverlight가 설치되지 않은 것일 수 있습니다.

    자세한 내용은 Blend용 Silverlight 도구 및 런타임 설치을 참조하십시오.

JJ170611.collapse_all(ko-kr,VS.120).gif다음 단계