차세대 User Experience 위한 개발 플랫폼Windows Presentation Foundation김태영김태영책임 컨설턴트책임 컨설턴트.NETXPERT.NETXPERT

ExperienceExperience 의 세계의 세계

비전 : 새로운 클라이언트 경험을 통해서 개발자들이 고객의 요구를 수용할 수 있도록 돕는 일관적인 플랫폼과 도구를 만든다

개발자들이 본질적으로 고객의 경험과 더불어 질적 향상을 이룰 수 있게 하는 플랫폼과 도구를 구축

Web 1995 - HTML

이동성 , 연결성 , 심플함을 위해 UX 의 희생

1997 – DHTML Web 에서의 상호 작용성 부각

: 최근까지 그리 많이 사용되지 않음

2005 – 증가되는 상호 작용성 DHTML 재발견 !

Windows 1994 – Win32

설치된 어플리케이션을 위한 새로운 수준의 기능성

MFC, ATL, VB 을 포함하는 많은 라이브러리들

1996 – DirectX Windows 를 위한 게임

플랫폼 2002 – Windows

Forms Win32 를 위한 개발자

생산성2006 년을 지나면서늘어나는 richness 요구

User Experience : User Experience : 최근 동향최근 동향

VHS VCR PVR (Windows MCE)

http://www.artlebedev.com/

MSN Mail Office WebAccess (OWA)

Office: Outlook

UX 란 ?

DHTML

Win32 Direct 3D

ASP.NET “Atlas”

Windows Forms

Windows Presentation Foundation

WPF/E

User ExperienceUser Experience 에 대한 높아지는 에 대한 높아지는 기대기대

그래픽의 미래그래픽의 미래 Windows 그래픽의 미래는 무엇인가 ? 어플리케이션과 콘텐트를 위한 그래픽 서비스와

관련한 새로운 기준은 무엇인가 ? 새로운 Windows 기술에 의해 가능해지는

것들은 무엇이 있는가 ?

현재의 그래픽 환경현재의 그래픽 환경 현재 Windows 그래픽 플랫폼의 나이는 20 살

질적 향상과 경험과 관련하여 기대와 요구는 더욱 커지고 있다

그래픽 하드웨어는 빠른 속도로 발전하고 있다 성능 대비 비용 비율은 끊임없이 향상되고 있다 진보는 주로 3D 에 그 초점을 두고 있다

Graphic Graphic 도구상자도구상자 기존 그래픽 기술은 계속해서 사용된다

GDI, GDI+, DirectShow, …

하지만 , 미래의 개발을 위해서는 다음을 고려해야 한다 Direct3D Windows Media Foundation Windows Presentation Foundation

미래를 위한 새로운 기술미래를 위한 새로운 기술

사용자 experience 와 그래픽의 질적 향상당신이 꿈꾸던 환상적인 애플리케이션

해답은 !!!!

Windows Presentation Foundation

여러분이 꿈꾸던 모든 것을 구현할 수 있습니다

여러분이 꿈꾸던 모든 것을 구현할 수 있습니다

Windows Presentation Windows Presentation FoundationFoundation

The North Face

WinFX :WinFX : WPFWPF

WinFX 차세대 관리되는 API 의 집합

WinFX 의 구성요소 .NET Framework Windows Presentation Foundation (Avalon) Windows Communication Foundation (Indigo) Windows Workflow Foundation (WinOE)

Windows Presentation Windows Presentation Foundation Foundation 비전비전 UI, Documents, Media 에

대한 통합된 접근 통합된 vector 기반의 구성 엔진 선언적인 프로그래밍

디자이너를 응용프로그램 개발 안에 직접적으로 끌어들인다

용이한 배포

Windows Presentation Windows Presentation FoundationFoundation Microsoft Windows 의 Graphical subsystem 어플리케이션 구축을 위한 일관된 프로그래밍 모델 제공 Windows 프로그램의 비주얼한 개발 및 보다 풍부한

컨트롤과 디자인을 가능하게 한다 풍부하고 화려한 어플리케이션을 제작할 수 있게 하는

관리 클래스의 집합 및 Display 엔진으로 구성 WPF 개체 모델을 선언적으로 처리하기 위해서 XML

기반의 모델을 사용하는 XAML(Extensible Application Markup Language) 을 이용

Windows Presentation Windows Presentation FoundationFoundation WPF 의 핵심 구성요소

탐색 , 윈도우 , 대화상자에 대한 지원을 하는 어플리케이션 모델

UI 데이터 바인딩 , 확장 레이아웃과 풍부한 컨트롤 개체집합 2D 와 3D 그래픽 , Animation, Media, Document

Windows 의 다음 버전인 Vista 에 포함예정 Windows XP SP2 와 Windows Server 2003 SP1 에는

WinFX 런타임의 일부로 제공될 예정 WPF/E : Windows Presentation Foundation

Everywhere XAML 과 Javascript 에 기반을 둔 WPF 의 mobile version 3D 기능은 제공되지 않음 , 그러나 , XPS, vector-based

drawing, hardware acceleration 은 제공

XAMLXAML (Extensible Application Markup Language) (Extensible Application Markup Language)

WPF 를 위한 사용자 인터페이스 마크업 언어 비주얼한 사용자 인터페이스를 그래픽적으로

기술하는데 최적화된 , 선언적인 XML 기반의 언어 사용자 상호작용 , 특히 스크린 출력과 관계된 .NET

프레임워크의 클래스와 메서드를 지원하도록 설계 XAML 파일은 VS 와 같은 디자인 툴을 통해 제작 결과 XML 은 WPF 하위 시스템을 통해서 해석 XAML 요소는 내부적으로 개체와 매핑된다 개발자와 디자이너의 협업을 위한 최선의 방법

XAML<Button Name="btnOk">

<Button.Background>RadialGradient White Blue

</Button.Background>OK

</Button>

C#Button btnOk = new Button();btnOk.Background = new RadialGradientBrush(

Colors.White, Colors.Blue);btnOk.Content = "Ok";

VB .NETDim btnOk As New ButtonbtnOk.Background = New RadialGradientBrush(

Colors.White, Colors.Blue)btnOk.Content = "Ok"

Base ServicesBase Services

XAMLXAML

AccessibilityAccessibility

Property SystemProperty System

Input & EventingInput & Eventing

WPF WPF 기본 서비스기본 서비스

WPF: User Interface ServicesWPF: User Interface Services

Layout & Databinding<StackPanel>

<Label>Select A Customer</Label><ListBox

Name="myListBox"Background="HoneyDew"ItemsSource="{Binding

{StaticResource myDataSource}}" </ListBox>

</StackPanel>

User Interface ServicesUser Interface Services

Application ServicesApplication Services

Deployment Services

Deployment Services

ControlsControls

LayoutLayout

Databinding

Databinding

ZAML 로 UI 구성하기

WPF FeaturesWPF Features

Graphical Services Deployment Interoperability Media Services Data Binding

Graphical Services Graphical Services

모든 Graphic(window 같은 데스크톱 항목들 포함 ) 은 Direct3D 를 이용

그래픽 및 보다 진보된 그래픽적인 특성들을 나타내기 위한 통합된 방안을 제공

그래픽적인 하부 시스템은 벡터기반이며 , Vector 기반의 Graphic 들은 문서들을 보다 정확하게 scale 한다 아이콘 및 버튼을 사이즈 조절 시 보다 보기 좋게

한다 .

DeploymentDeployment

WPF 개발 모델은 독립 실행 (Standalone) 어플리케이션과 Web Browser 어플리케이션 모두를 지원 Standalone 어플리케이션 : ClickOnce 나 MSI 와 같은

소프트웨어를 사용하여 컴퓨터에 설치되는 어플리케이션 이는 로컬 컴퓨터의 모든 리소스를 제어할 수 있다

Web Browser 어플리케이션 : IE 안에서 실행되는 프로그램 이는 로컬 컴퓨터의 모든 리소스를 제어할 수 없으며 ,

부분적으로만 접근이 가능

각각을 위한 프로그래밍 모델은 동일

InteroperabilityInteroperability

WPF 는 Win32 와의 상호호환성을 제공한다 기존 Win32 코드 안에서 WPF 를 사용할 수

있다 . WPF 안에서 기존 Win32 코드를 사용할 수

있다 Windows 폼과의 상호 호환도 ElementHost,

WindowsFormsHost 클래스의 사용을 통해 가능

Media ServiceMedia Service

2D 를 위한 Shape 지원 brush, pen, geometry, transform

3D 기능은 DirectX 와 관련됨 UI, document, media 와 같은 특성들과의

긴밀한 통합을 제공 . 3D UI, 3D document, 3D media 가 가능

공용 이미지 포맷을 지원 및 WMV, MPEG, AVI 포맷도 지원

Data BindingData Binding

개발자가 데이터를 바인딩 가능하게 하는 내장된 데이터 서비스 집합을 제공

데이터 프리젠테이션을 제어하기 위한 템플릿을 제공

3 가지 유형의 바인딩 타입 제공 one time : 서버상의 업데이트를 무시 one way : 데이터에 대한 읽기 전용 접근 two way : 서버의 데이터를 읽고 , 쓸 수 있다

Powerful & Productive

Programming Model

User

InterfaceReading & Documents

Graphics & Media

Presentation TechnologiesPresentation Technologies

Win32Win32(User, GDI)(User, GDI)

Direct 3DDirect 3D

WindowWindows Formss Forms

WPFWPF

WPF Demo

© 2004 Microsoft Corporation. All rights reserved.© 2004 Microsoft Corporation. All rights reserved.This presentation is for informational purposes only. MICROSOFT MAKES NO WARRANTIES, EXPRESS OR IMPLIED, IN THIS This presentation is for informational purposes only. MICROSOFT MAKES NO WARRANTIES, EXPRESS OR IMPLIED, IN THIS SUMMARY.SUMMARY.Content created by 3 Leaf SolutionsContent created by 3 Leaf Solutions