在父元素上的触发器中设置子元素的属性
我有一个用户控件,它由包含椭圆和视图框的画布组成。椭圆是背景,并且视图框在运行时用从另一个程序集加载的图形填充。我在为控件创建“热”行为时遇到问题,因此当鼠标悬停在椭圆上时,椭圆会改变颜色。
如果我在椭圆上放置触发器,则颜色会发生变化,但当鼠标移到视图框中的图形上时,颜色会变回来,因为视图框不是椭圆的子级。
根据我所读到的内容,应该可以通过父元素上的触发器来设置子元素的属性。但是,我无法让它发挥作用。我的代码如下所示:
<Viewbox Margin="5" >
<Viewbox.Resources>
<SolidColorBrush x:Key="HotColor" Color="Blue"/>
<SolidColorBrush x:Key="ColdColor" Color="Red"/>
<Style TargetType="Canvas" x:Key="BackgroundStyle">
<Setter Property="Ellipse.Fill" Value="{StaticResource ColdColor}"/>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Ellipse.Fill" Value="{StaticResource HotColor}"/>
</Trigger>
</Style.Triggers>
</Style>
</Viewbox.Resources>
<Canvas Width="44.000" Height="44.000" Style="{StaticResource BackgroundStyle}">
<Ellipse Width="44" Height="44"/>
<Viewbox Name="ButtonGraphics"/>
</Canvas>
</Viewbox>
结果是我的椭圆上根本没有颜色。有趣的是,如果我尝试设置 Ellipse.Opacity,它会起作用,但会影响椭圆和图形!所以看起来它被应用于画布,而不是椭圆?
I have a user cotrol which consists of a canvas that contains an ellipse and a viewbox. The ellipse is the background, and the viewbox is filled at runtime with graphics loaded from another assembly. I'm having problems creating a "hot" behavior for my control, so that the ellipse changes color when the mouse is over it.
If I put a trigger on the ellipse then the color changes, but it changes back when the mouse moves over the graphics in the viewbox because the viewbox is not a child of the ellipse.
From what I've read, it should be possible to set properties on child elments from a trigger on the parent element. However, I can't get this to work. My code looks like this:
<Viewbox Margin="5" >
<Viewbox.Resources>
<SolidColorBrush x:Key="HotColor" Color="Blue"/>
<SolidColorBrush x:Key="ColdColor" Color="Red"/>
<Style TargetType="Canvas" x:Key="BackgroundStyle">
<Setter Property="Ellipse.Fill" Value="{StaticResource ColdColor}"/>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Ellipse.Fill" Value="{StaticResource HotColor}"/>
</Trigger>
</Style.Triggers>
</Style>
</Viewbox.Resources>
<Canvas Width="44.000" Height="44.000" Style="{StaticResource BackgroundStyle}">
<Ellipse Width="44" Height="44"/>
<Viewbox Name="ButtonGraphics"/>
</Canvas>
</Viewbox>
The result is that I get no color on my ellipse at all. Funny enough, if I try setting Ellipse.Opacity in stead, it works but affects both the ellipse and the graphics! So it looks like it is being applied to the canvas, and not the ellipse?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
当您将 Setter 与 ClassName.PropertyName 属性一起使用时,您并未在所有 ClassName 对象上设置 PropertyName。相反,您在样式对象类型(在您的例子中为 Canvas)上设置 ClassName.PropertyName。提供 ClassName.PropertyName 只是该属性的类限定路径。对于不透明度,Canvas.Opacity == Ellipse.Opacity == UIElement.Opacity。
现在,为了实现您想要的目的,在 ButtonGraphics ViewBox 上设置
IsHitTestVisible=False
将阻止图形拦截鼠标事件。When you use a Setter with a ClassName.PropertyName property, you aren't setting PropertyName on all ClassName objects. Instead, you are setting ClassName.PropertyName on the styled object type (in your case Canvas). Giving a ClassName.PropertyName is just a class qualified path to that property. For Opacity, Canvas.Opacity == Ellipse.Opacity == UIElement.Opacity.
Now, in order to accomplish what you want, setting
IsHitTestVisible=False
on the ButtonGraphics ViewBox will prevent the graphics from intercepting mouse events.只在 ViewBox 上设置
IsHitTestVisible=False
怎么样?这会将其从命中测试中完全删除,并且鼠标事件将注册到您的 Ellipse。What about just setting
IsHitTestVisible=False
on your ViewBox? This would remove it from hit-testing altogether and mouse events would register to your Ellipse.