2014-12-03 108 views
4

我想要一張圖片以獲取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> 

我嘗試了不同的垂直和Horizo​​ntalOptions實現這一點,但是第二按鈕總是壓出的視圖。使用特定的高度也不是最好的解決方案。

這似乎是可能的相對佈局,但是這意味着,我不能不這是不是如果我針對不同的設備(如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> 

我該如何正確地做到這一點?

+0

網格將做到這一點。問題是stacklayout沒有適合的寬度 – Ewan 2016-05-06 15:00:58

回答

5

我認爲你正在尋找的是一個網格。

<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>