Question

我在Ellipse的中心画了Canvas。这样做时Ellipse的左上角实际上是在中心绘制的，但我希望Ellipse的中心点位于中心。为此，我认为我需要RenderTransform，但我无法使其正常工作。

<Ellipse Stroke="Red" RenderTransformOrigin="0.5,0.5" StrokeThickness="5" HorizontalAlignment="Center" VerticalAlignment="Center" Width="100" Height="100">

我错过了一个属性吗？

Answer 1

基本上你不能通过附加属性来做到这一点，除非你通过知道确切中心的viewModel绑定。您将需要使用后面的代码来找出画布的中心。像：

myCanvas.SetLeft(elipse, (myCanvas.ActualWidth - elipse.ActualWidth) / 2);
myCanvas.SetTop(elipse, (myCanvas.ActualHeight - elipse.ActualHeight) / 2);

Answer 2

您可以使用转换器获得所需的结果：

<强>的Xaml：

<Window.Resources>
    <wpfApplication1:GetCentreConverter x:Key="CentreConverter"/>
</Window.Resources>
<Canvas x:Name="canvas">
    <Ellipse Stroke="Red"
             RenderTransformOrigin="0.5,0.5"
             StrokeThickness="5"
             Width="100"
             Height="100"
             Canvas.Left="{Binding ElementName=canvas, Path=ActualWidth, Converter={StaticResource CentreConverter}, ConverterParameter=50}"
             Canvas.Top="{Binding ElementName=canvas, Path=ActualHeight, Converter={StaticResource CentreConverter}, ConverterParameter=50}"/>
</Canvas>

<强>转换器：

public class GetCentreConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        var width = double.Parse(value.ToString());
        var offset = double.Parse(parameter.ToString());

        return width/2 - offset;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

Answer 3

您可以使用Grid代替Canvas作为椭圆的容器。所以用

HorizontalAlignment="Center" VerticalAlignment="Center"

您将获得位于Grid中心的椭圆。

Answer 4

如Vidas所述，您需要使用Canvas.Left和Canvas.Top附加属性。

除了在代码隐藏中执行此操作外，您还可以编写自定义转换器，以便在XAML中执行此操作。例如，如果您编写DivideByTwoConverter，则可以将附加属性绑定到“画布”的“宽度”和“高度”，并在绑定上使用转换器。

我确信还有其他一些技巧可以做同样的事情。

WPF RenderTransform

4 个答案: