仅当 Silverlight 控件位于具有特定样式的另一个控件内时，才将样式应用于 Silverlight 控件答案

【问题标题】：Apply style to Silverlight control only when that control is inside another control with specific style仅当 Silverlight 控件位于具有特定样式的另一个控件内时，才将样式应用于 Silverlight 控件
【发布时间】：2011-07-20 05:25:59
【问题描述】：

我有一个网格控件，其中每一行包含一个堆栈面板，每个堆栈面板包含一个或多个文本块（虽然不是问题的核心，但如果有更好的方法来实现自定义文本块网格 - 即“标题行”标签：内容”，我会很感激一些提示）

无论如何...我想要一个标题行，其中堆栈面板具有深色背景，文本块具有白色粗体文本，然后每一行都有黑色文本。请注意，只有第一行是用 Style HeaderRow 定义的。我使用“BasedOn”来定义只有标题行中的文本块应该是粗体/白色，但是我发现这也会影响其他行中的所有文本块（没有定义其他样式）。

我实际上希望能够做到

XAML 示例

样式：

 <Style x:Key="TitleLabel" TargetType="TextBlock">
                    <Setter Property="FontFamily" Value="Verdana"/>
                    <Setter Property="Margin" Value="5 0 0 0"/>
                    <Setter Property="Width" Value="105"/>
                    <Setter Property="FontWeight" Value="Bold"/>
                </Style>
                <Style x:Key="AlternatingRow" TargetType="StackPanel">
                    <Setter Property="Background" Value="#f0f1ff"/>
                </Style>
                <Style x:Key="HeaderRow" TargetType="StackPanel">
                    <Setter Property="Background" Value="#666666"/>
                </Style>
                <Style TargetType="TextBlock" BasedOn="StaticResource HeaderRow" >
                    <Setter Property="Foreground" Value="White"/>
                    <Setter Property="FontWeight" Value="Bold"/>
                </Style>

XAML

<Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                    </Grid.RowDefinitions>
                    <StackPanel Orientation="Horizontal" Grid.Row="0" Style="{StaticResource HeaderRow}">
                        <TextBlock Text="Header Row" />
                    </StackPanel>
                    <StackPanel Orientation="Horizontal" Grid.Row="1" Style="{StaticResource AlternatingRow}">
                        <TextBlock Text="HeaderLabel:" Style="{StaticResource TitleLabel}" />
                        <TextBlock Text="Content" />
                    </StackPanel>
                    <StackPanel Orientation="Horizontal" Grid.Row="2">
                        <TextBlock Text="HeaderLabel"  Style="{StaticResource TitleLabel}" />
                        <TextBlock Text="Content" />
                    </StackPanel>
                    <StackPanel Orientation="Horizontal" Grid.Row="3" Style="{StaticResource AlternatingRow}">
                        <TextBlock Text="HeaderLabel"  Style="{StaticResource TitleLabel}" />
                        <TextBlock Text="Content" />
                    </StackPanel>
                    <StackPanel Orientation="Horizontal" Grid.Row="4">
                        <TextBlock Text="HeaderLabel"  Style="{StaticResource TitleLabel}" />
                        <TextBlock Text="Content" />
                    </StackPanel>
                </Grid>

【问题讨论】：

标签： silverlight xaml styles

【解决方案1】：

您没有正确使用Style BasedOn 属性。它所做的只是表明一种样式“扩展”了另一种样式，即它复制了它的所有 setter 值。（注意，您的示例也将失败，因为您试图将样式基于另一个 TargetTypes 不兼容的样式）它并不表示当一个元素嵌套在另一个元素中时应用样式。

很遗憾，Silverlight 没有您需要的功能，您无法根据视觉树中的元素位置设置样式。您将必须明确设置每个 TextBlock 的样式。

虽然，不久前我确实创建了一种使用 CSS 进行样式设置的机制：

http://www.scottlogic.co.uk/blog/colin/2009/03/using-css-selectors-for-styling-in-wpf/

这允许您基于父元素创建选择器。

【讨论】：