title: Placing button over ListView expands beyond page
body: <p>I have Xamarin Forms project. In xaml, I would like to have ListView and over it a button that will be clickable and transparent (Opacity=0.9). There is one label above ListView and one label below it. I used RelativeLayout to place ListView and transparent button and wrapped it inside StackLayout with two labels. Problem is ListView expands beyond page.</p>
  
  <p>Here is my code for xaml file:</p>
  
  <pre><code>&lt;StackLayout VerticalOptions="FillAndExpand" BackgroundColor="#4d4d4d" HorizontalOptions="FillAndExpand"&gt;
    &lt;Label Text="2600 Michelson" HorizontalOptions="Center" /&gt;
    &lt;RelativeLayout VerticalOptions="FillAndExpand"&gt;
      &lt;ListView ItemsSource ="{Binding Meters}" HasUnevenRows="True" 
        RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width}"
        RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height}" &gt;
      ...
      &lt;/ListView&gt;
      &lt;Button Text="Green button" BackgroundColor="#299164" Opacity="0.9"
          RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.5, Constant=-50}"
          RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1, Constant=-100}"&gt;
      &lt;/Button&gt;
    &lt;/RelativeLayout&gt;
    &lt;Label Text="This label is not visible" TextColor="#0000ff"&gt;&lt;/Label&gt;
  &lt;StackLayout&gt;
  </code></pre>
  
  <p>Here is a screenshot:</p>
  
  <p><a href="https://i.stack.imgur.com/269y3.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/269y3.png" alt="enter image description here"></a></p>
  
  <p>I am still far from end design, but this is how it should look like:</p>
  
  <p><a href="https://i.stack.imgur.com/JjygF.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/JjygF.png" alt="enter image description here"></a></p>