WPF如何得到一個在使用者控制元件內部的元素的座標位置

Fixing發表於2018-05-03
控制元件

例如有這樣一個使用者控制元件：

<UserControl d:DesignHeight="100" d:DesignWidth="200" ...>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="100" />
            <ColumnDefinition Width="100" />
        </Grid.ColumnDefinitions>
        <Ellipse Name="leftEllipse" Grid.Column="0" Width="50" Height="50" HorizontalAlignment="Center" VerticalAlignment="Center" Fill="Red" />
        <Ellipse Name="rightEllipse" Grid.Column="1" Width="50" Height="50" HorizontalAlignment="Center" VerticalAlignment="Center" Fill="Green" />
    </Grid>
</UserControl>

這是主視窗：

<Window ...>
    <Canvas Name="canvas1">
        <my:MyUserControl x:Name="myUserControl1" Width="200" Height="100" Canvas.Top="100" Canvas.Left="100" />
    </Canvas>
</Window>

我們知道，可以通過下面的方法得到使用者控制元件本身的座標位置：

double x = Canvas.GetLeft(myUserControl1);

那麼如何得到使用者控制元件內部的元素的座標呢？要知道，當使用者控制元件本身應用了變換（如：RotateTransform），其內部元素的座標是會改變的。

解決這個問題有兩個方法：

//方法1：

在使用者控制元件中編寫方法：

public GeneralTransform LeftEllipseTransform(UIElement e)
{
    return leftEllipse.TransformToAncestor(e);
}

在主視窗中呼叫：

var p = myUserControl1.LeftEllipseTransform(canvas1).Transform(new Point());　　//得到左圓的左上角座標

//方法2：

在使用者控制元件中編寫方法：

public Point GetLeftEllipsePosition(Point p, UIElement e)
{
    return leftEllipse.TranslatePoint(p, e);
}

在主視窗中呼叫：

var p = myUserControl1.GetLeftEllipsePosition(new Point(), canvas1);　　//得到左圓的左上角座標

或者，如果要得到左圓的圓心位置的話，就這樣呼叫：

var p = myUserControl1.GetLeftEllipsePosition(new Point(25, 25), canvas1);　　//得到左圓的圓心座標

相關文章