WPF 그래픽, 애니메이션 및 미디어 개요

업데이트: 2007년 11월

이 항목에서는 그래픽, 전환 효과, 사운드 및 비디오를 응용 프로그램에 추가할 수 있게 하는 WPF(Windows Presentation Foundation)의 그래픽, 애니메이션 및 미디어 기능을 소개합니다.

WPF는 이전에 특수한 라이브러리(특히 Microsoft Windows GDI(그래픽 장치 인터페이스) 및 Microsoft Windows GDI+)에서만 사용할 수 있었던 기능인 고급 그리기 및 애니메이션 기능을 제공합니다. 이제 WPF는 멀티미디어, 벡터 그래픽, 애니메이션 및 콘텐츠 컴퍼지션에 대한 지원을 제공하므로 개발자는 흥미로운 사용자 인터페이스 및 콘텐츠를 쉽게 빌드할 수 있습니다. Microsoft Visual Studio .NET 또는 심지어 텍스트 편집기(예: Microsoft 메모장)를 사용하여 벡터 그래픽이나 복잡한 애니메이션을 만들고 미디어를 응용 프로그램에 통합할 수 있습니다.

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

  • WPF의 새로운 그래픽 및 멀티미디어 기능
  • 애니메이션
  • 미디어
  • 관련 항목

WPF의 새로운 그래픽 및 멀티미디어 기능

WPF는 다음과 같은 이점이 있는 새로운 그래픽 기능을 Windows 개발자에게 소개합니다.

  • 해상도 및 장치 독립적인 그래픽. WPF 그래픽 시스템에서는 해상도와 장치의 영향을 받지 않기 위해 장치 독립적 단위를 사용합니다. 각각의 장치 독립적 픽셀은 시스템의 dpi 설정에 맞게 자동으로 크기가 조정됩니다.

  • 향상된 정밀도. WPF 좌표 시스템은 float 대신에 double을 사용합니다. 변환 및 불투명도 값도 double을 사용하여 표현됩니다. 또한 WPF는 더 광범위한 색 영역(scRGB)을 지원하며 다른 색 공간으로부터의 입력을 관리하기 위한 통합 지원을 제공합니다.

  • 고급 그래픽 및 애니메이션 지원. WPF에서는 장면 그래프를 자동으로 관리함으로써 그래픽 프로그래밍이 간편해지므로 장면 처리, 렌더링 루프 및 이중 선형 보간에 대해 걱정할 필요가 없습니다. WPF에서는 적중 테스트를 지원하고 통합 애니메이션 시스템을 제공하며 알파 합성을 완전하게 지원합니다.

  • 하드웨어 가속. WPF 그래픽 시스템은 그래픽 하드웨어를 사용함으로써 CPU 사용률을 최소화하도록 디자인되었습니다.

2차원 도형

WPF에서는 다음 그림에 나오는 사각형 및 타원처럼 일반적인 벡터 기반의 2차원 도형 라이브러리를 제공합니다.

타원 및 사각형

이러한 내장 WPF 도형은 단순한 도형이 아닙니다. 이러한 도형은 키보드 및 마우스 입력을 포함한 대부분의 일반 컨트롤에서 사용자가 예상하는 대부분의 기능을 구현하는 프로그래밍 가능한 요소입니다.

<Window
  xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
  x:Class="Window1" >
  <Ellipse Fill="LightBlue" MouseUp="ellipseButton_MouseUp" />
</Window>
public partial class Window1  : Window
{
    void ellipseButton_MouseUp(object sender, MouseButtonEventArgs e)
    {
        MessageBox.Show("Me, a simple ellipse, was mouse clicked!");
    }
}

다음 그림에서는 위의 XAML 태그 및 코드 숨김에 대한 출력을 보여 줍니다.

"you clicked the ellipse!" 텍스트가 있는 창

자세한 내용은 WPF에서 Shape 및 기본 그리기 개요를 참조하십시오. 기본 샘플은 Shape 요소 샘플을 참조하십시오.

2차원 기하 도형

WPF가 제공하는 2차원 도형이 충분하지 않은 경우 기하 도형 및 경로에 대한 WPF 지원을 사용하여 고유한 도형을 만들 수 있습니다. 다음 그림은 기하 도형을 사용하여 도형을 그리기 브러시로 만들고 다른 WPF 요소를 클리핑하는 방법을 보여 줍니다.

Path의 다양한 용도

자세한 내용은 Geometry 개요를 참조하십시오. 기본 샘플은 기하 도형 샘플을 참조하십시오.

2차원 효과

WPF에서는 다양한 효과를 만들기 위해 사용할 수 있는 2차원 클래스 라이브러리가 제공됩니다. WPF의 2차원 렌더링 기능은 그라데이션, 비트맵, 그리기 및 비디오를 사용하여 UI 요소를 그리는 기능과 회전, 배율 조정 및 기울이기를 사용하여 이러한 요소를 조작하는 기능을 제공합니다. 다음 그림은 WPF 브러시를 사용하여 실현할 수 있는 많은 효과의 예제를 보여 줍니다.

여러 브러시의 설명

자세한 내용은 WPF 브러시 개요를 참조하십시오. 기본 샘플은 Brush 샘플을 참조하십시오.

3차원 렌더링

WPF는 더 흥미로운 레이아웃, UI 및 데이터 시각화를 만들 수 있도록 WPF의 2차원 그래픽 지원과 통합되는 3차원 렌더링 기능 집합을 제공합니다. 다음 그림에 나온 것처럼 스펙트럼의 한 쪽 끝에서 WPF를 사용하면 2차원 이미지를 3차원 도형의 표면 위에 렌더링할 수 있습니다.

Visual3D 샘플 스크린 샷

자세한 내용은 3차원 그래픽 개요를 참조하십시오. 기본 샘플은 3차원 단색 샘플을 참조하십시오.

애니메이션

애니메이션을 사용하면 컨트롤과 요소를 늘리거나 흔들거나 회전하거나 점점 흐리게 만들어 보다 효과적인 페이지 전달 효과를 줄 수 있습니다. WPF에서는 대부분의 속성에 애니메이션 효과를 줄 수 있으므로 대부분의 WPF 개체 뿐만 아니라 직접 만든 사용자 지정 개체에 WPF를 통해 애니메이션 효과를 줄 수 있습니다.

애니메이션 효과가 적용된 큐브의 이미지

자세한 내용은 애니메이션 개요를 참조하십시오. 기본 샘플은 애니메이션 예제 갤러리를 참조하십시오.

미디어

이미지, 비디오 및 오디오는 정보와 사용자 경험을 전달하기 위한 풍부한 미디어 방법입니다.

Images

아이콘, 배경 및 심지어 애니메이션의 일부를 포함하는 이미지는 대부분의 응용 프로그램에서 핵심 부분입니다. 이미지를 자주 사용해야 하므로 WPF에서는 다양한 방법으로 이미지를 작업할 수 있는 기능이 제공됩니다. 다음 그림에서는 이러한 방법 중 하나를 보여 줍니다.

스타일 샘플 스크린 샷

자세한 내용은 이미징 개요를 참조하십시오. 기본 샘플은 WPF 사진 뷰어 데모를 참조하십시오.

비디오 및 오디오

WPF의 그래픽 기능 중 핵심 기능은 비디오 및 오디오를 비롯한 멀티미디어 작업을 위한 기본 지원을 제공하는 것입니다. 다음 예제에서는 미디어 플레이어를 응용 프로그램에 삽입하는 방법을 보여 줍니다.

<MediaElement Source="media\numbers.wmv" Width="450" Height="250" />

MediaElement는 비디오와 오디오를 모두 재생할 수 있으며 사용자 지정 UI를 쉽게 만들 수 있는 충분한 확장성을 갖고 있습니다.

자세한 내용은 멀티미디어 개요를 참조하십시오. 기본 샘플은 미디어 갤러리를 참조하십시오.

참고 항목

개념

성능 최적화: 2차원 그래픽 및 이미징

WPF에서 Shape 및 기본 그리기 개요

단색 및 그라데이션을 사용한 그리기 개요

이미지, 그림 및 시각적 표시로 그리기

애니메이션 개요