Question

通过在Overlay上应用OpacityMask，我在禁用的ImageButton自定义控件上显示图像。预期的效果是只有图像的主体变灰，因此图像上没有边框或框。

问题是：只要通过绑定的getter（在{TemplateBinding XXX}中编写的东西）访问图像URI，掩码就不适用。但是，如果明确声明了URI，则掩码将起作用。所以问题是，为什么在TmplateBinding的情况下会出现问题以及如何解决它。

定义自定义图像按钮的XAML代码是：

            <my1:ImageButton Height="24" Width="24" x:Name="imageButton1" IsEnabled="False" ImageSource="/SilverlightApplication4;component/Undo_24x24.png" Margin="178,75,198,201">
            <Image Source="/SilverlightApplication4;component/Undo_24x24.png" Height="24" Width="24" />
        </my1:ImageButton>

自定义属性处理程序代码为：

    public class ImageButton: Button
{
    public static readonly DependencyProperty ImageSourceProperty = DependencyProperty.Register("ImageSource", typeof(ImageSource), typeof(ImageButton), new PropertyMetadata(null));
    public ImageSource ImageSource
    {
        get
        {
            return (ImageSource)this.GetValue(ImageSourceProperty);
        }
        set
        {
            this.SetValue(ImageSourceProperty, value);
        }
    }
}

自定义控件的样式代码（禁用状态）：

                            <Rectangle x:Name="DisabledVisualElement" Fill="Red" Opacity="0" >
                            <Rectangle.OpacityMask>
                                <ImageBrush ImageSource="{TemplateBinding ImageSource}"/>                                   
                            </Rectangle.OpacityMask>
                        </Rectangle>

有趣的是，以下代码片段都放在样式模板

中

<Image Source="{TemplateBinding ImageSource}" Height="24" Width="24" />

以及

                            <Rectangle x:Name="DisabledVisualElement" Fill="Red" Opacity="0" >
                            <Rectangle.OpacityMask>
                                <ImageBrush ImageSource="/SilverlightApplication4;component/Undo_24x24.png"/>                                   
                            </Rectangle.OpacityMask>
                        </Rectangle>

两者都正常工作。所以问题似乎在于ImageSource =“{TemplateBinding ImageSource}”以某种方式检索不正确的URI或由于某些其他原因而无效。那么，如何纠正这个？

Answer 1

TemplateBinding的功能不如常规绑定。 TemplateBinding无法自动将字符串/ uri转换为实际的位图。

解决方案（使用常规绑定）：

<Rectangle x:Name="DisabledVisualElement" Fill="Red" Opacity="0" >
    <Rectangle.OpacityMask>
        <ImageBrush ImageSource="{Binding Path=ImageSource, RelativeSource={RelativeSource TemplatedParent}}"/>                                   
    </Rectangle.OpacityMask>
</Rectangle>

silverLight：OpacityMask不适用于自定义控件

1 个答案: