通过知道它是哪个(按声明顺序)子元素来计算 xaml 网格/画布中的位置

Question

假设我希望画布中的每个按钮都比第一个按钮低 +25px。

我需要得到

y-coordinate = "starting y" + ( 25px * self.which nth child element am I)

当我不想使用堆栈面板等时，这是最好/正确的方法吗？

澄清一下：我试图实现的是让某个元素中的按钮根据第一个元素的位置以及它们自己对第一个元素的第 n 个元素动态计算它们应该相对的位置。

如何在 xaml 中执行此操作？

澄清：知道如何实际获得前一个兄弟姐妹的 y 坐标或位置是我所问的关键。

Answer 1

使用IMultiValueConverter。

<Canvas Name="parent">
        <Button Name="first" Width="10" Height="10" 
                Canvas.Top="30"/>
        <Button Width="10" Height="10">
            <Canvas.Top>
                <MultiBinding Converter="{StaticResource CanvasConverter}" ConverterParameter="top">
                    <Binding ElementName="parent"></Binding>
                    <Binding ElementName="first"></Binding>
                    <Binding RelativeSource="{RelativeSource Mode=Self}"></Binding>
                </MultiBinding>
            </Canvas.Top>
        </Button>
        <Button Width="10" Height="10">
            <Canvas.Top>
                <MultiBinding Converter="{StaticResource CanvasConverter}" ConverterParameter="top">
                    <Binding ElementName="parent"></Binding>
                    <Binding ElementName="first"></Binding>
                    <Binding RelativeSource="{RelativeSource Mode=Self}"></Binding>
                </MultiBinding>
            </Canvas.Top>
        </Button>
</Canvas>

跟：

public class CanvasConverter : IMultiValueConverter
{
    public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture)
    {
        Canvas can = values[0] as Canvas;
        Button btn = values[1] as Button;
        Button btn0 = values[2] as Button;
        if (parameter.Equals("top"))
            return Canvas.GetTop(btn) + can.Children.IndexOf(btn0) * 25;
        else if (parameter.Equals("left"))
            return Canvas.GetLeft(btn) + 0;
        return null;
    } 
    public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    } 
}

不要忘记资源部分：

 <local:CanvasConverter x:Key="CanvasConverter" />

Answer 2

知道如何实际获得前一个兄弟姐妹的 y 坐标或位置是我所问的关键。

Canvas面板具有其子UIElements的Children集合。可以使用 IndexOf 方法获取此集合中特定元素的位置。

获取和设置此类元素的坐标只需调用 Canvas.Get* 和 Canvas.Set* 方法即可。

以下示例代码应该会告诉您：

Button button = new Button { Content = "..." };
canvas.Children.Add(button);
int buttonIndex = canvas.Children.IndexOf(button);
int previousElementIndex = buttonIndex - 1;
if(previousElementIndex > -1)
{
    //get the coordinates of the previous element
    UIElement previousElement = canvas.Children[previousElementIndex];
    double x = Canvas.GetLeft(previousElement);
    double y = Canvas.GetTop(previousElement);
    //set the coordinates of the button
    Canvas.SetTop(button, y + 25);
    Canvas.SetLeft(button, x + 25);
}

如何在 xaml 中执行此操作？

XAML 是一种标记语言。使用编程语言(如 C#(实现逻辑。