StackLayout not obeying VerticalOptions property in Xamarin.Forms

Question

I am trying to create a simple stacklayout UI. Here is the XAML.

    <ContentView>
        <StackLayout
            BackgroundColor="Green"
            HeightRequest="500"
            VerticalOptions="End">
            <StackLayout
                BackgroundColor="LightSkyBlue"
                HeightRequest="100"
                VerticalOptions="End">
                <!--  // ADD CONTROLS HERE[!  -->
            </StackLayout>
        </StackLayout>
    </ContentView>

Ideally it is expected that the 'blue' stacklayout should align itself at the bottom on the green one But, it just doesn't moves and stays on the top.

What am i doing wrong? Please point me in the right direction

Attaching the image for better clarity.

Answer 1

You just need to replace your code by below code:

<StackLayout
        BackgroundColor="Green"
        HeightRequest="500"
        VerticalOptions="End">
        <StackLayout
            BackgroundColor="LightSkyBlue"
            HeightRequest="100"
            VerticalOptions="EndAndExpand">
            <!--  // ADD CONTROLS HERE[!  -->
        </StackLayout>
    </StackLayout>

Hope it will help you

Thank you