How to set FlexLayout height automatically according to its children height

processorprocessor Member ✭✭
edited October 2018 in Xamarin.Forms

Hello,
I'm trying to create a FlexLayout without specifying its height as I am supposing it will get it from its children height. When I'm doing so, the FlexLayout is not displayed at all. Here is a simple code:

    
    
    
        

I tried everything but nothing works unless I specify HeightRequest or FlexLayout.Basis for the (inner) FlexLayout.
Any Suggestions will be appreciated.

Tagged:

Best Answer

  • processorprocessor ✭✭
    Accepted Answer

    If I changed the first FlexLayout to StackLayout as follows, it will work.

        
        
            

    This is so weird as I assume it should work without changing it to StackLayout.

Answers

  • BillyLiuBillyLiu Member, Xamarin Team Xamurai

    @processor

    Please set FlexLayout.Grow to your inside FlexLayout

    For example:

    <FlexLayout FlexLayout.Grow="1" JustifyContent="Start" AlignItems="Start" AlignContent="Start" BackgroundColor="Blue" Direction="RowReverse" Wrap="Wrap">
    

    Please check the following link:
    https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/layouts/flex-layout#page-layout-with-flexlayout

  • processorprocessor Member ✭✭
    edited October 2018

    @BillyLiu Unfortunately this will not set the height of FlexLayout to its content's height. This will set its height to occupy all the unused vertical space.

    In my example above, the height of FlexLayout should be 50 because the label's height is 50. But I don't know how to make this happen automatically. may be it's not possible with FlexLayout :s

  • processorprocessor Member ✭✭
    Accepted Answer

    If I changed the first FlexLayout to StackLayout as follows, it will work.

        
        
            

    This is so weird as I assume it should work without changing it to StackLayout.

Sign In or Register to comment.