Xamarin Forms Image控件分配的高度超过请求的高度

Question

我正在为我的HeightRequest元素设置明确的16 Image;然而，在调试时，实际的Height似乎已跳到70。这是我的Xaml：

<Grid Margin="1" Padding="0" ColumnSpacing="0" RowSpacing="0" HeightRequest="17">
    <BoxView CornerRadius="3" Color="LightGray"/>
    <BoxView Margin="1" CornerRadius="3" BackgroundColor="White"/>
    <StackLayout Margin="2,0,2,0" Orientation="Horizontal" HeightRequest="17" Spacing="0">
        <Image Source="hooray_icon"
               WidthRequest="16"
               HeightRequest="16"
               Margin="1,0,1,0"
               Aspect="Fill"/>
        <Label Text="{Binding HoorayCount}"
               Margin="1,0,1,0"
               VerticalOptions="Center"
               VerticalTextAlignment="Center"
               HorizontalOptions="Center"
               HorizontalTextAlignment="Center"
               HeightRequest="16"/>
    </StackLayout>
</Grid>

预期设计：

实际设计：

hooray_icon是一个512x512的PNG图像。

Xamarin.Forms版本：3.6.0.293080

P.S我知道通过使用Image并覆盖和调试class CustomImage : Image和OnMeasure方法导致问题的OnSizeAllocated元素。如果我弄错了，请纠正我。

Answer 1

回答

HeightRequest不保证，这只是一个请求。如果Xamarin.Forms能够满足请求，它将实现它，但根据屏幕大小和布局，它可能无法满足请求。

解

设置Grid.ColumnDefinition's Width and the Grid.RowDefinition's Height的值。

码

<Grid Margin="1" Padding="0" ColumnSpacing="0" RowSpacing="0">
  <Grid.RowDefinitions>
    <RowDefinition Height="17" />
  </Grid.RowDefinitions>
  <Grid.ColumnDefinitions>
    <ColumnDefinition Width="17" />
    <ColumnDefinition Width="17" />
    <ColumnDefinition Width="17" />
  </Grid.ColumnDefinitions>
    <BoxView CornerRadius="3" Color="LightGray" Grid.Row="0" Grid.Column="0"/>
    <BoxView Margin="1" CornerRadius="3" BackgroundColor="White" Grid.Row="0" Grid.Column="1"/>
    <StackLayout Margin="2,0,2,0" Orientation="Horizontal" Spacing="0" Grid.Row="0" Grid.Column="2">
        <Image Source="hooray_icon"
               Margin="1,0,1,0"
               Aspect="Fill"
               HeightRequest="16"/>
        <Label Text="{Binding HoorayCount}"
               Margin="1,0,1,0"
               VerticalOptions="Center"
               VerticalTextAlignment="Center"
               HorizontalOptions="Center"
               HorizontalTextAlignment="Center"
               HeightRequest="16"/>
    </StackLayout>
</Grid>