2015-06-27 53 views
2

在一个RelativeLayout的内部我想在StackLayout的顶部显示一些元素,并在另一个StackLayout的屏幕底部显示一些元素。 (我使用相对的,因为我也有一个图像将重叠的顶部的一部分)如何设置底部StackLayout约束是关于父布局的底部?将堆栈对齐到RelativeLayout的底部?

这是我试过,但它不工作:

<RelativeLayout x:Name="Login" BackgroundColor="#f6f6f6"> 
    <StackLayout Orientation="Vertical" HorizontalOptions="FillAndExpand" BackgroundColor="White" 
     RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}" 
     RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Y, Constant=0}" 
    > 

     <Image Source="ACSBanner.png" VerticalOptions="Center" HorizontalOptions="Center" /> 
    </StackLayout> 

    <StackLayout Orientation="Vertical" HorizontalOptions="FillAndExpand" VerticalOptions="EndAndExpand"> 
     <Label Text="Sample Text For Bottom" FontSize="Large" TextColor="Black" FontAttributes="Bold"/> 
    </StackLayout> 

</RelativeLayout> 

回答

0

你需要做的是类似如下(我使用自己的代码隐藏,但是模式仍然适用):

// Create your layouts 
var layout = new RelativeLayout(); 
var topStack = new StackLayout(); 
var bottomStack = new StackLayout(); 

// Define your views 
var image = new Image 
{ 
    Source = "ACSBanner.png" 
}; 

var label = new Label 
{ 
    Text = "Sample text for bottm" 
}; 

// Add the View(s) to your StackLayout(s) 
topStack.Children.Add(image); 
bottomStack.Children.Add(label); 

// Add your top stack to the top of the view 
layout.Children.Add(topStack, 
widthConstraint: Constraint.RelativeToParent(parent => 
{ 
    return parent.Width; 
}), 
yConstraint: Constraint.RelativeToParent(parent => 
{ 
    return parent.Y; 
})); 

// Add your bottom stack to the bottom of the view 
layout.Children.Add(bottomStack, 
widthConstraint: Constraint.RelativeToParent(parent => 
{ 
    return parent.Width; 
}), 
yConstraint: Constraint.RelativeToParent(parent => 
{ 
    // Find the view of the parent and substracting the height of the View which is to be positioned in the bottom 

    return parent.Height - bottomStack.Height; 
})); 

Content = relativeLayout;