如何将样式资源应用于用户控件,其中该样式使用触发器来应用模板



如果这是一个简单的问题,我很抱歉,但我整天都在努力让它工作,我似乎无法弄清楚一些可能相当明显的东西。

我有一个带有自定义依赖项属性"翻转"的用户控件。

在我的资源中,我有一个定义了两个触发器的样式,它将控件的模板设置为两个不同的值,具体取决于"翻转"是否为真或假。

现在,我使用什么语法将样式应用于我正在创建的此用户控件?

Style="{StaticResource EventStyle}"放在UserControl的标题中是行不通的。

这是我到目前为止所拥有的:

<UserControl x:Class="XDPClient.Controls.EventMarkerControl"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         xmlns:Controls="clr-namespace:XDPClient.Controls" 
         mc:Ignorable="d" 
         d:DesignHeight="513" d:DesignWidth="695">
<UserControl.Resources>
    <!-- Draw the user control right side up with this template -->
    <ControlTemplate x:Key="Up" TargetType="{x:Type Controls:EventMarkerControl}">
        <Grid>
            <!-- Outline grid  -->
            <Path Stretch="Fill" Fill="#FFFFFFFF" Stroke="#FF6800FF" StrokeThickness="3" StrokeStartLineCap="Flat" StrokeEndLineCap="Flat" StrokeLineJoin="Miter" StrokeMiterLimit="4" Name="rect2985" RenderTransformOrigin="0,0">
                <Path.Data>
                    <PathGeometry FillRule="Nonzero"   Figures="M 0,250 L 0,50 L 150,50 L 200,-0.96 L 250,50 L 400,50 L 400,250 L 0,250z" />
                </Path.Data>
            </Path>
            <!-- Placement of the content -->
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="1*" />
                    <RowDefinition Height="4*" />
                </Grid.RowDefinitions>
                <Grid Grid.Row="1" Margin="3">
                    <ContentPresenter Grid.Row="1" 
                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"        
                            SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                </Grid>
            </Grid>
            <Grid.BitmapEffect>
                <DropShadowBitmapEffect />
            </Grid.BitmapEffect>
        </Grid>
    </ControlTemplate>
    <!-- Draw the user control flipped with this template -->
    <ControlTemplate x:Key="Down" TargetType="{x:Type Controls:EventMarkerControl}">
        <Grid>
            <!-- Outline grid  -->
            <Path Stretch="Fill" Fill="#FFFFFFFF" Stroke="#FF6800FF" StrokeThickness="3" StrokeStartLineCap="Flat" StrokeEndLineCap="Flat" StrokeLineJoin="Miter" StrokeMiterLimit="4" Name="rect2985" RenderTransformOrigin="0,0">
                <Path.Data>
                    <PathGeometry FillRule="Nonzero"   Figures="M 0,250 L 0,50 L 150,50 L 200,-0.96 L 250,50 L 400,50 L 400,250 L 0,250z" />
                </Path.Data>
                <Path.RenderTransform>
                    <ScaleTransform ScaleX="-1" />
                </Path.RenderTransform>
            </Path>
            <!-- Placement of the content -->
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="1*" />
                    <RowDefinition Height="4*" />
                </Grid.RowDefinitions>
                <Grid Grid.Row="1" Margin="3">
                    <ContentPresenter Grid.Row="1" 
                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"        
                            SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                </Grid>
            </Grid>
            <Grid.BitmapEffect>
                <DropShadowBitmapEffect />
            </Grid.BitmapEffect>
        </Grid>
    </ControlTemplate>
    <Style x:Key="EventStyle" TargetType="{x:Type Controls:EventMarkerControl}">
        <Style.Triggers>
            <Trigger Property="Flipped" Value="false">
                <Setter Property="Template" Value="{StaticResource Up}" />
            </Trigger>
            <Trigger Property="Flipped" Value="true">
                <Setter Property="Template" Value="{StaticResource Down}" />
            </Trigger>
        </Style.Triggers>
    </Style>
</UserControl.Resources>

您可以尝试使用户控件具有一个顶级子项,例如 ContentControl,并将样式应用于 ContentControl。这样,您就不会收到递归。

编辑:以下来自原始提问者......

这是我尝试按照您的建议进行操作。 出于某种原因,我的数据触发器从不应用模板。不知道我在这里做错了什么。

这是整个XAML尝试使用包含的内容控件:

<UserControl x:Class="XDPClient.Controls.EventMarkerControl"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:Controls="clr-namespace:XDPClient.Controls" mc:Ignorable="d" 
         d:DesignHeight="513" d:DesignWidth="695"
         x:Name="uc">
<UserControl.Resources>
    <!-- Draw the user control right side up with this template -->
    <ControlTemplate x:Key="Up" TargetType="{x:Type ContentControl}">
        <Grid>
            <!-- Outline grid  -->
            <Path Stretch="Fill" Fill="#FFFFFFFF" Stroke="#FF6800FF" StrokeThickness="3" StrokeStartLineCap="Flat" StrokeEndLineCap="Flat" StrokeLineJoin="Miter" StrokeMiterLimit="4" Name="rect2985" RenderTransformOrigin="0,0">
                <Path.Data>
                    <PathGeometry FillRule="Nonzero"   Figures="M 0,250 L 0,50 L 150,50 L 200,-0.96 L 250,50 L 400,50 L 400,250 L 0,250z" />
                </Path.Data>
            </Path>
            <!-- Placement of the content -->
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="1*" />
                    <RowDefinition Height="4*" />
                </Grid.RowDefinitions>
                <Grid Grid.Row="1" Margin="3">
                    <ContentPresenter Grid.Row="1" 
                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}"        
                        SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                </Grid>
            </Grid>
            <Grid.BitmapEffect>
                <DropShadowBitmapEffect />
            </Grid.BitmapEffect>
        </Grid>
    </ControlTemplate>
    <!-- Draw the user control flipped with this template -->
    <ControlTemplate x:Key="Down" TargetType="{x:Type ContentControl}">
        <Grid>
            <!-- Outline grid  -->
            <Path Stretch="Fill" Fill="#FFFFFFFF" Stroke="#FF6800FF" StrokeThickness="3" StrokeStartLineCap="Flat" StrokeEndLineCap="Flat" StrokeLineJoin="Miter" StrokeMiterLimit="4" Name="rect2985" RenderTransformOrigin="0,0">
                <Path.Data>
                    <PathGeometry FillRule="Nonzero"   Figures="M 0,250 L 0,50 L 150,50 L 200,-0.96 L 250,50 L 400,50 L 400,250 L 0,250z" />
                </Path.Data>
                <Path.RenderTransform>
                    <ScaleTransform ScaleX="-1" />
                </Path.RenderTransform>
            </Path>
            <!-- Placement of the content -->
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="1*" />
                    <RowDefinition Height="4*" />
                </Grid.RowDefinitions>
                <Grid Grid.Row="1" Margin="3">
                    <ContentPresenter Grid.Row="1" 
                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}"        
                        SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                </Grid>
            </Grid>
            <Grid.BitmapEffect>
                <DropShadowBitmapEffect />
            </Grid.BitmapEffect>
        </Grid>
    </ControlTemplate>

</UserControl.Resources>
<ContentControl x:Name="ContentControl" >
    <!-- Style for the content control -->
    <ContentControl.Style>
            <Style TargetType="{x:Type ContentControl}">
            <Style.Triggers>
                <DataTrigger Value="False" Binding="{Binding ElementName=uc, Path=Flipped}">
                    <Setter Property="ContentControl.Template" Value="{StaticResource Up}" />
                </DataTrigger>
                <DataTrigger Value="True" Binding="{Binding ElementName=uc, Path=Flipped}">
                    <Setter Property="ContentControl.Template" Value="{StaticResource Down}" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </ContentControl.Style>
</ContentControl>
</UserControl>

如果我像这样手动应用样式:

    <ContentControl x:Name="ContentControl" Template="{StaticResource Up}">

看起来不错! 只是我的数据触发器没有触发"翻转"的值

最新更新