Windows Phone의 조작 이벤트 처리 방법

2013-12-05

적용 대상: Windows Phone 8 | Windows Phone OS 7.1

 

조작 이벤트를 처리하는 것은 터치 입력을 처리하기 위한 하나의 메서드입니다. 이러한 이벤트를 사용하면 터치와 멀티 터치 입력에 응답하여 개체를 이동하고 배율을 조정할 수 있습니다.

터치 입력 처리를 위한 다른 메서드에 대한 자세한 내용은 빠른 시작: Windows Phone의 터치 입력을 참조하세요.

이 항목에는 다음 단원이 포함되어 있습니다.

 

조작 이벤트는 UIElement에서 파생된 개체에 대해 지원됩니다.

다음의 조작 이벤트가 지원됩니다.

다음의 제스처 이벤트가 지원됩니다.

다음 항목은 Windows Phone 플랫폼에서 지원되지 않습니다.

  • IsManipulationEnabled 속성은 지원되지 않습니다. 조작 이벤트는 Windows Phone 에서 기본적으로 사용할 수 있습니다.

  • 회전 변환은 지원되지 않습니다.

  • 관성 이벤트는 지원되지 않습니다.

이 예제에서는 Canvas에 파란색 직사각형이 포함된 단순한 앱을 만듭니다. 이 앱은 여러 조작 이벤트를 신청합니다. 이 이벤트 처리기는 사용자가 Rectangle을 조작할 때 이를 이동시키거나 크기를 변경합니다. 또한 이벤트 처리기는 사각형을 이동하거나 그 크기를 바꿀 때 사각형의 색을 변경합니다.

터치 입력이 위치를 변경하면 ManipulationDelta 이벤트가 발생합니다. 이 이벤트는 조작하는 동안 여러 번 발생할 수 있습니다. 예를 들어 화면에서 손가락을 끌면 손가락이 움직이는 동안 ManipulationDelta 이벤트가 여러 번 발생합니다. 사용자가 손가락을 들어 올린 후에도 이 이벤트가 발생할 수 있습니다.

조작 이벤트를 사용하여 터치 입력을 처리하려면

  1. Visual C# 또는 Visual Basic에서 새 Windows Phone 프로젝트를 만듭니다.

  2. MainPage.xaml에서, 다음 XAML을 ContentPanel라는 Grid의 내부에 추가합니다.

    <Canvas>
        <Rectangle 
            x:Name="rectangle"
            Width="200" Height="200"
            Fill="Blue" Stroke="Blue" StrokeThickness="1" />
    </Canvas>
    
  3. MainPage.xaml.cs의 MainPage 클래스에서 다음 네임스페이스를 가져옵니다.

    using System.Windows.Media;
    using System.Windows.Input;
    
  4. MainPage 클래스에서 다음 변수를 선언합니다.

            private TranslateTransform move = new TranslateTransform();
            private ScaleTransform resize = new ScaleTransform();
            private TransformGroup rectangleTransforms = new TransformGroup();
    
            private Brush stationaryBrush;
            private Brush transformingBrush = new SolidColorBrush(Colors.Orange);
    
    
  5. MainPage 클래스에서 ManipulationStarted 이벤트에 대한 다음 이벤트 처리기를 추가합니다. 조작이 시작되면 이 이벤트 처리기는 Rectangle의 색을 변경합니다.

            void Rectangle_ManipulationStarted(object sender, ManipulationStartedEventArgs e)
            {
                // Save the original color before changing the color.
                stationaryBrush = rectangle.Fill;
                rectangle.Fill = transformingBrush;
            }
    
    
    
  6. MainPage 클래스에서 ManipulationDelta 이벤트에 대한 다음 이벤트 처리기를 추가합니다. 이 이벤트 처리기는 조작 시 DeltaManipulationRectangleRenderTransform에 적용하여 이것을 이동하고 그 크기를 변경합니다.

            void Rectangle_ManipulationDelta(object sender, ManipulationDeltaEventArgs e)
            {
                // Move the rectangle.
                move.X += e.DeltaManipulation.Translation.X;
                move.Y += e.DeltaManipulation.Translation.Y;
    
                // Resize the rectangle.
                if (e.DeltaManipulation.Scale.X > 0 && e.DeltaManipulation.Scale.Y > 0)
                {
                    // Scale the rectangle.
                    resize.ScaleX *= e.DeltaManipulation.Scale.X;
                    resize.ScaleY *= e.DeltaManipulation.Scale.Y;
                }
            }
    
    
  7. MainPage 클래스에서 ManipulationCompleted 이벤트에 대한 다음 이벤트 처리기를 추가합니다. 조작이 끝나면 이 이벤트 처리기는 Rectangle의 원래 색을 복원합니다.

            void Rectangle_ManipulationCompleted(object sender, ManipulationCompletedEventArgs e)
            {
                // Restore the original color.
                rectangle.Fill = stationaryBrush;
            }
    
    
    
  8. MainPage 클래스 생성자에서 두 개의 변환을 TransformGroup에 결합하고 이벤트 처리기를 등록합니다.

            // Constructor
            public MainPage()
            {
                InitializeComponent();
    
                // Combine the moving and resizing tranforms into one TransformGroup.
                // The rectangle's RenderTransform can only contain a single transform or TransformGroup.
                rectangleTransforms.Children.Add(move);
                rectangleTransforms.Children.Add(resize);
                rectangle.RenderTransform = rectangleTransforms;
    
                // Handle manipulation events.
                rectangle.ManipulationStarted +=
                    new EventHandler<ManipulationStartedEventArgs>(Rectangle_ManipulationStarted);
                rectangle.ManipulationDelta +=
                    new EventHandler<ManipulationDeltaEventArgs>(Rectangle_ManipulationDelta);
                rectangle.ManipulationCompleted +=
                    new EventHandler<ManipulationCompletedEventArgs>(Rectangle_ManipulationCompleted);
            }
    
    
  9. 프로젝트를 빌드하고 실행합니다. 파란색 사각형이 앱 창에 나타납니다.

  10. 다음 조작으로 앱 테스트를 시도합니다. 다음 중 두 가지 이상의 작업을 동시에 수행할 수 있습니다.

    • Rectangle을 이동하려면 Rectangle에 한 손가락을 놓고 화면에서 손가락을 움직입니다.

    • Rectangle의 크기를 조정하려면 Rectangle에 두 손가락을 놓은 다음 손가락을 모으거나 벌립니다.

      참고참고:

      Windows Phone 에뮬레이터는 마우스를 통한 멀티 터치 입력을 지원하지 않습니다. 배율 변환을 사용하여 사각형의 크기를 변경하려면, 실제 단말기에서 앱을 테스트하거나 멀티 터치 입력을 지원하는 개발 컴퓨터가 있어야 합니다.

Windows Phone 8 에서, ManipulationCompleted 이벤트는 Panorama, PivotLongListSelector 컨트롤에 대해 UI가 더 잘 작동하도록 처리된 것으로 표시됩니다.

Windows Phone 8 에서 다음 코드를 사용하여 지정된 컨트롤 중 하나에 대한 ManipulationCompleted 이벤트를 처리하려는 경우, 코드는 실행되지 않습니다. Windows Phone OS 7.1 에서는, 이 코드가 실행됩니다.

myPivot.ManipulationCompleted += (s, e) =>
{
    ...
}

Windows Phone 8 및 Windows Phone OS 7.1 모두에서 ManipulationCompleted 이벤트를 처리하려면 AddHandler 메서드를 사용하세요. 예를 들면 다음과 같습니다.

this.myPivot.AddHandler(Pivot.ManipulationCompletedEvent,
    new EventHandler<ManipulationCompletedEventArgs>
    (MyPivot_ManipulationCompleted), true);

표시:
© 2014 Microsoft