트리거를 사용하여 WPF 컨트롤의 동작 정의

[!참고]

Microsoft Silverlight 프로젝트에서는 트리거를 사용할 수 없습니다. Silverlight 응용 프로그램에서 사용자 상호 작용은 이벤트 처리기 또는 상태를 사용하여 수행할 수 있습니다. 자세한 내용은 사용자 상호 작용에 대한 응답의 상태 변경을 참조하십시오.

응용 프로그램을 사용하는 동안 사용자 인터페이스에 있는 개체는 그 상태가 계속 변하게 됩니다. 단추 위에 마우스를 놓은 상태 또는 메뉴 항목을 누른 상태와 같이 상태는 종종 사용자 관점에서 표현됩니다. 이와 같은 두 가지 예의 상태는 각각 UIElement.IsMouseOver 속성과 MenuItem.IsPressed 속성을 사용하여 개체에 구현됩니다.

그러나 이러한 속성의 값은 상태를 나타내기 때문에 그 자체로는 사용자에게 표시되지 않습니다. IsMouseOver와 IsPressed는 가시적 속성이 아닙니다. 비가시적 속성의 변경을 관찰하려면 비가시적 속성의 변경이 가시적 속성(예: Background 또는 Opacity)의 변경을 트리거해야 합니다. 예를 들어 단추 위에 마우스를 놓은 상태가 되면 평면이던 단추가 곡선으로 나타나거나, 메뉴 항목을 누른 상태가 되면 그 배경색이 변하게 됩니다.

개체에서는 상태가 변경될 뿐만 아니라 이벤트가 발생하기도 합니다. 예를 들어 포인터가 단추 영역으로 들어가거나 벗어날 때 단추는 MouseEnter 및 MouseLeave 이벤트를 발생시킵니다. 이벤트에도 고유한 모양이 없으므로 가시적 속성의 변경을 트리거해야 사용자가 확인할 수 있습니다.

트리거 및 애니메이션 타임라인은 문서의 루트 또는 컨트롤에 적용되는 스타일에서 만들 수 있습니다. 예를 들어 단추의 누른 상태와 롤오버 상태가 변경될 때 단추의 모양이 약간 변경되도록 하려는 경우 단추의 스타일을 수정할 수 있습니다. 스타일이 적용되는 모든 단추는 같은 방식으로 작동합니다. 실습 정보: 단추에 애니메이션 추가에서 예를 참조하십시오.

다음과 같은 두 가지 형식의 트리거가 있습니다.

• 속성 트리거 - 한 속성의 변경이 다른 속성에서 즉각적인 변화 또는 애니메이션 변화를 트리거하는 메커니즘입니다.

• 이벤트 트리거 - 이벤트가 속성의 애니메이션 변화를 트리거하는 메커니즘입니다.

다음 그림은 두 가지 속성 트리거(IsMouseOver 및 IsPressed)와 이벤트 트리거(target-element.Loaded)가 있는 트리거 사용자 인터페이스를 보여 줍니다. IsMouseOver 속성 트리거를 선택할 때 변경되는 속성(Border.Background)과 트리거되는 타임라인(OnLoaded1) 표시

트리거 사용에 대한 예는 트리거 추가 또는 제거 및 간단한 애니메이션 만들기를 참조하십시오.

속성 트리거

속성 트리거는 조건이 충족될 때 발생하는 액션과 함께 트리거 조건을 정의합니다. 조건 예는 "button1의 IsMouseOver 속성이 true인 경우"이고 액션 예는 "button1의 Foreground 속성을 Red로 설정하고 단추의 비율 크기를 더 크게 조정하는 Expand 애니메이션 시작"입니다.

"Foreground가 Red로 설정"은 속성 setter라는 액션의 예입니다. setter는 조건이 충족되는 동안에만 적용되며 조건이 더 이상 충족되지 않으면 이전 값으로 속성을 되돌립니다. Expand 애니메이션 시작은 시작(Enter) 액션의 예이며 조건이 충족되면 이 액션이 발생합니다. 조건이 더 이상 충족되지 않으면 종료(Exit) 액션이 발생합니다. 애니메이션은 시작 또는 종료 액션을 통해서만 제어할 수 있습니다. 다음 그림은 이러한 속성 트리거 예의 수명 주기를 보여 줍니다.

setter가 전체 수명 주기에 걸쳐 Foreground 속성을 제어하기에 충분하고 5단계에서는 Foreground가 Black으로 자동으로 다시 설정됩니다. 그러나 시작 액션에 의해 수행된 모든 속성 애니메이션은 실행 취소되지 않고 5단계에서 단추의 비율은 계속 더 큰 크기로 조정됩니다. 단추의 비율을 다시 줄이는 Contract 애니메이션을 디자인한 다음 종료 액션에서 이 새로운 애니메이션을 시작하여 문제를 해결할 수 있습니다.

속성 트리거는 스타일이나 템플릿에만 정의할 수 있지만 일반적으로 트리거를 사용할 때는 가능하면 템플릿에 트리거를 넣는 것이 가장 좋습니다.

이벤트 트리거

이벤트 트리거는 조건이 충족될 때 발생하는 액션과 함께 트리거 조건을 정의합니다. 조건 예는 "button1에서 MouseEnter 이벤트가 발생하는 경우"이고 액션 예는 "단추의 비율 크기를 더 크게 조정하는 Expand 애니메이션 시작"입니다.

액션 예는 위의 속성 트리거 예에서 사용된 시작 액션과 동일합니다. 이벤트 트리거는 속성 트리거와 같은 수명 주기가 있는 것이 아니라 이벤트에 대한 응답으로 액션을 실행합니다. 따라서 이벤트 트리거에는 시작 액션과 종료 액션이 따로 있지 않습니다.

포인터가 단추 영역으로 들어갈 때 단추의 비율 크기가 커지고 단추 영역을 벗어날 때 정상 크기로 돌아오게 하려면, 이벤트 트리거 쌍과 보조 비율 크기 조정 애니메이션을 함께 정의해야 합니다. 이벤트 트리거는 스타일, 템플릿 또는 LayoutRoot에 정의할 수 있습니다.

속성 트리거 또는 이벤트 트리거

종종 이벤트 집합으로 속성을 미러링하고 속성 트리거를 디자인할지 두 개의 이벤트 트리거를 디자인할지 결정하게 됩니다. 예를 들어 IsMouseOver 속성 트리거를 사용하거나 MouseEnter와 MouseLeave 이벤트 트리거 쌍을 사용하여 동일한 결과를 얻을 수 있습니다. 가능하면 속성 트리거를 사용하고 스타일이나 템플릿 내에 위치하지 않은 경우처럼 꼭 필요한 경우에만 이벤트 트리거를 사용하십시오. 이벤트 트리거를 사용하여 setter의 부족을 보완해야 하는 경우에는 0 시간에 있는 키 프레임으로 애니메이션 쌍을 만들 수 있습니다.

트리거 또는 이벤트 처리기 메서드

이벤트 처리기를 사용하면 트리거로 수행할 수 있는 모든 작업을 수행하고 다른 요소에 속성 설정, 새 문서 로드, 새 요소 만들기 등의 다른 프로그래밍 논리를 추가할 수 있습니다. 이는 이벤트 처리기 메서드가 문서의 코드 숨김 파일에서 C# 또는 Microsoft Visual Basic .NET으로 정의되기 때문입니다. 자세한 내용은 이벤트에 응답하는 코드 작성를 참조하십시오.

트리거를 사용하거나 이벤트 처리기 메서드를 사용하여 연결할 수 있는 이벤트 목록은 컨트롤, 속성 및 이벤트 참조를 참조하십시오.

참조

작업

스토리보드의 실행 시점 제어