Stick Layout in Xamarin Forms to bottom

c# layout xamarin.forms absolutelayout
Huub S picture Huub S · Dec 30, 2014 · Viewed 45.6k times · Source

I'm making an application in Xamarin forms but I have some trouble sticking a layout to the bottom of the device. I thought an AbsoluteLayout would work, but I cannot grasp how it works. So I made a RelativeLayout which I filled with the elements I wanted to fill but now I cannot seem to get it working on sticking to the bottom of the device at all time.

Below is a screenshot to make things hopefully a little bit more clear. I have a stacklayout which I fill with the headerlayout and the contentlayout. But if I just add the footerlayout to the stacklayout, it will not be sticked to the bottom of the page but (logically) just behind the previous child. Now I think an Absolutelayout would do the trick, but I cannot seem to grasp the functionality and the Layoutflags and bounds of it. Could someone help me out?

My application

Answer

Sergey Metlov picture Sergey Metlov · May 9, 2015 
<StackLayout>
  <StackLayout Orientation="Horizontal" VerticalOptions="Start">
    <!-- top controls -->
  </StackLayout>

  <StackLayout VerticalOptions="CenterAndExpand">
    <!-- middle controls -->
  </StackLayout>

  <StackLayout Orientation="Horizontal" VerticalOptions="End">
    <!-- bottom controls -->
  </StackLayout>
</StackLayout>

Make sure to have no more than one child with Expand options for best performance.

Related questions

What is the difference between Xamarin.Form's LayoutOptions, especially Fill and Expand?

In Xamarin.Forms every View has the two properties HorizontalOptions and VerticalOptions. Both are of type LayoutOptions and can have one of the following values: LayoutOptions.Start LayoutOptions.Center LayoutOptions.End LayoutOptions.Fill LayoutOptions.StartAndExpand LayoutOptions.CenterAndExpand LayoutOptions.EndAndExpand LayoutOptions.…

Read More
How do overlap in Xamarin forms?

Does the concept of z-index? The picture shows that there is no overlap. How to set z-index? the top two custom select box <AbsoluteLayout Padding="10,10,10,10" VerticalOptions="FillAndExpand"> <ui:BoxSelector x:Name="selectorExchangs" AbsoluteLayout.LayoutBounds="0,0,0.5,0.3" AbsoluteLayout.LayoutFlags="All" …

Read More
Automatically resize TableLayoutPanel row when window is resized

I have a simple 1x3 TableLayoutPanel. I want to achieve a very simple thing: When the window is resized, resize the middle row and keep top and bottom ones the same. I tried doing the logical thing, which is setting …

Read More