更改控制画布中的零点

时间:2015-02-12 14:24:07

标签: wpf xaml canvas

当我在画布中绘制项目时,位置取自画布内项目的顶部:

<Canvas Name="cnvMain"
        Width="80"
        Height="80">
  <Ellipse Canvas.Top="20"
           Canvas.Left="40"
           Width="40"
           Height="40"
           Fill="Gray" />
</Canvas>

enter image description here

现在我需要的是从元素的底部进行测量,如下所示:

enter image description here

最后,我希望能够设置从椭圆底部到画布顶部的距离。 注意:椭圆有时可能不是一个圆圈,倒置它不是一个选项。另外我不知道运行前的高度,因此在xaml中设置负边距也不会起作用。

(图片和示例xaml取自:http://weblogs.asp.net/psheriff/centering-text-within-a-wpf-shape-using-a-canvas

1 个答案:

答案 0 :(得分:2)

如果要指定椭圆底部到“画布”底部的距离,可以将Canvas.Top替换为Canvas.Bottom

<Ellipse Canvas.Bottom="20" Canvas.Left="40" Width="40" Height="40" Fill="Gray"/>

对于从椭圆底部到画布顶部的距离,您可以指定负边距:

<Ellipse Canvas.Top="20" Canvas.Left="40" Width="40" Height="40" Fill="Gray"
         Margin="0,-40,0,0"/>

或适当的RenderTransform:

<Ellipse Canvas.Top="20" Canvas.Left="40" Width="40" Height="40" Fill="Gray">
    <Ellipse.RenderTransform>
        <ScaleTransform ScaleY="-1"/>
    </Ellipse.RenderTransform>
</Ellipse>

为了反转整个Canvas坐标系的y方向,您可以将RenderTransform应用于Canvas:

<Canvas ... RenderTransformOrigin="0,0.5">
    <Canvas.RenderTransform>
        <ScaleTransform ScaleY="-1"></ScaleTransform>
    </Canvas.RenderTransform>
    ...
</Canvas>

编辑:您也可以将椭圆放在另一个零高度的画布中,并将其附加到下部画布边框:

<Canvas Canvas.Top="20" Canvas.Left="40" Width="0" Height="0">
    <Ellipse Canvas.Bottom="0" Width="40" Height="40" Fill="Gray"/>
</Canvas>