将 GeometryDrawing 画笔绑定到自定义控件依赖项 属性
Bind GeometryDrawing Brush To A Custom Control Dependency Property
我想实现一个自定义控件，它显示资源字典中的图标，我可以使用依赖项更改它的颜色 属性。
我有一堆图标被转换为 xaml，它们都存储在 icons.xaml 资源字典中。
我创建了一个名为 Icon 的自定义控件，它继承自 Image，它有一个名为 IconBrush 的依赖项 属性。
我可以轻松地将自定义控件“图标”的源设置为我在 icons.xaml 中的 DrawingImage。问题是我不知道如何将 icons.xaml 中的 GeometryDrawing 的画笔 属性 绑定到我的图标依赖项 属性 IconBrush，我该如何实现？
下面是 icons.xaml 中存在的图标之一。
<Geometry x:Key="payGeometry1">F1 M480,480.00029z M0,0z M400,345.886719L379.625,333.679688C373.414062,329.964844,366.308594,328.003906,359.070312,328L328.40625,328C322.128906,327.988281,315.878906,328.796875,309.808594,330.398438L217.417969,355.199219C207.316406,357.988281,199.203125,365.511719,195.664062,375.375L114.398438,331.410156C107.808594,327.660156 100.09375,326.386719 92.648438,327.816406 89.839844,328.3125 87.117188,329.207031 84.558594,330.472656 78.78125,333.238281 73.988281,337.707031 70.816406,343.273438 68.042969,348.121094 66.585938,353.609375 66.585938,359.191406 66.5,370.589844 72.539062,381.152344 82.398438,386.863281L228.046875,474.007812C234.375,477.925781,241.664062,480,249.105469,480L361.824219,480C366.859375,480.003906,371.847656,479.050781,376.527344,477.199219L400,467.929688 400,480 480,480 480,320 400,320z M370.648438,462.320312C367.847656,463.425781,364.859375,463.996094,361.847656,464L249.105469,464C244.597656,463.996094,240.179688,462.726562,236.359375,460.335938L90.511719,373.089844C85.554688,370.226562 82.519531,364.921875 82.558594,359.199219 82.570312,356.394531 83.308594,353.636719 84.703125,351.199219 86.296875,348.4375 88.695312,346.222656 91.574219,344.855469 92.84375,344.238281 94.1875,343.800781 95.574219,343.558594 96.585938,343.371094 97.613281,343.273438 98.640625,343.273438 101.390625,343.265625 104.09375,343.984375 106.480469,345.351562L194.601562,392.96875C194.703125,393.457031 194.703125,393.9375 194.832031,394.425781 198.621094,408.390625 211.289062,418.089844 225.761719,418.105469 230.214844,417.699219 234.625,416.910156 238.945312,415.753906L322.0625,393.511719 317.9375,378.054688 235.089844,400.199219C231.441406,401.039062 226.734375,402 225.761719,402.082031 218.535156,402.09375 212.199219,397.265625 210.296875,390.296875 210.039062,389.328125 209.886719,388.335938 209.832031,387.335938 209.832031,387.335938 209.769531,385.398438 209.832031,384.71875 210.441406,378.027344 215.128906,372.410156 221.601562,370.609375L313.953125,345.902344C318.667969,344.640625,323.527344,344,328.40625,344L359.070312,344C363.414062,344,367.675781,345.179688,371.398438,347.410156L400,364.535156 400,450.71875z M416,336L464,336 464,464 416,464z M416,336</Geometry>
<Geometry x:Key="payGeometry2">F1 M480,480.00029z M0,0z M329.953125,64L287.039062,21.089844C273.566406,7.539062,255.234375,-0.0546875,236.128906,0L135.550781,0C129.34375,0.0078125,123.222656,1.457031,117.664062,4.222656L99.734375,13.191406C96.140625,15,92.148438,15.863281,88.128906,15.703125L80,15.417969 80,0 0,0 0,176 80,176 80,152 93.601562,152 98.441406,155.199219C111.984375,164.191406,127.753906,169.269531,144,169.863281L144,272 480,272 480,64z M64,160L16,160 16,16 64,16z M107.296875,141.886719L98.398438,136 80,136 80,31.425781 87.542969,31.695312C94.242188,31.933594,100.890625,30.492188,106.886719,27.503906L124.800781,18.535156C128.136719,16.867188,131.820312,16,135.550781,16L236.128906,16C250.988281,15.957031,265.25,21.863281,275.726562,32.398438L307.328125,64 241.3125,64 221.894531,44.585938 210.585938,55.894531 267.097656,112.410156C273.375,118.660156 273.394531,128.816406 267.144531,135.097656 260.890625,141.375 250.734375,141.394531 244.457031,135.144531L197.257812,87.945312 191.65625,92.746094C176.191406,105.878906,153.585938,106.214844,137.734375,93.542969L133.097656,89.785156 123.015625,102.214844 127.703125,106.015625C132.605469,109.933594,138.109375,113.035156,144,115.199219L144,153.855469C130.90625,153.273438,118.214844,149.136719,107.296875,141.886719z M221.097656,134.398438L233.167969,146.472656C245.699219,158.816406 265.816406,158.835938 278.367188,146.511719 266.625,164.695312 271.257812,188.894531 288.886719,201.453125 306.515625,214.011719 330.902344,210.484375 344.25,193.449219 357.597656,176.410156 355.1875,151.886719 338.773438,137.777344 322.363281,123.667969 297.753906,124.960938 282.914062,140.710938 288.378906,132.128906 289.355469,121.433594 285.535156,112L392.664062,112C396.105469,132.128906,411.871094,147.894531,432,151.335938L432,184.664062C411.871094,188.105469,396.105469,203.871094,392.664062,224L231.335938,224C227.894531,203.871094,212.128906,188.105469,192,184.664062L192,151.335938C203.433594,149.410156,213.773438,143.390625,221.097656,134.398438z M288,168C288,154.746094 298.746094,144 312,144 325.253906,144 336,154.746094 336,168 336,181.253906 325.253906,192 312,192 298.746094,192 288,181.253906 288,168z M464,256L160,256 160,118.550781C172.683594,119.503906,185.328125,116.269531,196,109.351562L209.648438,123C203.644531,131.15625,194.128906,135.980469,184,136L176,136 176,200 184,200C201.671875,200,216,214.328125,216,232L216,240 408,240 408,232C408,214.328125,422.328125,200,440,200L448,200 448,136 440,136C422.328125,136,408,121.671875,408,104L408,96 273.3125,96 257.3125,80 464,80z M464,256</Geometry>
<DrawingGroup x:Key="payDrawingGroup" ClipGeometry="M0,0 V480.00029 H480 V0 H0 Z">
<DrawingGroup.Transform>
<TranslateTransform X="0" Y="0.00029334536520764232" />
</DrawingGroup.Transform>
<GeometryDrawing Brush="{{Should bind here}}" Geometry="{StaticResource payGeometry1}" />
<GeometryDrawing Brush="{{Should bind here}}" Geometry="{StaticResource payGeometry2}" />
</DrawingGroup>
<DrawingImage x:Key="payDrawingImage" Drawing="{StaticResource payDrawingGroup}" />
我的自定义控件，icon.cs
public class Icon : Image
{
static Icon()
{
DefaultStyleKeyProperty.OverrideMetadata(typeof(Icon), new FrameworkPropertyMetadata(typeof(Icon)));
}
public Brush IconBrush
{
get { return (Brush)GetValue(IconBrushProperty); }
set { SetValue(IconBrushProperty, value); }
}
public static readonly DependencyProperty IconBrushProperty =
DependencyProperty.Register("IconBrush", typeof(Brush), typeof(Icon), new PropertyMetadata(new SolidColorBrush(Color.FromRgb(255, 0, 255)), new PropertyChangedCallback(OnIconBrushChanged)));
public Icon()
{
IconBrush = new SolidColorBrush(Color.FromRgb(240, 255, 5));
}
private static void OnIconBrushChanged(DependencyObject sender, DependencyPropertyChangedEventArgs args)
{
Icon icon = sender as Icon;
icon.IconBrush = (Brush)args.NewValue;
}
}
自定义控件的用法如下：
<components:Icon Source="{StaticResource payDrawingImage}" IconBrush="Blue" />
正如 Clemens 所建议的，通过预定义 System.Windows.Shapes.Path.
可以更轻松地完成
首先，定义一个引用“payGeometry1”和“payGeometry2”的样式。
<Style x:Key="PayPathStyle" TargetType="{x:Type Path}">
<Setter Property="Width" Value="40"/>
<Setter Property="Height" Value="40"/>
<Setter Property="Stretch" Value="Uniform"/>
<Setter Property="Data">
<Setter.Value>
<CombinedGeometry Geometry1="{StaticResource payGeometry1}"
Geometry2="{StaticResource payGeometry2}"/>
</Setter.Value>
</Setter>
</Style>
其次，在每个 Path 中，根据需要使用画笔设置其 Shape.Fill 属性。
<Path Style="{StaticResource PayPathStyle}" Fill="Blue"/>
我想实现一个自定义控件，它显示资源字典中的图标，我可以使用依赖项更改它的颜色 属性。
我有一堆图标被转换为 xaml，它们都存储在 icons.xaml 资源字典中。
我创建了一个名为 Icon 的自定义控件，它继承自 Image，它有一个名为 IconBrush 的依赖项 属性。
我可以轻松地将自定义控件“图标”的源设置为我在 icons.xaml 中的 DrawingImage。问题是我不知道如何将 icons.xaml 中的 GeometryDrawing 的画笔 属性 绑定到我的图标依赖项 属性 IconBrush，我该如何实现？
下面是 icons.xaml 中存在的图标之一。
<Geometry x:Key="payGeometry1">F1 M480,480.00029z M0,0z M400,345.886719L379.625,333.679688C373.414062,329.964844,366.308594,328.003906,359.070312,328L328.40625,328C322.128906,327.988281,315.878906,328.796875,309.808594,330.398438L217.417969,355.199219C207.316406,357.988281,199.203125,365.511719,195.664062,375.375L114.398438,331.410156C107.808594,327.660156 100.09375,326.386719 92.648438,327.816406 89.839844,328.3125 87.117188,329.207031 84.558594,330.472656 78.78125,333.238281 73.988281,337.707031 70.816406,343.273438 68.042969,348.121094 66.585938,353.609375 66.585938,359.191406 66.5,370.589844 72.539062,381.152344 82.398438,386.863281L228.046875,474.007812C234.375,477.925781,241.664062,480,249.105469,480L361.824219,480C366.859375,480.003906,371.847656,479.050781,376.527344,477.199219L400,467.929688 400,480 480,480 480,320 400,320z M370.648438,462.320312C367.847656,463.425781,364.859375,463.996094,361.847656,464L249.105469,464C244.597656,463.996094,240.179688,462.726562,236.359375,460.335938L90.511719,373.089844C85.554688,370.226562 82.519531,364.921875 82.558594,359.199219 82.570312,356.394531 83.308594,353.636719 84.703125,351.199219 86.296875,348.4375 88.695312,346.222656 91.574219,344.855469 92.84375,344.238281 94.1875,343.800781 95.574219,343.558594 96.585938,343.371094 97.613281,343.273438 98.640625,343.273438 101.390625,343.265625 104.09375,343.984375 106.480469,345.351562L194.601562,392.96875C194.703125,393.457031 194.703125,393.9375 194.832031,394.425781 198.621094,408.390625 211.289062,418.089844 225.761719,418.105469 230.214844,417.699219 234.625,416.910156 238.945312,415.753906L322.0625,393.511719 317.9375,378.054688 235.089844,400.199219C231.441406,401.039062 226.734375,402 225.761719,402.082031 218.535156,402.09375 212.199219,397.265625 210.296875,390.296875 210.039062,389.328125 209.886719,388.335938 209.832031,387.335938 209.832031,387.335938 209.769531,385.398438 209.832031,384.71875 210.441406,378.027344 215.128906,372.410156 221.601562,370.609375L313.953125,345.902344C318.667969,344.640625,323.527344,344,328.40625,344L359.070312,344C363.414062,344,367.675781,345.179688,371.398438,347.410156L400,364.535156 400,450.71875z M416,336L464,336 464,464 416,464z M416,336</Geometry>
<Geometry x:Key="payGeometry2">F1 M480,480.00029z M0,0z M329.953125,64L287.039062,21.089844C273.566406,7.539062,255.234375,-0.0546875,236.128906,0L135.550781,0C129.34375,0.0078125,123.222656,1.457031,117.664062,4.222656L99.734375,13.191406C96.140625,15,92.148438,15.863281,88.128906,15.703125L80,15.417969 80,0 0,0 0,176 80,176 80,152 93.601562,152 98.441406,155.199219C111.984375,164.191406,127.753906,169.269531,144,169.863281L144,272 480,272 480,64z M64,160L16,160 16,16 64,16z M107.296875,141.886719L98.398438,136 80,136 80,31.425781 87.542969,31.695312C94.242188,31.933594,100.890625,30.492188,106.886719,27.503906L124.800781,18.535156C128.136719,16.867188,131.820312,16,135.550781,16L236.128906,16C250.988281,15.957031,265.25,21.863281,275.726562,32.398438L307.328125,64 241.3125,64 221.894531,44.585938 210.585938,55.894531 267.097656,112.410156C273.375,118.660156 273.394531,128.816406 267.144531,135.097656 260.890625,141.375 250.734375,141.394531 244.457031,135.144531L197.257812,87.945312 191.65625,92.746094C176.191406,105.878906,153.585938,106.214844,137.734375,93.542969L133.097656,89.785156 123.015625,102.214844 127.703125,106.015625C132.605469,109.933594,138.109375,113.035156,144,115.199219L144,153.855469C130.90625,153.273438,118.214844,149.136719,107.296875,141.886719z M221.097656,134.398438L233.167969,146.472656C245.699219,158.816406 265.816406,158.835938 278.367188,146.511719 266.625,164.695312 271.257812,188.894531 288.886719,201.453125 306.515625,214.011719 330.902344,210.484375 344.25,193.449219 357.597656,176.410156 355.1875,151.886719 338.773438,137.777344 322.363281,123.667969 297.753906,124.960938 282.914062,140.710938 288.378906,132.128906 289.355469,121.433594 285.535156,112L392.664062,112C396.105469,132.128906,411.871094,147.894531,432,151.335938L432,184.664062C411.871094,188.105469,396.105469,203.871094,392.664062,224L231.335938,224C227.894531,203.871094,212.128906,188.105469,192,184.664062L192,151.335938C203.433594,149.410156,213.773438,143.390625,221.097656,134.398438z M288,168C288,154.746094 298.746094,144 312,144 325.253906,144 336,154.746094 336,168 336,181.253906 325.253906,192 312,192 298.746094,192 288,181.253906 288,168z M464,256L160,256 160,118.550781C172.683594,119.503906,185.328125,116.269531,196,109.351562L209.648438,123C203.644531,131.15625,194.128906,135.980469,184,136L176,136 176,200 184,200C201.671875,200,216,214.328125,216,232L216,240 408,240 408,232C408,214.328125,422.328125,200,440,200L448,200 448,136 440,136C422.328125,136,408,121.671875,408,104L408,96 273.3125,96 257.3125,80 464,80z M464,256</Geometry>
<DrawingGroup x:Key="payDrawingGroup" ClipGeometry="M0,0 V480.00029 H480 V0 H0 Z">
<DrawingGroup.Transform>
<TranslateTransform X="0" Y="0.00029334536520764232" />
</DrawingGroup.Transform>
<GeometryDrawing Brush="{{Should bind here}}" Geometry="{StaticResource payGeometry1}" />
<GeometryDrawing Brush="{{Should bind here}}" Geometry="{StaticResource payGeometry2}" />
</DrawingGroup>
<DrawingImage x:Key="payDrawingImage" Drawing="{StaticResource payDrawingGroup}" />
我的自定义控件，icon.cs
public class Icon : Image
{
static Icon()
{
DefaultStyleKeyProperty.OverrideMetadata(typeof(Icon), new FrameworkPropertyMetadata(typeof(Icon)));
}
public Brush IconBrush
{
get { return (Brush)GetValue(IconBrushProperty); }
set { SetValue(IconBrushProperty, value); }
}
public static readonly DependencyProperty IconBrushProperty =
DependencyProperty.Register("IconBrush", typeof(Brush), typeof(Icon), new PropertyMetadata(new SolidColorBrush(Color.FromRgb(255, 0, 255)), new PropertyChangedCallback(OnIconBrushChanged)));
public Icon()
{
IconBrush = new SolidColorBrush(Color.FromRgb(240, 255, 5));
}
private static void OnIconBrushChanged(DependencyObject sender, DependencyPropertyChangedEventArgs args)
{
Icon icon = sender as Icon;
icon.IconBrush = (Brush)args.NewValue;
}
}
自定义控件的用法如下：
<components:Icon Source="{StaticResource payDrawingImage}" IconBrush="Blue" />
正如 Clemens 所建议的，通过预定义 System.Windows.Shapes.Path.
首先，定义一个引用“payGeometry1”和“payGeometry2”的样式。
<Style x:Key="PayPathStyle" TargetType="{x:Type Path}">
<Setter Property="Width" Value="40"/>
<Setter Property="Height" Value="40"/>
<Setter Property="Stretch" Value="Uniform"/>
<Setter Property="Data">
<Setter.Value>
<CombinedGeometry Geometry1="{StaticResource payGeometry1}"
Geometry2="{StaticResource payGeometry2}"/>
</Setter.Value>
</Setter>
</Style>
其次，在每个 Path 中，根据需要使用画笔设置其 Shape.Fill 属性。
<Path Style="{StaticResource PayPathStyle}" Fill="Blue"/>