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

나만의 사용자 정의 컨트롤을 직접 만들 때, 상태 및 상태 그룹을 추가하여 해당 상태에 따라 사용자 정의 컨트롤의 모양을 변경할 수 있습니다. 마우스 클릭 같은 사용자 상호 작용에 대한 응답으로 이러한 상태를 변경하려면 이벤트 처리기 메서드를 추가하여 GoToState 메서드를 호출합니다.

자세한 내용은 MSDN의 GoToState를 참조하십시오.

[!참고]

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

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

상태를 변경하려면 GoToStateAction 동작을 사용하거나 이벤트 핸들러 메서드를 사용합니다.

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

다음 절차는 이벤트 핸들러 메서드를 상태 변경에 추가하는 방법을 보여 줍니다.

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

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

    Dd185503.74c3b2ef-32ab-4aaa-839d-852741d9b2c2(KO-KR,Expression.30).png

  2. 상태에서 Base를 선택하여 상태 기록 모드를 해제합니다.

  3. 개체 및 타임라인 패널에서 [UserControl] 개체를 선택하여 전체 사용자 정의 컨트롤의 표면 영역 위의 동작에 대해 응답할 이벤트를 연결합니다.

  4. 속성 패널에서 이벤트 Dd185503.6c67bb3b-e8a2-4a63-bad5-54d5c15b04dd(KO-KR,Expression.30).png를 클릭하여 속성 보기에서 이벤트 보기로 전환합니다.

    Dd185503.alert_tip(KO-KR,Expression.30).gif팁:

    속성 패널을 속성 보기로 다시 전환하려면 속성 Dd185503.cee1494c-ef95-4dd4-9fbc-9d02edfa78b7(KO-KR,Expression.30).png을 클릭하십시오.

  5. MouseLeftButtonDown 이벤트 옆에 "goClick" 같은 이벤트 처리기 메서드 이름을 입력합니다.

    Dd185503.98d2b5bb-eedc-4a13-bf87-7b7514868f87(KO-KR,Expression.30).png

    Dd185503.alert_tip(KO-KR,Expression.30).gif팁:

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

    Enter 키를 누르면 Microsoft Expression Blend에서 사용자 정의 콘트롤의 코드 숨김 파일을 코드 편집기에 열고 이벤트 핸들러 메서드의 코드를 붙여 넣습니다.

    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 키)한 다음 사용자 정의 컨트롤을 클릭하여 상태를 변경하는지 확인합니다.

문제 해결

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

  • Visual Studio 2008에서 "솔루션을 로드할 수 없습니다."라는 오류 메시지가 나타나면 Visual Studio 2008용 Microsoft Silverlight Tools를 설치하지 않은 경우일 수 있습니다. 해당 도구를 설치한 다음 Expression Blend의 이벤트 패널에 이름을 입력합니다.

    자세한 내용은 Microsoft을 참조하십시오.

  • 프로젝트를 테스트(F5 키)할 때 사용자 정의 컨트롤이 표시되지 않는데도 브라우저 창에 오류 메시지가 나타나지 않으면 시작 문서에 사용자 정의 컨트롤 인스턴스를 그리지 않은 것일 수 있습니다. 시작 문서는 응용 프로그램을 실행할 때 나타나는 첫 번째 문서입니다. 별도의 문서에 사용자 정의 컨트롤을 만들 경우에는 프로젝트를 빌드(Ctrl+Shift+B)하고 시작 문서(대개 Page.xaml)를 연 다음 자산 패널을 열고(자산 Dd185503.0d8b8d29-1af9-418f-8741-be3097d76eab(KO-KR,Expression.30).png 클릭) 프로젝트 범주에서 사용자 지정 컨트롤을 선택한 다음 아트보드에 사용자 정의 컨트롤을 그려야 합니다.

  • 응용 프로그램 빌드 시 문제가 발생하면 잘못된 Silverlight 버전을 설치한 것일 수 있습니다.

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

다음 단계