WPF(XAML) - Shape Class

Border

• 테두리의 모양을 조절하는 Control
• 한개의 content만 가질 수 있음. 복수의 Control을 갖기 위해서는 Border의 내부 Content로 Grid, StackPanel등 적용해야함
• Border의 주요 속성

Property	Description
Background	내부 영역을 채우는 색상 등을 설정하는 Property
BorderBrush	외부 테두리 색을 설정하는 Property
BorderThickness	외부 테두리의 두께를 설정하는 Property
CornerRadius	Border의 모퉁이의 둥근정도를 설정하는 Property

 

Shape 

• Shape 종류: Rectangle, Ellipse, Path,  Line, Polygon, Polyline

• Shape 주요속성

  Property	Description
  Fill	내부 영역을 채우는 색상 등을 설정하는 Property
  Stroke	도형의 윤곽선을 설정하는 Property
  StrokeThickness	도형의 윤곽선의 두께를 설정하는 Property
  Radius X/Y	도형 모퉁이의 둥근정도를 설정하는 Property
  StrokeDashArray	도형의 윤곽선을 그리는데 사용되는 대시 및 간격 패턴을 설정하는 Property
  StrokeDashCap	점선 끝을그리는 방법을 지정하는 Property Value: Flat / Round / Square/ Triangle
  StrokeDashOffset	점선간 간격을 지정하는 Property
  Stretch	할당된 영역을 채우는 방식을 설정하는 Property Value: None / Fill / Uniform/ UniformToFill

   

Image

• 이미지 파일을 불러오는 Control 

• Image의 주요 속성 (더 자세한 내용- Image properties)

  Property	Description
  Stretch	할당된 영역을 채우는 방식을 설정하는 Property Value: None / Fill / Uniform/ UniformToFill
  Source	불러올 파일의 경로를 지정하는 Property

Transform

• RotateTransform : 회전

// 기준 - 노랑 사각형
<Rectangle Width="200" Height="50" Fill="Yellow"/>         
// Transform 적용 - 파랑 사각형
<Rectangle Width="200" Height="50" Fill="Blue" Opacity="0.5">
        <Rectangle.RenderTransform>
            <RotateTransform CenterX="0" CenterY="0" Angle="45" />
        </Rectangle.RenderTransform>
</Rectangle>

• ScaleTransform : 크기 

// 기준 - 노랑 사각형
<Rectangle Width="200" Height="50" Fill="Yellow" Margin="61,27,117,184" />
// Transform 적용 - 파랑 사각형
<Rectangle Width="200" Height="50" Fill="Blue" Opacity="0.5" Margin="53,141,125,70">
    <Rectangle.RenderTransform>
        <ScaleTransform ScaleX="1.5" ScaleY="2.0" CenterX="50" CenterY="50" />
    </Rectangle.RenderTransform>
</Rectangle>

• SkewTransform : 기울기

// 기준 - 노랑 사각형
<Rectangle Width="200" Height="50" Fill="Yellow" Margin="61,27,117,184" />
// Transform 적용 - 파랑 사각형
<Rectangle Width="200" Height="50" Fill="Blue"  Opacity="0.5" Margin="59,101,119,110">
    <Rectangle.RenderTransform>
        <SkewTransform CenterX="0" CenterY="0" AngleX="45" AngleY="0" />
    </Rectangle.RenderTransform>
</Rectangle>

• TranslateTransform : 위치 (X, Y로 위치 조정)

// 기준 - 노랑 사각형
<Rectangle Width="200" Height="50" Fill="Yellow" Margin="61,27,117,184" />
// Transform 적용 - 파랑 사각형
<Rectangle Width="200" Height="50" Fill="Blue"  Opacity="0.5" Margin="59,101,119,110">
    <Rectangle.RenderTransform>
        <TranslateTransform X="50" Y="20" />
    </Rectangle.RenderTransform>
</Rectangle>