SilverLight样式表

SilverLight样式表分为全局样式表、局部样式表、内部样式表。样式支持向下继承。每个都具体举个简单例程。

1 全局样式表

在App.Xaml

<Application xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             x:Class="SilverlightApplication2.App"
             >
    <Application.Resources>
        <Style x:Key="button1" TargetType="Button">
            <Setter Property="Background" Value="Black"/>
            <Setter Property="FontSize" Value="24"/>
            <Setter Property="Foreground" Value="Blue"/>
            <Setter Property="Margin" Value="20"/>
        </Style>
        <Style x:Key="button2" TargetType="Button">
            <Setter Property="Background" Value="White"/>
            <Setter Property="FontSize" Value="24"/>
            <Setter Property="Foreground" Value="Red"/>
            <Setter Property="Margin" Value="20"/>
        </Style>
    </Application.Resources>
</Application>

引用:

MainPage.xaml

<UserControl x:Class="SilverlightApplication2.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">
    <UserControl.Resources>
       
    </UserControl.Resources>
    <StackPanel Orientation="Horizontal" Background="red">
        <Button Content="Button" Style="{StaticResource button1}" HorizontalAlignment="Left" VerticalAlignment="Top" />
      </StackPanel>
</UserControl>

2 局部样式表

MainPage.xaml

<UserControl x:Class="SilverlightApplication2.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">
    <UserControl.Resources>
        <Style x:Key="button1" TargetType="Button">
            <Setter Property="Background" Value="Black"/>
            <Setter Property="FontSize" Value="24"/>
            <Setter Property="Foreground" Value="Blue"/>
            <Setter Property="Margin" Value="20"/>
        </Style>
        <Style x:Key="button2" TargetType="Button">
            <Setter Property="Background" Value="White"/>
            <Setter Property="FontSize" Value="24"/>
            <Setter Property="Foreground" Value="Red"/>
            <Setter Property="Margin" Value="20"/>
        </Style>
    </UserControl.Resources>
    <StackPanel Orientation="Horizontal" Background="red">
        <Button Content="Button" Style="{StaticResource button1}" HorizontalAlignment="Left" VerticalAlignment="Top" />
        <Button Content="Button" Style="{StaticResource button2}" HorizontalAlignment="Left" VerticalAlignment="Top" />
      </StackPanel>
</UserControl>

3 内部样式表

MainPage.xaml

<UserControl x:Class="SilverlightApplication2.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">
    <UserControl.Resources>
        <Style x:Key="button1" TargetType="Button">
            <Setter Property="Background" Value="Black"/>
            <Setter Property="FontSize" Value="24"/>
            <Setter Property="Foreground" Value="Blue"/>
            <Setter Property="Margin" Value="20"/>
        </Style>
        <Style x:Key="button2" TargetType="Button">
            <Setter Property="Background" Value="White"/>
            <Setter Property="FontSize" Value="24"/>
            <Setter Property="Foreground" Value="Red"/>
            <Setter Property="Margin" Value="20"/>
        </Style>
    </UserControl.Resources>
    <StackPanel Orientation="Horizontal" Background="red">
        <Button Content="Button" Style="{StaticResource button1}" HorizontalAlignment="Left" VerticalAlignment="Top" />
        <Button Content="Button" Style="{StaticResource button2}" HorizontalAlignment="Left" VerticalAlignment="Top" />
        <Button Content="红色" Width="100" Height="80">
            <Button.Style>
                <Style TargetType="Button">
                    <Setter Property="Background" Value="Red"/>
                    <Setter Property="FontSize" Value="24"/>
                    <Setter Property="Foreground" Value="Red"/>
                    <Setter Property="Margin" Value="20"/>
                </Style>
            </Button.Style>
        </Button>
    </StackPanel>
</UserControl>

 

posted on 2010-07-02 19:10  松原蔡晓冬  阅读(2382)  评论(3编辑  收藏  举报

导航