Positioning a RelativeLayout in a Grid

RaphaelSchindlerRaphaelSchindler USMember ✭✭✭
edited June 2015 in Xamarin.Forms

Hey Guys,
I'm really struggling with this right now. As you guys can see in the screenshot, I can't place a RelativeLayout correctly.
Even though the Width and Height of the RelativeLayout is correct and it takes the RowSpan from the Grid it doesn't positioning itself correctly in the Grid. It looks like the RelativeLayout is positioned UNDER the rest of the Layout I'm using the PopupLayout from XLabs and add the RelativeLayout as the Child to it. And it makes no difference when i add the mainFrame to mainLayout.

I'm really not sure what I'm doing wrong on this, maybe someone finds my error.

Here's the code:

var mainFrame = new Frame
{
    HasShadow = true,
    BackgroundColor = Color.FromRgb(212, 212, 212),
    VerticalOptions = LayoutOptions.FillAndExpand,
    HorizontalOptions = LayoutOptions.FillAndExpand
};

_mainStack = new StackLayout
{
    Padding = 10,
    BackgroundColor = Color.FromRgb(230, 230, 230)
};
   _dataViewModel.ButtonGrid = new ButtonGrid().CreateButtonGrid(_dataViewModel);
   _dataViewModel.NavigateForward.Clicked += (sender, args) =>
   {
       HandleForwardNavigation();
   };

   _dataViewModel.NavigateBack.Clicked += (sender, args) =>
   {
       HandleBackNavigation();
   };

   _dataViewModel.SelectMethodStack = new SelectMethodStack(_dataViewModel, _mainStack);
   _dataViewModel.AgeStack = new AgeStack(_dataViewModel);
   _dataViewModel.PensionsStack = new PensionStack(_dataViewModel);
   _dataViewModel.InputValuesStack = new InputStack(_dataViewModel);
   _dataViewModel.AdditionalInputStack = new AdditionalInputStack(_dataViewModel);
   _dataViewModel.YieldAndInflationStack = new YieldAndInflationStack(_dataViewModel);
   _dataViewModel.GoalSeekStack = new GoalSeekStack(_dataViewModel);
   _dataViewModel.GoalSeekResultStack = new GoalSeekResultStack();
   _dataViewModel.DataInputResultStack = new DataResultStack();

   _mainStack.Children.Add(_dataViewModel.SelectMethodStack);

   mainFrame.Content = _mainStack;

   var mainLayout = new RelativeLayout();

   switch (Device.Idiom)
   {
       case TargetIdiom.Phone:
           //not interesting in this case :)
           break;
       case TargetIdiom.Tablet:
           var grid = new Grid
           {
               ColumnDefinitions =
               {
                   new ColumnDefinition {Width = new GridLength(100, GridUnitType.Absolute)},
                   new ColumnDefinition {Width = new GridLength(1, GridUnitType.Star)},
                   new ColumnDefinition {Width = new GridLength(2, GridUnitType.Star)}
               },
               RowDefinitions =
               {
                   new RowDefinition {Height = new GridLength(1, GridUnitType.Star)},
                   new RowDefinition {Height = new GridLength(1, GridUnitType.Star)}
               }
           };

    _mainPopupLayout = new PopupLayout { Content = mainLayout };

   var menu = CreateMenuPage();
   grid.Children.Add(menu, 0, 0);
   Grid.SetRowSpan(menu, 2);
   grid.Children.Add(_mainPopupLayout, 1, 0);
   Grid.SetRowSpan(_mainPopupLayout, 2);
   grid.Children.Add(ListedView.GetListedView(), 2, 1);
   grid.Children.Add(GraphicsView.GetGraphicView(), 2, 0);

   Content = grid;

   mainLayout.Children.Add(
       mainFrame,
       Constraint.Constant(0),
       Constraint.Constant(5),
       Constraint.RelativeToParent(parent => parent.Width),
       Constraint.RelativeToParent(parent => parent.Height - 10)
       );

   break;
}
Sign In or Register to comment.