Xamarin.FormsXamarin Relative Layout


Remarks

The usage of ForceLayout in this case

Label's and button's size change according to the text inside of them. Therefore when the children are added to layout, their size remains 0 in both width and height. For example:

relativeLayout.Children.Add(label,
    Constraint.RelativeToParent(parent => label.Width));

Above expression will return 0 because width is 0 at the moment. In order to work around this, we need to listen for SizeChanged event and when the size changes we should force the layout in order to redraw it.

label.SizeChanged += (s, e) => relativeLayout.ForceLayout();

For a view like BoxView this is unnecessary. Because we can define their sizes on instantiation. The other things is, in both cases we can define their width and height as a constraint when we are adding them to the layout. For example:

relativeLayout.Children.Add(label,
    Constraint.Constant(0),
    Constraint.Constant(0),
    //Width constraint
    Constraint.Constant(30),
    //Height constraint
    Constraint.Constant(40));

This will add the label to the point 0, 0. The label's width and height will be 30 and 40. However, if the text is too long, some of it might not show. If your label has or might have high height, you can use LineBreakMode property of label. Which can wrap the text. There are a lot of options in LineBreakMode enum.