让图片仅占用剩余空间

我想要一张图片以获取StackLayout中的剩余空间，但不知何故，这在XAML中似乎是不可能的。图片始终尝试以最大尺寸显示自己。让图片仅占用剩余空间

<StackLayout> 
    <Image Source="{Binding ProfileImage}" Aspect="AspectFit" HorizontalOptions="Center" VerticalOptions="Start" /> 
    <StackLayout Orientation="Vertical" HorizontalOptions="Fill" VerticalOptions="EndAndExpand"> 
    <Button HorizontalOptions="FillAndExpand" VerticalOptions="End" x:Name="_ButtonShare" Text="Share" /> 
    <Button HorizontalOptions="FillAndExpand" VerticalOptions="End" x:Name="_ButtonExternalLinks" Text="External links"/> 
    </StackLayout> 
</StackLayout>

我尝试了不同的垂直和HorizontalOptions实现这一点，但是第二按钮总是压出的视图。使用特定的高度也不是最好的解决方案。

这似乎是可能的相对布局，但是这意味着，我不能不这是不是如果我针对不同的设备（如iPhone4S的iPhone5的和）一个好主意的相对值。

<RelativeLayout> 
    <Image Source="{Binding ProfileImage}" Aspect="AspectFit" 
     RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}" 
     RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.7}"/> 
    <StackLayout Orientation="Vertical" 
     RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.8}" 
     RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}" 
     RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.2}"> 
    <Button HorizontalOptions="FillAndExpand" VerticalOptions="End" x:Name="_ButtonShare" Text="Share" /> 
    <Button HorizontalOptions="FillAndExpand" VerticalOptions="End" x:Name="_ButtonExternalLinks" Text="External links"/> 
    </StackLayout> 
</RelativeLayout>

我该如何正确地做到这一点？

来源

2014-12-03 Felix K.

网格将做到这一点。问题是stacklayout没有适合的宽度 – Ewan 2016-05-06 15:00:58

我认为你正在寻找的是一个网格。

<Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="1*"/> 
      <ColumnDefinition Width="1*"/> 
     </Grid.ColumnDefinitions> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="*"/> 
      <RowDefinition Height="auto"/> 
     </Grid.RowDefinitions> 
     <Image Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2" Source="{Binding ProfileImage}" Aspect="AspectFit" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" /> 
     <Button Grid.Row="1" Grid.Column="0" HorizontalOptions="FillAndExpand" VerticalOptions="End" x:Name="_ButtonShare" Text="Share" /> 
     <Button Grid.Row="1" Grid.Column="1" HorizontalOptions="FillAndExpand" VerticalOptions="End" x:Name="_ButtonExternalLinks" Text="External links"/> 
    </Grid>

来源

2014-12-08 07:31:34 RoelV

让图片仅占用剩余空间

回答

相关问题