c# - 绑定(bind)到通用UI元素/XAML接口(interface)

我有一个DrawingImage可用作矢量图像占位符。
进一步，有些样式会采用相应的DrawingImage并将其用作我的UserControl自定义按钮中的图像。

到目前为止，一切都还不错，但是我才意识到我当前的方法已经导致我的DrawingImages不可重用，因为它们的Brush属性硬绑定到了控件上，它们的用法如下：

<DrawingImage x:Key="addIcon">
        <DrawingImage.Drawing>
            <DrawingGroup>
                <GeometryDrawing Brush="{Binding Path=ImageBrush, ElementName=addButton}" Geometry="M438.2,0H51.6C23.1,0,0,23.2,0,51.6v386.6c0,28.5,23.2,51.6,51.6,51.6h386.6c28.5,0,51.6-23.2,51.6-51.6V51.6
                    C489.8,23.2,466.6,0,438.2,0z M465.3,438.2c0,14.9-12.2,27.1-27.1,27.1H51.6c-14.9,0-27.1-12.2-27.1-27.1V51.6
                    c0-14.9,12.2-27.1,27.1-27.1h386.6c14.9,0,27.1,12.2,27.1,27.1V438.2z" />
                <GeometryDrawing Brush="{Binding Path=ImageBrush, ElementName=addButton}" Geometry="M337.4,232.7h-80.3v-80.3c0-6.8-5.5-12.3-12.3-12.3s-12.3,5.5-12.3,12.3v80.3h-80.3c-6.8,0-12.3,5.5-12.3,12.2
                    c0,6.8,5.5,12.3,12.3,12.3h80.3v80.3c0,6.8,5.5,12.3,12.3,12.3s12.3-5.5,12.3-12.3v-80.3h80.3c6.8,0,12.3-5.5,12.3-12.3
                    C349.7,238.1,344.2,232.7,337.4,232.7z" />
            </DrawingGroup>
        </DrawingImage.Drawing>
    </DrawingImage>

现在，我试图找到一种方法，使它们不直接绑定到Element，而是绑定到某种通用Element（当接口工作时类似），以便代码可以确保绑定到它的任何内容，具有画笔依赖项属性。

到目前为止，我找不到它。

我也尝试过搜索祖先，但还是没有运气。

是否有或多或少的惯例是绑定到具有某些依赖项属性的未知元素，而不直接暴露它们呢？

最佳答案

实际上，无法直接执行您的要求。原因是，当您将DrawingImage定义为资源，然后将其用作图像源时，则不会创建该资源的副本，但是每个图像都将查找同一资源。因此，DrawingImage在视觉树中根本没有父级，因此没有绑定到的控件。

这里有两个选择。一种是使用Geometry作为资源，而不是DrawingImage。然后，您可以引用此DrawingImage并使用不同的颜色来创建一些Geometry资源。或者根本不使用DrawingImage，而是直接使用Geometry（例如，通过Path）。实际上，有很多方法可以使用和组合几何资源。我在这里仅举几个例子：

<Window x:Class="FlipControlApp.MainWindow"
        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"
        Title="MainWindow" Height="300" Width="300">
    <Window.Resources>
        <PathGeometry x:Key="addIconGeometry" Figures="M337.4,232.7h-80.3v-80.3c0-6.8-5.5-12.3-12.3-12.3s-12.3,5.5-12.3,12.3v80.3h-80.3c-6.8,0-12.3,5.5-12.3,12.2
                c0,6.8,5.5,12.3,12.3,12.3h80.3v80.3c0,6.8,5.5,12.3,12.3,12.3s12.3-5.5,12.3-12.3v-80.3h80.3c6.8,0,12.3-5.5,12.3-12.3
                C349.7,238.1,344.2,232.7,337.4,232.7z"/>

        <PathGeometry x:Key="iconBorderGeometry" Figures="M438.2,0H51.6C23.1,0,0,23.2,0,51.6v386.6c0,28.5,23.2,51.6,51.6,51.6h386.6c28.5,0,51.6-23.2,51.6-51.6V51.6
                C489.8,23.2,466.6,0,438.2,0z M465.3,438.2c0,14.9-12.2,27.1-27.1,27.1H51.6c-14.9,0-27.1-12.2-27.1-27.1V51.6
                c0-14.9,12.2-27.1,27.1-27.1h386.6c14.9,0,27.1,12.2,27.1,27.1V438.2z"/>

        <GeometryGroup x:Key="addIconWithBorderGeometry">
            <StaticResource ResourceKey="iconBorderGeometry"/>
            <StaticResource ResourceKey="addIconGeometry"/>
        </GeometryGroup>

        <DrawingImage x:Key="addIconBlack">
            <DrawingImage.Drawing>
                <DrawingGroup>
                    <GeometryDrawing Brush="Black" Geometry="{StaticResource addIconWithBorderGeometry}" />
                </DrawingGroup>
            </DrawingImage.Drawing>
        </DrawingImage>
    </Window.Resources>

    <UniformGrid Columns="2">
        <Button Name="addButton0" Width="100" Height="100">
            <Image Source="{StaticResource addIconBlack}"/>
        </Button>

        <Button Width="100" Height="100" Foreground="Blue">
            <Image>
                <Image.Source>
                    <DrawingImage>
                        <DrawingImage.Drawing>
                            <DrawingGroup>
                                <GeometryDrawing Brush="{Binding Foreground, RelativeSource={RelativeSource AncestorType=Control}}"
                                                 Geometry="{StaticResource addIconGeometry}" />
                            </DrawingGroup>
                        </DrawingImage.Drawing>
                    </DrawingImage>
                </Image.Source>
            </Image>
        </Button>

        <Button Width="100" Height="100" Foreground="Green">
            <Grid>
                <Path Data="{StaticResource iconBorderGeometry}" Fill="Pink" Stretch="Uniform"/>
                <Path Data="{StaticResource addIconGeometry}" Fill="Purple" Stretch="Uniform" Margin="15"/>
            </Grid>
        </Button>

        <Button x:Name="addBtn" Width="100" Height="100" Foreground="Green">
            <Path Fill="{Binding Foreground, ElementName=addBtn}" Stretch="Uniform">
                <Path.Data>
                    <CombinedGeometry Geometry1="{StaticResource iconBorderGeometry}" Geometry2="{StaticResource addIconGeometry}"/>
                </Path.Data>
            </Path>
        </Button>
    </UniformGrid>
</Window>

c# - 绑定(bind)到通用UI元素/XAML接口(interface)-LMLPHP

另一种选择是将整个Image用作资源，并且将Brush绑定到一些祖先属性。但是在这种情况下，必须使用属性x:Shared，因此必须在已编译的资源字典中声明资源（有关详细信息，请参见x:Shared）。

创建资源：

<ResourceDictionary>
    <Image x:Key="addIconImage2" x:Shared="False">
        <Image.Source>
            <DrawingImage>
                <DrawingImage.Drawing>
                    <DrawingGroup>
                        <GeometryDrawing Brush="{Binding Foreground, RelativeSource={RelativeSource AncestorType=Control}}"
                            Geometry="M438.2,0H51.6C23.1,0,0,23.2,0,51.6v386.6c0,28.5,23.2,51.6,51.6,51.6h386.6c28.5,0,51.6-23.2,51.6-51.6V51.6
                            C489.8,23.2,466.6,0,438.2,0z M465.3,438.2c0,14.9-12.2,27.1-27.1,27.1H51.6c-14.9,0-27.1-12.2-27.1-27.1V51.6
                            c0-14.9,12.2-27.1,27.1-27.1h386.6c14.9,0,27.1,12.2,27.1,27.1V438.2z" />
                        <GeometryDrawing Brush="{Binding Foreground, RelativeSource={RelativeSource AncestorType=Control}}"
                            Geometry="M337.4,232.7h-80.3v-80.3c0-6.8-5.5-12.3-12.3-12.3s-12.3,5.5-12.3,12.3v80.3h-80.3c-6.8,0-12.3,5.5-12.3,12.2
                            c0,6.8,5.5,12.3,12.3,12.3h80.3v80.3c0,6.8,5.5,12.3,12.3,12.3s12.3-5.5,12.3-12.3v-80.3h80.3c6.8,0,12.3-5.5,12.3-12.3
                            C349.7,238.1,344.2,232.7,337.4,232.7z" />
                    </DrawingGroup>
                </DrawingImage.Drawing>
            </DrawingImage>
        </Image.Source>
    </Image>
</ResourceDictionary>

然后使用它：

<Button Name="addButton3" Width="100" Height="100"
        Content="{StaticResource addIconImage}" Foreground="Red"/>
<Button Name="addButton4" Width="100" Height="100"
        Content="{StaticResource addIconImage}" Foreground="Green"/>

每次引用它时，都会创建一个新副本。

但是第一种方法更灵活。

关于c# - 绑定(bind)到通用UI元素/XAML接口(interface)，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/43227901/