WPF - 更改复选框选中标记以图像（或隐藏）

Can anyone know if there is a simple way to replace checkbox checkmark by image?

任何人都可以知道是否有一种简单的方法来替换图像的复选框复选标记?

I have two images for "checked" and "unchecked" checkbox state. I don't know how to use them instead of checkmark.

我有两个用于“已选中”和“未选中”复选框状态的图像。我不知道如何使用它们而不是复选标记。

I also tried to replace content with StackPanel and put Image and TextBlock inside. Images are switching by triggers. It works fine but I have no idea how to remove checkmark icon.

我还尝试用StackPanel替换内容并将Image和TextBlock放在里面。图像通过触发切换。它工作正常,但我不知道如何删除复选标记图标。

I googled a lot and found complicated solutions with tons of XAML (BulletDecorator etc). I personaly don't like to complicate my life and I believe there is a simplier solution.

我google了很多,发现了大量XAML(BulletDecorator等)的复杂解决方案。我个人不喜欢让我的生活复杂化,我相信有一个更简单的解决方案。

1 个解决方案

#1

You could simply define your own ControlTemplate for the Checkbox, in which you display your images instead of the default tick. You can find the default ControlTemplate for the Checkbox in the CheckBox Styles and Templates page on MSDN.

您可以简单地为Checkbox定义自己的ControlTemplate,在其中显示图像而不是默认刻度。您可以在MSDN上的CheckBox样式和模板页面中找到Checkbox的默认ControlTemplate。

When defining your own ControlTemplate, it's often a good idea to start with the default. Get that working in your project and then you can start tweaking it to your liking. That way, it should keep all the default behaviours that users are used to from a Checkbox.

在定义自己的ControlTemplate时,从默认开始通常是一个好主意。让它在您的项目中工作,然后您可以根据自己的喜好开始调整它。这样,它应该保留用户从Checkbox中使用的所有默认行为。

But this is WPF we're talking about here... with a little lateral thinking, it's easily possible to make several controls look like other controls. For example, here is a ToggleButton with a custom ControlTemplate that makes it look like a Checkbox, but with an Image that changes when you click on it instead of the normal tick mark:

但这是我们在这里讨论的WPF ......通过一点横向思考,很容易使几个控件看起来像其他控件。例如,这是一个带有自定义ControlTemplate的ToggleButton,它使它看起来像一个复选框,但是当你单击它而不是正常的刻度标记时,它会发生变化:

<ToggleButton Content="I'm An Image CheckBox Label" Foreground="Black">
    <ToggleButton.Template>
        <ControlTemplate TargetType="{x:Type ToggleButton}">
            <StackPanel Orientation="Horizontal">
                <Image>
                    <Image.Style>
                        <Style>
                            <Setter Property="Image.Source" 
                                Value="/AppName;component/Images/Image1.jpg" />
                            <Style.Triggers>
                                <DataTrigger Binding="{Binding IsChecked, 
                                    RelativeSource={RelativeSource AncestorType=
                                    {x:Type ToggleButton}}}" Value="True">
                                    <Setter Property="Image.Source" 
                                        Value="/AppName;component/Images/Image2.jpg" />
                                </DataTrigger>
                            </Style.Triggers>
                        </Style>
                    </Image.Style>
                </Image>
                <ContentPresenter Content="{TemplateBinding Content}" 
                    Margin="5,0,0,0" />
            </StackPanel>
        </ControlTemplate>
    </ToggleButton.Template>
</ToggleButton>

It would also be easy to convert this to a CheckBox as that also uses the IsChecked property... you could probably even just replace all instances of the word ToggleButton with the word Checkbox and it should work.

将它转换为CheckBox也很容易,因为它也使用了IsChecked属性......你甚至可以用单词Checkbox替换单词ToggleButton的所有实例,它应该可以工作。