Bug 37890 - StackLayout HorizontalOptions="End" not working
Summary: StackLayout HorizontalOptions="End" not working
Status: RESOLVED FIXED
Alias: None
Product: Forms
Classification: Xamarin
Component: Forms ()
Version: 2.0.0
Hardware: PC Mac OS
: --- normal
Target Milestone: ---
Assignee: Bugzilla
URL:
Depends on:
Blocks:
 
Reported: 2016-01-22 06:07 UTC by david
Modified: 2017-05-24 20:29 UTC (History)
6 users (show)

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


Attachments
Example demonstrating the problem (169.37 KB, application/zip)
2016-01-22 06:07 UTC, david
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 FIXED

Description david 2016-01-22 06:07:22 UTC
Created attachment 14667 [details]
Example demonstrating the problem

I have a StackLayout in a ListView's ViewCell. The StackLayout encloses 3 items: a text label on the left, an image on the right, and a filler in between the two to act as padding:

<StackLayout
  HorizontalOptions="Fill"
  Orientation="Horizontal">
  <Label
    Text="{Binding CellText}"
    HorizontalOptions="Start"
    VerticalOptions="Center"
    FontAttributes="Bold" />
  <BoxView
    BackgroundColor="Fuchsia"
    HorizontalOptions="FillAndExpand" />
  <Image
    Source="{Binding CellImage}"
    HorizontalOptions="End" />
</StackLayout>


If the text in the label is one line or less, everything works as expected. The image is right-aligned, the text is left-aligned, and the filler expands to fill the gap between them.

However, if the text in the label expands to occupy more than one line, the BoxView filler reverts to its default width, with the result that the image is pulled away from the right hand edge.

To see this in action, run the enclosed demo project. Tap the "Show List1" button to show one-line text in each cell. "Show List2" replaces one line's text with long text to cause the Label to wrap over 2 lines. This prevents the image from lining up at the right hand edge as I believe it should.

For comparison, each cell also shows a Grid (Olive fill) to compare with the StackLayout (Fuchsia fill).
Comment 1 Jimmy [MSFT] 2017-05-24 20:29:07 UTC
I tested the attached project with Xamarin.Forms 2.3.4.247 and I can no longer reproduce this issue. When the Label in the cell is wrapped, the Image now remains right aligned on both iOS and Android.