Post on 09-Aug-2015
차세대 2D 그래픽스 라이브러리
Direct2DVS 2010 공식 팀블로그(http://vsts2010.net)
2011.06.02
박민근
Direct2D 란 ?
Windows7 을 위한 새로운 2D 그래픽스 API
GDI,GDI+ 를 대체하는 차세대 그래픽스 API
High Performance
하드웨어 가속 지원 (immedate-mode)
High Quality
Per-Primitive AntialiasingClearType Text
DEMO
Direct 2D & Direct3D
http://www.youtube.com/watch?v=-879yxtHLRI
가능한 것들
2D 도형들 (Line, 도형 , Curve 등 )비트맵 ( 거의 모든 포맷 ,JPG,PNG 등 )텍스트 ( 텍스트 변형 , 회전 )
기존 API 와 상호 운영 가능
GDI, GDI+Direct3DMFC 호환(VS 2010 SP1)
Direct2D 아키텍쳐 레이어
C, C++ 에서 사용이 기본
Windows API Pack for .NET Frame-work 를 이용하면 .NET 에서도 사용은 가능
Native Code 기반
사용 대상
대규모 Native 어플리케이션 개발자
컨트롤 툴킷 및 라이브러리 개발자
Server-Side 2D 그래픽 렌더링이 필요한 개발자
Direct3D 를 사용하면서 , 간단하고 고성능의 2D 도형과 텍스트를 이용한 메뉴나 UI, HUD 등을 개발하는 개발자
요구 사항
Windows SDK 에 포함되어 있음
윈도우 7, 윈도우 비스타 SP2 이상
DirectX 10.1 이상
Why Direct2D?
게임 개발시 2D 그래픽 라이브러리의
필요성
컷신 연출툴
마테리얼 개발툴
퀘스트 툴
각종 게임 개발툴
그럼 기존에는 ?
구현이 간단함
2D 그래픽이 필요한 툴에서만 사용 가능하다
하드웨어 가속이 지원되지 않는다
게임에서는 사용 불가능하다 – Direct3D 와 연동이 안됨
GDI, GDI+ 사용
Direct3D 사용
그래픽 속도가 필요한 경우
배보다 배꼽이 더크다
하드웨어 가속 지원
구현이 상당히 편하고 , 간단하다
하지만 , .NET 전용
게임 (C++) 에서는 당연히 사용 불가
WPF(Windows Presenta-tion Foundation) 사용
그래서… Direct2D 는 ?
AntiAliasing 지원 – 예쁘게
나온다
Direct3D 와 같이 사용 가능
게임내에서도 사용 가능
하드웨어 가속 지원
- Direct3D 보다는 간결함- GDI 보다는 조금 복잡함
기능이 많지 않으며 , 간단해서 쉽게 익힐 수 있음
사용하기 위한 코드가 간단하다
활용 방향
이미 IE9, Firefox, 크롬에서는 사용중
하드웨어 가속 웹 렌더링에서 사용 (HTML5)
게임 UI 라이브러리로 사용하는 건 무리
요구 사항Window7 이상DirectX 10.1 이상
게임 개발 툴에서 활용 가능성
2D 그래픽으로만 이루어진 개발툴이 의외로 많다- 이걸 위해서 Direct3D 를 사용하는 건 무리
2D 도형을 이용한 개발툴의 기능이 필요하다
샘플 프로젝트에서 활용
시각화 샘플 프로젝트
알고리즘 시각화 프로젝트
간단한 2D 게임 만들기
Direct2D 시작하기
Illustration of two rectangles on a grid background
1. 헤더 파일 추가
2. 관련 객체 변수 선언
2. Direct2D Factory 생성
3. 렌더타겟 생성
4. 컬러 브러쉬 생성
4. 렌더 타겟 준비
5. 배경 그리드 렌더링
6. 사각형 렌더링
7. 렌더타겟 완료
VS 2010 SP1 에는 MFC 에 다 통합되어 있다 !!
위 작업들 할 필요 없음 !http://msdn.microsoft.com/ko-kr/library/gg482848.aspx
Direct2D 의 여러 기능들
Advanced Path Geometries Example
http://msdn.microsoft.com/en-us/library/ee461072(v=VS.85).aspx
Illustration of a river, mountains, and the sun
Geometries Example
Illustration of several simple and path geometries
Illustration of several simple and path geometries
http://msdn.microsoft.com/en-us/library/ee329938(v=VS.85).aspx
Brush Types Example
Illustration of solid color brush, linear gradi-ent brush, radial gradient brush, and bitmap brush
http://msdn.microsoft.com/en-us/library/dd799414(v=VS.85).aspx
Clip with Axis Aligned Rectangle Example
Illustration of a goldfish and a clipped region of the goldfish
http://msdn.microsoft.com/en-us/library/dd756624(v=VS.85).aspx
Clip with a Bitmap Mask Example
Illustration of a goldfish and a clipped region of the goldfish by using a bitmap mask
http://msdn.microsoft.com/en-us/library/dd756625(v=VS.85).aspx
Clip with Layers Example
Illustration of a goldfish and a clipped region of the goldfish by using layers
http://msdn.microsoft.com/en-us/library/dd756626(v=VS.85).aspx
Combine Geometries Example
Illustration of two geometries and the resulting geometry af-ter various combination operations
http://msdn.microsoft.com/en-us/library/dd370923(v=VS.85).aspx
Create Geometry Groups Example
Illustration of composite geometry groups with the two fill modes
http://msdn.microsoft.com/en-us/library/dd756627(v=VS.85).aspx
Draw Bitmap With Extend Mode Example
Illustration of various effects of extend modehttp://msdn.microsoft.com/en-us/libra
ry/dd940315(v=VS.85).aspx
Layers with Parameters Example
Illustrations of three bitmaps and the resulting images after con-tent bounds, opacity masks, or geometric masks are applied to them
http://msdn.microsoft.com/en-us/library/ee329942(v=VS.85).aspx
Multiple Transforms Example
Diagram of a square being rotated and then trans-lated
http://msdn.microsoft.com/en-us/library/dd799446(v=VS.85).aspx
Opacity Masks Example
Illustration of three bitmaps with different opacity masks applied to them
http://msdn.microsoft.com/en-us/library/dd372307(v=VS.85).aspx
Stroke Style Example
Illustration of line join styles (miter line join, round line join, bevel line join, and miter or bevel line join)
http://msdn.microsoft.com/en-us/library/dd317107(v=VS.85).aspx
Direct2D & Direct3D 같이 사용하기
Direct3D 10.1 버전 이상부터 Direct2D 와 같이 사용이 가능하다
• 2D 화면을 3D 화면의 백그라운드 이미지로 사용하거나
• 2D 화면을 3D 오브젝트의 텍스쳐로 사용하거나
• 2D 텍스트를 3D 화면에 표시하거나
• 2D 오브젝트로 3D 게임의 UI 로 사용하거나
DXGI 를 통해서 서로 사용이 가능하다
• IDXGISurface, ID2D1RenderTarget 을 이용하여 Direct2D 컨텐츠를 Direct3D 서페이스에 Direct2D 컨텐츠를 렌더링할 수 있다 .
• IDXGISurface 에서 CreateShaderBitmap을 사용하여 ID2D1Bitmap 을 생성하여 , Di-rect3D 의 씬을 거기에 Direct2D 로 렌더링 할 수 있다 .
자세한 내용은 DX10.1 이상의 아키텍쳐를 이해해고 있어야 하기 때문에 , 생략… .
MSDN 에 자세한 설명과 , 샘플 코드가 있습니다 .
Direct2D and Direct3D Interoperability Overview
결론
GDI, GDI+ 를 대체하는 최신의 2D 그래픽스 라이브러리
C++ 로 만들어야 하는 게임 개발툴에서 유용할 듯
- 셰이더 에디터 , 마테리얼 에디터 , 컷신 연출툴
2D 프로토 타입 or 2D 게임 개발시 유용할 듯
상용 게임의 UI 에 적용하는 것은 무리
- 요구 사항 제한
참고 자료
MSDN Direct 2D
PDC 2008 - Introducing Direct2D
PDC 2008 - Improving Direct2D
Direct2D 란 ?
Windows7 을 위한 새로운 2D 그래픽스 API
GDI,GDI+ 를 대체하는 차세대 그래픽스 API
High Performance
하드웨어 가속 지원 (immedate-mode)
High Quality
Per-Primitive AntialiasingClearType Text
DEMO
Direct 2D & Direct3D
http://www.youtube.com/watch?v=-879yxtHLRI
가능한 것들
2D 도형들 (Line, 도형 , Curve 등 )비트맵 텍스트 ( 텍스트 변형 , 회전 )
기존 API 와 상호 운영 가능
GDI, GDI+Direct3D
Direct2D 아키텍쳐 레이어
C, C++ 에서 사용이 기본
Windows API Pack for .NET Framework 를 이용하면NET 에서도 사용은 가능
Native Code 기반
사용 대상대규모 Native 어플리케이션 개발자
컨트롤 툴킷 및 라이브러리 개발자
Server-Side 2D 그래픽 렌더링이 필요한 개발자
Direct3D 를 사용하면서 , 간단하고 고성능의 2D 도형과 텍스트를 이용한 메뉴나 UI, HUD 등을 개발하는 개발자
요구 사항
Windows SDK 에 포함되어 있음
윈도우 7, 윈도우 비스타 SP2 이상
DirectX 10.1 이상
Why Direct2D?
게임 개발시 2D 그래픽 라이브러리의
필요성
컷신 연출툴
마테리얼 개발툴
퀘스트 툴
각종 게임 개발툴
게임 UI, HUD
그럼 기존에는 ?
구현이 간단함
2D 그래픽이 필요한 툴에서만 사용 가능하다
하드웨어 가속이 지원되지 않는다
게임에서는 사용 불가능하다 – Direct3D 와 연동이 안됨
GDI, GDI+ 사용
Direct3D 사용
그래픽 속도가 필요한 경우
배보다 배꼽이 더크다
하드웨어 가속 지원
구현이 상당히 편하고 , 간단하다
하지만 , .NET 전용
게임에서는 당연히 사용 불가
WPF(Windows Presentation Foun-dation) 사용
그래서… Direct2D 는 ?
AntiAliasing 지원 – 예쁘게
나온다
Direct3D 와 같이 사용 가능
게임내에서도 사용 가능
하드웨어 가속 지원
- Direct3D 보다는 간결함- GDI 보다는 조금 복잡함
기능이 많지 않으며 , 간단해서 쉽게 익힐 수 있음
사용하기 위한 코드가 간단하다
활용 방향
이미 IE9, Firefox, 크롬에서는 사용중
하드웨어 가속 웹 렌더링에서 사용 (HTML5)
게임 UI 라이브러리로 사용하는 건 무리
요구 사항Window7 이상DirectX 10.1 이상
게임 개발 툴에서 활용 가능성
2D 그래픽으로만 이루어진 개발툴이 의외로 많다- 이걸 위해서 Direct3D 를 사용하는 건 무리
2D 도형을 이용한 툴의 기능이 필요하다
샘플 프로젝트에서 활용
스터디용 샘플 프로젝트
알고리즘 시각화 프로젝트
간단한 게임 만들기 - 해보리
Direct2D 시작하기
Illustration of two rectangles on a grid background
1. 헤더 파일 추가
2. 관련 객체 변수 선언
2. Direct2D Factory 생성
3. 렌더타겟 생성
4. 컬러 브러쉬 생성
4. 렌더 타겟 준비
5. 배경 그리드 렌더링
6. 사각형 렌더링
7. 렌더타겟 완료
Direct2D 의 여러 기능들
Advanced Path Geometries Example
http://msdn.microsoft.com/en-us/library/ee461072(v=VS.85).aspx
Illustration of a river, mountains, and the sun
Geometries Example
Illustration of several simple and path geometries
Illustration of several simple and path geometries
http://msdn.microsoft.com/en-us/library/ee329938(v=VS.85).aspx
Brush Types Example
Illustration of solid color brush, linear gradi-ent brush, radial gradient brush, and bitmap brush
http://msdn.microsoft.com/en-us/library/dd799414(v=VS.85).aspx
Clip with Axis Aligned Rectangle Example
Illustration of a goldfish and a clipped region of the goldfish
http://msdn.microsoft.com/en-us/library/dd756624(v=VS.85).aspx
Clip with a Bitmap Mask Example
Illustration of a goldfish and a clipped region of the goldfish by using a bitmap mask
http://msdn.microsoft.com/en-us/library/dd756625(v=VS.85).aspx
Clip with Layers Example
Illustration of a goldfish and a clipped region of the goldfish by using layers
http://msdn.microsoft.com/en-us/library/dd756626(v=VS.85).aspx
Combine Geometries Example
Illustration of two geometries and the resulting geometry af-ter various combination operations
http://msdn.microsoft.com/en-us/library/dd370923(v=VS.85).aspx
Create Geometry Groups Example
Illustration of composite geometry groups with the two fill modes
http://msdn.microsoft.com/en-us/library/dd756627(v=VS.85).aspx
Draw Bitmap With Extend Mode Example
Illustration of various effects of extend modehttp://msdn.microsoft.com/en-us/libra
ry/dd940315(v=VS.85).aspx
Layers with Parameters Example
Illustrations of three bitmaps and the resulting images after con-tent bounds, opacity masks, or geometric masks are applied to them
http://msdn.microsoft.com/en-us/library/ee329942(v=VS.85).aspx
Multiple Transforms Example
Diagram of a square being rotated and then trans-lated
http://msdn.microsoft.com/en-us/library/dd799446(v=VS.85).aspx
Opacity Masks Example
Illustration of three bitmaps with different opacity masks applied to them
http://msdn.microsoft.com/en-us/library/dd372307(v=VS.85).aspx
Stroke Style Example
Illustration of line join styles (miter line join, round line join, bevel line join, and miter or bevel line join)
http://msdn.microsoft.com/en-us/library/dd317107(v=VS.85).aspx
Direct2D & Direct3D 같이 사용하기
Direct3D 10.1 버전 이상부터 Direct2D 와 같이 사용이 가능하다
• 2D 화면을 3D 화면의 백그라운드 이미지로 사용하거나
• 2D 화면을 3D 오브젝트의 텍스쳐로 사용하거나
• 2D 텍스트를 3D 화면에 표시하거나
• 2D 오브젝트로 3D 게임의 UI 로 사용하거나
DXGI 를 통해서 서로 사용이 가능하다
• IDXGISurface, ID2D1RenderTarget 을 이용하여 Direct2D 컨텐츠를 Direct3D 서페이스에 Direct2D 컨텐츠를 렌더링할 수 있다 .
• IDXGISurface 에서 CreateShaderBitmap을 사용하여 ID2D1Bitmap 을 생성하여 , Di-rect3D 의 씬을 거기에 Direct2D 로 렌더링 할 수 있다 .
자세한 내용은 DX10.1 이상의 아키텍쳐를 이해해고 있어야 하기 때문에 , 생략… .
MSDN 에 자세한 설명과 , 샘플 코드가 있습니다 .
Direct2D and Direct3D Interoperability Overview
결론
GDI, GDI+ 를 대체하는 최신의 2D 그래픽스 라이브러리
C++ 로 만들어야 하는 게임 개발툴에서 유용할 듯
- 셰이더 에디터 , 마테리얼 에디터 , 컷신 연출툴
2D 프로토 타입 or 2D 게임 개발시 유용할 듯
스터디의 샘플 프로젝트 제작시에도 유용할 듯
상용 게임의 UI 에 적용하는 것은 무리- 요구 사항 제한
참고 자료
MSDN Direct 2D
PDC 2008 - Introducing Direct2D
PDC 2008 - Improving Direct2D