WPF自定义控件：TemplateBinding到图像 [英] WPF Custom Control: TemplateBinding to Image

问题描述

我正在创建一个WPF自定义控件，按钮，其中包含图像和文本。我已经为控件添加了两个依赖项属性， ImagePath 和 Text ，以及控件模板（在Themes \Generic中） .xaml）是一个简单的堆栈面板，可以水平排列图像和文本。

I am creating a WPF custom control, a Button with an Image and Text. I have added two dependency properties to the control, ImagePath and Text, and the control template (in Themes\Generic.xaml) is a simple stack panel that arranges the image and text horizontally.

Text 属性可以正常工作。但由于某些原因，当我使用 TemplateBinding 到 ImagePath 依赖项时，我的测试项目中的示例图像不会出现获得其路径的财产。我通过临时替换自定义控件中的 TemplateBinding 并使用图像路径来测试图像，在这种情况下它会出现。

The Text property works fine. But for some reason, the sample image in my test project doesn't appear when I use TemplateBinding to the ImagePath dependency property to get its path. I have tested the image by temporarily replacing the TemplateBinding in the custom control with a path to the image, in which case it appears.

我希望在这个领域有更多经验的人可以看看并告诉我为什么控制没有按预期工作。感谢您的帮助。

I am hoping that someone with more experience in this area can take a look and tell me why the control isn't working as expected. Thanks for your help.

我的VS 2008解决方案包含一个项目CustomControlDemo。该项目包含一个自定义控件，TaskButton.cs和一个主窗口Window1.xaml，我用它来测试控件。我的测试图像calendar.png位于项目根级别的Resources文件夹中，Generic.xaml位于Themes文件夹中，也位于项目的根级别。

My VS 2008 solution contains one project, CustomControlDemo. The project contains a custom control, TaskButton.cs, and a main window, Window1.xaml, that I use to test the control. My test image, calendar.png, is located in a Resources folder at the root level of the project, and Generic.xaml is located in a Themes folder, also at the root level of the project.

以下是我的自定义控件的代码（来自TaskButton.cs）：

Here is the code for my custom control (from TaskButton.cs):

using System.Windows;
using System.Windows.Controls;

namespace CustomControlDemo
{
    public class TaskButton : RadioButton
    {
        #region Fields

        // Dependency property backing variables
        public static readonly DependencyProperty ImagePathProperty;
        public static readonly DependencyProperty TextProperty;

        #endregion

        #region Constructors

        /// <summary>
        /// Default constructor.
        /// </summary>
        static TaskButton()
        {
            DefaultStyleKeyProperty.OverrideMetadata(typeof(TaskButton), new FrameworkPropertyMetadata(typeof(TaskButton)));

            // Initialize ImagePath dependency properties
            ImagePathProperty = DependencyProperty.Register("ImagePath", typeof(string), typeof(TaskButton), new UIPropertyMetadata(null));
            TextProperty = DependencyProperty.Register("Text", typeof(string), typeof(TaskButton), new UIPropertyMetadata(null));
        }

        #endregion

        #region Dependency Property Wrappers

        /// <summary>
        /// The ImagePath dependency property.
        /// </summary>
        public string ImagePath
        {
            get { return (string)GetValue(ImagePathProperty); }
            set { SetValue(ImagePathProperty, value); }
        }

        /// <summary>
        /// The Text dependency property.
        /// </summary>
        public string Text
        {
            get { return (string)GetValue(TextProperty); }
            set { SetValue(TextProperty, value); }
        }

        #endregion
    }
}

这是控件模板（来自Generic.xaml）：

And here is the control template (from Generic.xaml):

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:CustomControlDemo">


    <Style TargetType="{x:Type local:TaskButton}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type local:TaskButton}">
                    <StackPanel Height="Auto" Orientation="Horizontal">
                        <Image Source="{TemplateBinding ImagePath}"  Width="24" Height="24" Stretch="Fill"/>
                        <TextBlock Text="{TemplateBinding Text}"  HorizontalAlignment="Left" Foreground="{DynamicResource TaskButtonTextBrush}" FontWeight="Bold"  Margin="5,0,0,0" VerticalAlignment="Center" FontSize="12" />
                    </StackPanel>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>

最后，这是我用来测试控件的Window1标记：

And finally, here is the Window1 markup that I am using to test the control:

<Window x:Class="CustomControlDemo.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:customControl="clr-namespace:CustomControlDemo"
    Title="Window1" Height="300" Width="300">
    <Grid>
        <customControl:TaskButton ImagePath="Resources\calendar.png" Text="Calendar" />
    </Grid>
</Window>

为什么图像路径不起作用的任何想法？再次感谢。

Any ideas why the image path isn't working? Thanks again.

推荐答案

图片不会将字符串作为源:)您可以在intellisense中看到这一点。您需要绑定ImageSource（或使用IValueConverter将字符串转换为ImageSource）

Image doesn't take a string as a source :) You can see this in intellisense. You need to bind on an ImageSource (Or use an IValueConverter to convert the string to an ImageSource)

参见这个问题，以获取有关如何进行此转换的一些提示。

See this question for some tips on how to do this conversion.

这篇关于WPF自定义控件：TemplateBinding到图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！