Clever Geek Handbook

Xamarin Forms relative layout won't stack

With the following code:

<ScrollView Orientation="Vertical" Padding="0">
            <RelativeLayout BackgroundColor="Red" Padding="0">
                <BoxView Color="Blue" WidthRequest="100" HeightRequest="100" 
                RelativeLayout.XConstraint="{ConstraintExpression Type=Constant, Constant=0}" 
                RelativeLayout.YConstraint="{ConstraintExpression Type=Constant, Constant=0}" />
            </RelativeLayout>
            <RelativeLayout BackgroundColor="Green" Padding="0">
                <BoxView Color="Yellow" WidthRequest="100" HeightRequest="100" 
                RelativeLayout.XConstraint="{ConstraintExpression Type=Constant, Constant=0}" 
                RelativeLayout.YConstraint="{ConstraintExpression Type=Constant, Constant=0}" />
            </RelativeLayout>
        </ScrollView>

But for some reason, instead of stacking, each new relative layout takes up the entire screen like this:

enter image description here

Why don't they stack vertically? Usually stack layouts only vertically or horizontally align the height of their children, but this does not happen with relative layouts. What am I missing?

+3


source to share


1 answer


Try this layout. I added StackLayout to ScrollView and VerticalOptions = "Start" for RelativeLayouts.



<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="TestChat.ChatPage">
    <ContentPage.Content>
<ScrollView Orientation="Vertical" Padding="0">
    <StackLayout>
            <RelativeLayout BackgroundColor="Red" Padding="0" VerticalOptions="Start">
                <BoxView Color="Blue" WidthRequest="100" HeightRequest="100" 
                RelativeLayout.XConstraint="{ConstraintExpression Type=Constant, Constant=0}" 
                RelativeLayout.YConstraint="{ConstraintExpression Type=Constant, Constant=0}" />
            </RelativeLayout>
            <RelativeLayout BackgroundColor="Green" Padding="0" VerticalOptions="Start">
                <BoxView Color="Yellow" WidthRequest="100" HeightRequest="100" 
                RelativeLayout.XConstraint="{ConstraintExpression Type=Constant, Constant=0}" 
                RelativeLayout.YConstraint="{ConstraintExpression Type=Constant, Constant=0}" />
            </RelativeLayout>
            </StackLayout>
        </ScrollView>
    </ContentPage.Content>
</ContentPage>
+6


source






More articles:


All Articles