设置X系数.5时RelativeLayout未将视图定位在中心水平线上

Question

我正在研究RelativeLayout，我有三个BoxView。 boxview3我想使用boxview2获得Type=RelativeToView。

boxview3的{​​{1}}我将XConstraint设置为.5仍显示在左上方，为什么？在boxview3之后如何获得boxview3？

boxview2

注意：如果将<RelativeLayout> <BoxView x:Name="boxview1" BackgroundColor="#b87333" RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width,Factor=.5 }" RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}"> </BoxView> <BoxView BackgroundColor="Red" x:Name="boxview2" RelativeLayout.HeightConstraint="{ConstraintExpression ElementName=boxview1, Type=RelativeToView,Property=Height,Factor=.1}" RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToView, ElementName=boxview1,Factor=1,Property=Width}" RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent,Property=Width, Factor=0.1,Constant=-10}" RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToView, ElementName=boxview1,Property=Height,Factor=.4}"> </BoxView> <BoxView BackgroundColor="Blue" x:Name="boxview3" RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToView, ElementName=boxview2, Property=Width,Factor=.5}"> </BoxView> </RelativeLayout> 设为XConstraint，我希望屏幕中间的.5是水平的。

输出屏幕截图：

Answer 1

简短的答案是，您无法在Xaml中指定要查找的X约束，必须使用C＃。 RelativeLayout中的所有元素都相对于整个RelativeLayout定位。

您现在拥有的Xaml指定boxview2的宽度为0.1 * RelativeLayout.Width-10，而boxview3的X坐标为其宽度的一半，因此它将位于左上角0.05 * RelativeLayout.width-5处，即是您所看到的。

对于Xaml中的RelativeLayout约束，您可以使用视图左上角X或Y的正好1个，或者其宽度或高度。要实现所需的功能，您需要boxview2（或boxview2.X + boxview2.Width）的右上角。您必须在后面的C＃代码中创建boxview3，例如：

reelativeLayout.Children.Add (boxview3, Constraint.RelativeToView (boxview2, (parent, view) => {
        return view.X + view.Width;
    }),
    …   // other constraints
    ));

根据您的需求，您可能会发现更容易使用其他容器。