多边形边界与具有 ScaleTransform 的画布上的视觉对象不匹配答案

【问题标题】：Polygon Boundary not matching visual on a Canvas with a ScaleTransform多边形边界与具有 ScaleTransform 的画布上的视觉对象不匹配
【发布时间】：2009-06-02 00:02:35
【问题描述】：

以下 XAML 只是画布上缩放 x2000 的多边形。当鼠标悬停在多边形上时，有一个触发器会改变多边形的填充颜色。

当您将鼠标悬停在多边形的上方和左侧时，为什么框会改变颜色。

<Canvas Background="Black" Height="600" Width="600">
    <Canvas.RenderTransform>
        <ScaleTransform ScaleX="2000" ScaleY="2000" />
    </Canvas.RenderTransform>
    <Polygon>
        <Polygon.Resources>
            <Style TargetType="Polygon">
                <Setter Property="Fill" Value="HotPink"/>
                <Style.Triggers>
                    <Trigger Property="IsMouseOver" Value="true">
                        <Setter Property="Fill" Value="LimeGreen"/>
                    </Trigger>
                </Style.Triggers>
            </Style>
        </Polygon.Resources>
        <Polygon.Points>
            <PointCollection>
                <Point X="0.1" Y="0.1" />
                <Point X="0.2" Y="0.1" />
                <Point X="0.2" Y="0.2" />
                <Point X="0.1" Y="0.2" />
            </PointCollection>
        </Polygon.Points>
    </Polygon>
</Canvas>

如果我将 Polygon 替换为 TextBlock，则不会发生这种情况。我怎样才能避免这种情况发生？

【问题讨论】：

标签： wpf

【解决方案1】：

在我看来，这就像 Microsoft 针对 Polygon 的命中测试代码中的一个错误。但是，我可以通过在原点绘制多边形然后使用 Canvas.Top 和 Canvas.Bottom 对其进行翻译来让它停止。希望这能解决您的问题。

<Canvas Background="Black" Height="600" Width="600">
    <Canvas.RenderTransform>
        <ScaleTransform ScaleX="2000" ScaleY="2000" />
    </Canvas.RenderTransform>
    <Polygon Canvas.Top="0.1" Canvas.Left="0.1">
        <Polygon.Resources>
            <Style TargetType="Polygon">
                <Setter Property="Fill" Value="HotPink"/>
                <Style.Triggers>
                    <Trigger Property="IsMouseOver" Value="true">
                        <Setter Property="Fill" Value="LimeGreen"/>
                    </Trigger>
                </Style.Triggers>
            </Style>
        </Polygon.Resources>
        <Polygon.Points>
            <PointCollection>
                <Point X="0.0" Y="0.0" />
                <Point X="0.1" Y="0.0" />
                <Point X="0.1" Y="0.1" />
                <Point X="0.0" Y="0.1" />
            </PointCollection>
        </Polygon.Points>
    </Polygon>
</Canvas>

【讨论】：

这不是错误 - 它是为形状设计的，没有布局行为
嗯...我不相信。以后可能会玩这个。
我也认为这是一个错误，因为不缩放命中测试就可以了。
这个解决方案（和 Tamir 的）的问题是在形状上设置 top 和 left 不适用于椭圆或非矩形多边形。
@Dylan：您可以使用 TranslateTransform 代替 Canvas.Left/Top。它也可以在任何其他形状（也非矩形）上以与 Canvas.Top/Left 相同的方式工作 @PeterAllenWebb：Shaps 没有布局，即使它在没有翻译的情况下工作正常，这并不意味着它不应该命中原始测试领域

【解决方案2】：

这是因为 Shape 元素（Polygon 对象派生自）布局。您的形状从 0,0 开始（而不是从 .1,.1 绘制）因此在左侧命中测试工作。要在 Canvas 上设置形状位置，您应该使用 Canvas.Left/Top 附加属性，因此您的代码看起来像这样并且行为正确

**<Polygon Canvas.Top=".1" Canvas.Left=".1">
<Polygon.Points> 
 <Point X="0" Y="0" /> 
 <Point X=".1" Y="0" />  
 <Point X=".1" Y=".1" /> 
 <Point X="0" Y=".1" />
</Polygon.Points>**

【讨论】：

这个解释对我来说并不完全合理。 Shape 类确实具有布局行为。此外，画布未转换，多边形坐标设置为 { (100,100), (200,100), (200,200), (100,200) }。命中测试按预期工作。为什么在比例变换下会有所不同？