[세티의 실버라이트] 5. 공통 그래픽 속성 Silverlight2008/06/01 16:48
원글출처: http://silverlight.net/quickstarts/silverlight10/visual.aspx
본 강좌는 위의 원글을 참고 및 번역해서 작성했으며, 글 중간중간 제 개인적인 표현이나 의견을 넣어서 각색했습니다.
(Common graphic properties)
모든 실버라이트에서 사용되는 Canvas, shapes, MediaElement, TextBox와 같은 UIElement 객체들은 속성을 사용합니다. 아래의 객체는 모든 그래픽에서 사용되는 공통 속성 입니다.
- the Opacity property
- the OpacityMask property
- the Clip property
- the RenderTransform property
이 객체들에 대해서 하나씩 알아보도록 하겠습니다.
먼저 Opacity 속성 입니다.
Opacity 속성은 UIElement의 알파값 이나 슬라이드 값을 조정하여 활성화 시켜줍니다. Opacity 속성값에는 0에서 1사이의 값을 설정하게 되며 0을 설정하게 되면 완전 투명하게 됩니다. 기본적으로 Opacity 값은 1.0을 설정하고 있습니다. 아래의 코드는 Opacity 설정에 대한 예제 코드이며, 렌더링된 결과 입니다.
OpacityMask 속성값은 UIElement의 어떤 특정 부분에 대한 알파값을 조정합니다. 예를 들어서 OpacityMask 값을 사용하면 오른쪽에서 왼쪽으로 진행되면서 점차 희미해지는 객체를 만들 수 있습니다. 객체에서 OpacityMask를 사용하게 된다면 LinearGradientBrush, RadialGradientBrush, ImageBrush를 대부분 사용할 수 있습니다.
아래의 코드와 렌더링 결과물은 OpacityMask를 사용했을 때 어떻게 그려지는 지에 관한 것입니다.
다음으로 Clip 속성을 살펴 보겠습니다.
Clip 속성은 엘리먼트에 의해 그려진 어떤 한 부분을 선택할 때 사용됩니다.Clip 속성을 사용하기 위해서는 Geometry 객체를 사용해야 합니다. Geometry는 선택된 나머지 영역을 hidden 처리 하게 됩니다. 아래의 코드는 RectangleGeometry를 사용하여 Ellipse 엘리먼트를 Clip한 것입니다.
마지막으로 RenderTransform 속성은 Transform 객체를 사용하며, 엘리먼트를 다양한 각도로 움직이고 조정합니다. 이런 것을 가능하게 하는 Transform은 RotateTransform, SkewTransform, ScaleTransform, TranslateTransform 등이 있습니다. 아래의 코드는 여러가지 Transform을 렌더링 하는 예제 입니다.
이상으로 공통 그래픽 속성에 대해 간략하게 살펴봤습니다. 역시 코드를 눈으로 보는 것 보다는 직접 단 한번이라도 코딩을 해보시고 그 결과를 확인하는 것이 무엇이든 가장 빠르고 쉽게 익히는 비결인 것 같습니다.
귀찮더라도 꼭 한번 코딩을 해보십시오.
'Silverlight' 카테고리의 다른 글
| [세티의 실버라이트] 7. 텍스트 (0) | 2008/06/04 |
|---|---|
| [세티의 실버라이트] 6. Images (2) | 2008/06/01 |
| [세티의 실버라이트] 5. 공통 그래픽 속성 (0) | 2008/06/01 |
| [세티의 실버라이트] 4. 그림 그리기와 색칠하기 (0) | 2008/06/01 |
| WPF/E(코드 이름) 시작 (0) | 2008/05/26 |
| [세티의 실버라이트] 3. Canvas 객체에 대해서. (0) | 2008/05/25 |
