wpf - 如何使边距相对于 UIElement 的中心而不是网格中的左上角？

Question

我希望该Margin属性引用中心UIElement而不是左上角。这样，当我更改它的宽度/高度时，UIElement它会保持在同一个位置。

有没有办法配置这种行为，或者我必须依靠 Binding 来进行调整？

谢谢。

例如，如果我更改Width/Height以下矩形的 ，它的中心会移动。

<Grid>
    <Rectangle Fill="#FF991C1C" Width="10" Height="40" HorizontalAlignment="Left" Margin="90,161,0,0" VerticalAlignment="Top"/>
</Grid>

Answer 1

为什么不删除边距并使用这些？

HorizontalAlignment="Center"
VerticalAlignment="Center"

Answer 2

由于一个模糊的原因，如果我希望边距相对于中心，我无法弄清楚矩形对齐应该是中心。这段代码使我的 Rectangle 表现得像我想要的那样。

<Grid>
    <Rectangle Fill="#FF991C1C" Width="10" Height="40" HorizontalAlignment="Center" Margin="90,161,0,0" VerticalAlignment="Center"/>
</Grid>

Answer 3

在某些情况下，当尝试基于元素的中心而不是边缘仅使用单个边距属性定位元素时，我发现此解决方案很有用：

/* Declare a CSS variable equal to your element's width. */

:root{
   --my-element-width: 40px;
}

/* Declare your margin as 50% minus half the element's width */

.myClass {
  margin-right: calc(50% - var(--my-element-width));
}

/* Apply this class to the element in question. */