silverlight

Style 정의하기

Min-gu, Kim 2009. 6. 16. 14:10

UIElement 의 Style 정의
UIElement의 모양을 변경하기 위해 Style Class를 정의하여 UIElement의 Style속성에 설정합니다.
(FrameworkElement 를 상속 받은 모든 Element는 Style 속성을 가지고 있기 때문)

Style Class는 SetterBaseCollection 형의 Setter property를 가지고 있습니다.
SetterBaseCollection내 각각의 Setter class 는 Style의 속성에 값을 부여하는 Class로, 적용 될 Property를 지정하는 Property property와 지정된 property의 값을 설정하는 Value property가 있습니다.
Style Class 는 Property와 Value가 지정 된 Setter class를 배열로 가지고 있고, Style Class 의 TargetType property로 Style을 적용할 Element의 형식을 설정하여 각 Setter가 지정하고 있는 Element의 Property 에 Value 값을 설정 합니다.
- Rectangle 객체의 Style을 지정-

<Rectangle x:Name="myRectangle">
    <Rectangle.Style>
        <Style TargetType="Rectangle" x:Name="myStyle">
            <Setter Property="Width" Value="50"/>
            <Setter Property="Height" Value="50"/>
            <Setter Property="Fill">
                <Setter.Value>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="Blue" Offset="1"/>
                        <GradientStop Color="Red" Offset="0"/>
                    </LinearGradientBrush>
                </Setter.Value>
            </Setter>
        </Style>
    </Rectangle.Style>
</Rectangle>


Style객체를 생성해서 Rectangle 의 Style Property에 설정합니다.
(Rectangle 은 FrameworkElement를 상속 받아 Style property를 가지고 있어, Style 객체를 생성해서 설정할 수 있습니다.)
생성 된 Style 객체는 TargetType 으로 Rectangle 이 지정 되 있고 Style 객체 내 Setter에서는 Width 속성의 값을 50으로, Height 값을 50으로, Fill 값을 Setter.Value를 지정하여 여러 가지 속성을 가진 LinearGradientBrush를 값으로 사용하였습니다.



위 코드에서 처럼 Style 객체 내 Setter class 는 Value 값을 Int32나 String처럼 기본 자료형인 Property에 지정 할 수도 있지만, Rectangle 내 Fill property 에 여러 속성을 가지는 LinearGradientBrush를 값으로 지정 할 수도 있습니다.