泥庭

2010年12月22日

Style(その②)

Filed under: WPF — タグ: , — yone64 @ 12:24 AM

前回に引き続きStyleの話

①Default設定について
Styleタグに明示的にKeyを指定しない場合は、TragetTypeと同じ値が設定されます。
つまり

<Style TargetType="{x:Type Button}">

<Style x:Key="{x:Type Button}" TargetType="{x:Type Button}">

は、同じ意味です。

また、FrameworkElementクラスのStyleプロパティーは、明示的に指定しない場合、そのクラスのTypeが設定されます。
つまり

<Button Name="button2" Content="ボタン2" />

<Button Name="button2" Content="ボタン2" Style="{StaticResource ResourceKey={x:Type Button}}" />


は同じ意味です。

総合すると、明示的にKeyを指定しないStyleは、Resourceを明示的に指定しないすべてのコントロールに適用されることになります。

②Style VS プロパティー
プロパティーに値が設定されたコントロールは、Styleの値は設定されません。次の場合、FontSizeはプロパティーに直接指定した「20」になります。

<Button Content="ボタン3" FontSize="20">
    <Button.Style>
        <Style TargetType="{x:Type Button}">
            <Setter Property="FontSize" Value="10"></Setter>
        </Style>
    </Button.Style>
</Button>

③Styleの継承
StyleタグのBaseOnプロパティーを指定することで、Styleを継承し拡張することが出来ます。

<Style TargetType="{x:Type Button}" BasedOn="{StaticResource ResourceKey={x:Type Button}}">
    <Setter Property="FontSize" Value="20"/>
</Style>

まとめ
以上を踏まえて、次のXAMLは

<Window x:Class="StyleSample.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Window1" Height="350" Width="298" xmlns:my="clr-namespace:StyleSample">
    <Window.Resources>
        <Style TargetType="{x:Type Button}">
            <Setter Property="FontSize" Value="30"></Setter>
            <Setter Property="Foreground" Value="Red"></Setter>
        </Style>
        <Style x:Key="Button" TargetType="{x:Type Button}" BasedOn="{StaticResource ResourceKey={x:Type Button}}">
            <!-- プロパティーの上書き -->
            <Setter Property="Foreground" Value="Blue"/>
            <!-- プロパティーの追加 -->
            <Setter Property="LayoutTransform">
                <Setter.Value>
                    <TransformGroup>
                        <RotateTransform Angle="45"/>
                    </TransformGroup>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>
    <StackPanel>
        <!-- 何も指定しない場合、デフォルトスタイルが適用される -->
        <Button Content="ぼたん"/>
        <!-- プロパティーに直接指定した場合は、プロパティーの値が優先 -->
        <Button Content="ぼたん1" FontSize="40"/>
        <!-- リソースを明示的に指定した場合、指定したスタイルが適用される -->
        <Button Content="ぼたん2" Style="{StaticResource ResourceKey=Button}"/>
        <!-- ボタンを継承したオリジナルクラスには適用されない -->
        <my:ButtonEx Content="Button"/>
        <!-- 明示的に指定すれば、適用される -->
        <my:ButtonEx Content="Button1" Style="{StaticResource ResourceKey={x:Type Button}}"/>
    </StackPanel>
</Window>

以下のような、UIになります。
image

広告

コメントする »

まだコメントはありません。

RSS feed for comments on this post. TrackBack URI

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中

WordPress.com で無料サイトやブログを作成.

%d人のブロガーが「いいね」をつけました。