StackLayout is not viewable inside RelativeLayout - xaml

Question

I'm trying to add a floating action button to my page, to do so I wrapped my stack layout with a relative layout and add the FAB in the relative layout.
<ContentPage.Content>
<RelativeLayout BackgroundColor="Transparent">
<fab:FloatingActionButton
x:Name="fabBtn"
Source="plus.png"
Size="Normal"
Clicked="Handle_FabClicked"
NormalColor="Green"
RippleColor="Blue"
RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1, Constant=-75}"
RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1, Constant=-75}" />
<StackLayout
Spacing="10"
Padding="5"
VerticalOptions="FillAndExpand"
HorizontalOptions="FillAndExpand"
RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}">
<Label Text="Latest news/activities" FontSize="Medium" VerticalOptions="Start"/>
<ScrollView VerticalOptions="CenterAndExpand">
<ListView
x:Name="lsvActivities"
HasUnevenRows="True">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout Orientation="Horizontal" Padding="3">
<StackLayout Orientation="Vertical" HorizontalOptions="StartAndExpand">
<Label Text="{Binding title}" VerticalOptions="StartAndExpand"/>
<Label Text="{Binding date}" VerticalOptions="End"/>
</StackLayout>
<StackLayout HorizontalOptions="End" WidthRequest="100" HeightRequest="100" BackgroundColor="Blue">
<Label Text="image here"/>
</StackLayout>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</ScrollView>
<Label Text="Good Mording" FontSize="Large" VerticalOptions="End" HorizontalOptions="Center"/>
</StackLayout>
</RelativeLayout>
</ContentPage.Content>
But it locks like the StackLayout is out of the boundary of the layout or something.
What is problem? and how I can display both the FAB and the StackLayout, where the floating action button should always be on top of the StackLayout elements

Answer 1

Are you trying to have the StackLayout occupy the entire screen (with the button on top)? If so, this part isn't going to do that:
RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}">
That is placing the top left corner of the StackLayout at the bottom right of the screen.
Per the Xamarin docs:
Unlike AbsoluteLayout, RelativeLayout does not have the concept of the
moving anchor and does not have facilities for positioning elements
relative to the bottom or right edges of the layout.
In other words, AbsoluteLayout will try to adjust for you if you place something at the bottom right corner. RelativeLayout won't.
You probably want the constraints noted above on the StackLayout to be WidthConstraint and HeightConstraint, and set the XConstraint and YConstraint to 0.
And as Sven-Michael says, drop the ScrollView.
EDIT
The XAML should look like:
RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}"
RelativeLayout.XConstraint="{ConstraintExpression Type=Constant,Constant=0}"
RelativeLayout.YConstraint="{ConstraintExpression Type=Constant,Constant=0}"