Bug 58252 - Multiple lines label Measure is wrong in relative layout
Summary: Multiple lines label Measure is wrong in relative layout
Status: RESOLVED ANSWERED
Alias: None
Product: Forms
Classification: Xamarin
Component: Forms ()
Version: 2.3.5
Hardware: PC Windows
: --- normal
Target Milestone: ---
Assignee: Jimmy [MSFT]
URL:
Depends on:
Blocks:
 
Reported: 2017-07-19 16:47 UTC by Yuri
Modified: 2018-03-16 10:29 UTC (History)
4 users (show)

Tags:
Is this bug a regression?: ---
Last known good build:


Attachments
Labels in RelativeLayout (41.74 KB, application/zip)
2018-03-16 10:28 UTC, Joas
Details
Screenshot iPhone 8 sim (184.16 KB, image/png)
2018-03-16 10:29 UTC, Joas
Details


Notice (2018-05-24): bugzilla.xamarin.com is now in read-only mode.

Please join us on Visual Studio Developer Community and in the Xamarin and Mono organizations on GitHub to continue tracking issues. Bugzilla will remain available for reference in read-only mode. We will continue to work on open Bugzilla bugs, copy them to the new locations as needed for follow-up, and add the new items under Related Links.

Our sincere thanks to everyone who has contributed on this bug tracker over the years. Thanks also for your understanding as we make these adjustments and improvements for the future.


Please create a new report on Developer Community or GitHub with your current version information, steps to reproduce, and relevant error messages or log files if you are hitting an issue that looks similar to this resolved bug and you do not yet see a matching new report.

Related Links:
Status:
RESOLVED ANSWERED

Description Yuri 2017-07-19 16:47:40 UTC
If label is more than the parent/screen width the label length is measured without considering number of lines.

Example:
The label with text "If you have a corporate notebook, look for the Cisco AnyConnect application. Either in your start menu, on your desktop, or in your taskbar."  It takes actually 3 lines in portrait mode on my device. 
To put the label in center the relative layout XConstraint is calculated like below:

relLayout.Children.Add(l3,
                Constraint.RelativeToParent((parent) =>
                {
                        return parent.Bounds.Center.X - l3.Measure(double.PositiveInfinity, double.PositiveInfinity).Request.Width / 2;
                }) 
                );

The value of "l3.Measure(double.PositiveInfinity, double.PositiveInfinity).Request.Width" returned about 800 while my screen size is only 400. 
This works correctly if label fits the screen but when it has to be split on multiple lines the result is wrong.
UNLESS it is by design. Then the question is how to measure the label width on the screen in such case?
Comment 1 Jimmy [MSFT] 2017-07-20 17:42:03 UTC
> l3.Measure(double.PositiveInfinity, double.PositiveInfinity).Request.Width

This is actually working as expected because you saying that the width can be infinite. You need to pass in a width constraint, in this case the width of the parent, in order for it to fit within the screen. 

You'll also need to give the Label a fixed width if you want to center it with padding on the sides in order to have it correctly measure its new bounds. Check out this Gist for an example: https://gist.github.com/jimmgarrido/2e7d8b647eb6877dba3427da17d7912d

Hope this helps!
Comment 2 Yuri 2017-07-20 20:08:07 UTC
Not really answered because this is not going to work. With your code X will be always 0 because parent.Bounds.Center.X is equal (parent.Bounds.Width / 2) which is the same as (width / 2)

Example:
var width = parent.Bounds.Width; // equal 400
testLabel.WidthRequest = width; //Set Label width to 400
var final = parent.Bounds.Center.X - (width / 2); //set X of the label always will be 0. 

But you gave me an idea. If I use measure like below limiting the width constraint I will always get correct result. It will be parent's width in case the level is wide and small correct width in other case.

var lw = l2.Measure(parent.Width, double.PositiveInfinity).Request.Width;

Thank you.
Comment 3 Joas 2018-03-16 10:28:20 UTC
Created attachment 26215 [details]
Labels in RelativeLayout

I'm still having a problem with this.

I have attached a demo project where I placed different Labels in a RelativeLayout. All of the Labels have a WidthConstraint relative to the Parent. But still some of the Labels don't display correctly.

It seems that it goes wrong when the WidhtConstraint has a constant value in it (the -40).
Comment 4 Joas 2018-03-16 10:29:47 UTC
Created attachment 26216 [details]
Screenshot iPhone 8 sim

Screenshot showing how it looks on a iPhone 8 (simulator).