1

我正在尝试使用 XAML 创建一个 WPF 用户控件，它是一个老式的复选框控件，下面的代码在屏幕上看起来还可以，但是为了使控件更改状态，您必须单击框内任何位置的路径我是什么做错了吗？

正如你可以正确地看到我在 WPF 方面有点菜鸟，所以如果有什么我做得非常糟糕的事情，请发表评论。

<UserControl
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"
x:Class="BFCheckBoxTest.BFCheckBox"
x:Name="UserControl"
d:DesignWidth="55" d:DesignHeight="55">
<UserControl.Resources>
    <SolidColorBrush x:Key="CheckBoxFillNormal" Color="#F4F4F4"/>
    <SolidColorBrush x:Key="CheckBoxStroke" Color="#8E8F8F"/>
    <Style x:Key="EmptyCheckBoxFocusVisual">
        <Setter Property="Control.Template">
            <Setter.Value>
                <ControlTemplate>
                    <Rectangle Margin="1" SnapsToDevicePixels="true" Stroke="Black" StrokeThickness="1" StrokeDashArray="1 2"/>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style x:Key="BFCheckBoxStyle" TargetType="{x:Type CheckBox}">
        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
        <Setter Property="Background" Value="{StaticResource CheckBoxFillNormal}"/>
        <Setter Property="BorderBrush" Value="{StaticResource CheckBoxStroke}"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="FocusVisualStyle" Value="{StaticResource EmptyCheckBoxFocusVisual}"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type CheckBox}">
                    <Grid x:Name="Controlgrid" Height="{TemplateBinding ActualHeight}" Width="{TemplateBinding ActualWidth}">
                        <Border x:Name="border" BorderBrush="Black" BorderThickness="1" HorizontalAlignment="Left" Height="{Binding ActualHeight, ElementName=Controlgrid}" VerticalAlignment="Bottom" Width="{Binding ActualWidth, ElementName=Controlgrid}" Grid.ColumnSpan="1" RenderTransformOrigin="0.518,0.127" d:IsLocked="True"/>
                        <Viewbox x:Name="CrossViewbox" HorizontalAlignment="Left" Height="Auto" VerticalAlignment="Top" Width="Auto" Margin="4" Visibility="Hidden">
                            <Path x:Name="Cross" Data="M0,55 L55,0 M0,0 L55,55" HorizontalAlignment="Left" Height="{Binding ActualHeight, ElementName=border}" Margin="0" Stretch="Fill" Stroke="Red" StrokeThickness="2" VerticalAlignment="Bottom" Width="{Binding ActualWidth, ElementName=border}" Grid.ColumnSpan="1" Focusable="False"/>
                        </Viewbox>
                        <Viewbox x:Name="TickViewBox" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="4" RenderTransformOrigin="0.373,0.225" Visibility="Visible">
                            <Path x:Name="Tick" Data="M0,35 L20,55 L55,0" HorizontalAlignment="Left" Height="{Binding ActualHeight, ElementName=border}" Margin="0" Stretch="Fill" Stroke="Green" StrokeThickness="2" VerticalAlignment="Bottom" Width="{Binding ActualWidth, ElementName=border}" Grid.ColumnSpan="1" Focusable="False"/>
                        </Viewbox>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <EventTrigger RoutedEvent="ButtonBase.Click"/>
                        <Trigger Property="IsChecked" Value="true">
                            <Setter Property="Visibility" TargetName="TickViewBox" Value="Visible" />
                            <Setter Property="Visibility" TargetName="CrossViewbox" Value="Hidden" />
                        </Trigger>
                        <Trigger Property="IsChecked" Value="false">
                            <Setter Property="Visibility" TargetName="TickViewBox" Value="Hidden" />
                            <Setter Property="Visibility" TargetName="CrossViewbox" Value="Visible" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</UserControl.Resources>

<CheckBox Content="CheckBox" HorizontalAlignment="Left" VerticalAlignment="Top" Style="{DynamicResource BFCheckBoxStyle}" Height="{Binding ActualHeight, ElementName=UserControl}" Width="{Binding ActualWidth, ElementName=UserControl}"/>

实际上，我正在将 iPad 应用程序移植到 WPF，在 iPad 中，我使用了一个动画层来为路径设置动画，就好像它是手工绘制的一样，它非常简单，您只需为其提供路径和持续时间，IOS 会处理其余的在 WPF 中是否有类似的东西，或者你将如何在 WPF 中实现它？

问候克里斯蒂安·阿里尔德·斯托尔·安徒生

4

1 回答 1

1

原因是您没有在 ControlTemplate 中绑定背景画笔。因此，在您的 XAML ControlTemplate 中进行此更改

<Grid x:Name="Controlgrid" Background="{TemplateBinding Background}">

除此之外，您不需要对布尔属性进行两次触发器调用，因此只需一个触发器即可为您完成这项工作。

<Trigger Property="IsChecked" Value="true">
    <Setter Property="Visibility" TargetName="TickViewBox" Value="Visible" />
    <Setter Property="Visibility" TargetName="CrossViewbox" Value="Hidden" />
</Trigger>
于 2013-07-26T09:42:33.780 回答