如何在Xamarin Forms中将图像放在Grid中？

Question

我有Xamarin Forms项目，我正在尝试在xaml中创建此页面： Javadoc

我正在尝试使用此xaml创建它：

<StackLayout>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <Label Grid.Row="0" Grid.Column="0" Text="A" />
        <Label Grid.Row="1" Grid.Column="0" Text="B" />
        <Label Grid.Row="2" Grid.Column="0" Text="C" />
        <Label Grid.Row="3" Grid.Column="0" Text="D" />
        <Label Grid.Row="4" Grid.Column="0" Text="E" />
        <Label Grid.Row="5" Grid.Column="0" Text="F" />

        <Label Text="A2" Grid.Row="0" Grid.Column="1" />
        <Image Grid.Row="1" Grid.Column="1" Grid.RowSpan="4" Aspect="AspectFit" Source="{Binding ImagePath}" />
        <Label Text="B2" Grid.Row="5" Grid.Column="1" />
    </Grid>

    <Label Text="Details" />
    <StackLayout HorizontalOptions="FillAndExpand" Orientation="Horizontal" >
        <Label HorizontalOptions="FillAndExpand" Text="All" />
        <Label HorizontalOptions="FillAndExpand" Text="Scheduled" />
        <Label HorizontalOptions="FillAndExpand" Text="Unscheduled" />
    </StackLayout>
</StackLayout>

但它看起来像这样：

问题是“详情”标签前有间距。当我删除图像时它看起来很好：

如何将图像放置在网格内，使其看起来像第一张图像？

Answer 1

您应该在元素上加上背景色，以便更好地可视化其实际尺寸。之后，控制您的垂直选项。

此外，我建议您将所有内容放在一个较大的网格中，以便定义实际的网格和标签。