Xamarin MasterDetailPage 用图像填充标题答案

【问题标题】：Xamarin MasterDetailPage fill header with imageXamarin MasterDetailPage 用图像填充标题
【发布时间】：2020-08-11 21:32:32
【问题描述】：

我在 Xamarin Forms 上遇到了这个问题： white empty space on listview

我想用背景图像填充那个空白区域（我已经尝试了verticaloptions和horizontaloptions = fillandexpand，但什么也没发生）

XAML 代码：

  <StackLayout>
<ListView x:Name="MenuItemsListView"
          SeparatorVisibility="None"
          HasUnevenRows="true"
          ItemsSource="{Binding MenuItems}">
  <ListView.Header>
    <Grid BackgroundColor="GhostWhite">
      <Grid.ColumnDefinitions>
        <ColumnDefinition Width="10"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="10"/>
      </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="30"/>
                    <RowDefinition Height="80"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="10"/>
                </Grid.RowDefinitions>

                <Image Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="3" Grid.RowSpan="3" x:Name="circlebg" Source="" VerticalOptions="CenterAndExpand" HorizontalOptions="CenterAndExpand"></Image>
        
                <Frame Grid.Column="1" Grid.Row="1" x:Name="circleFrame" HasShadow="False" Padding="0" Margin="0" VerticalOptions="Center" HorizontalOptions="Center" BackgroundColor="Black" BorderColor="White" CornerRadius="10" IsClippedToBounds="True">
                        <Image x:Name="circleImg" Source=""></Image>
                    </Frame>
                
                <Label
          x:Name="txtName"
          Grid.Column="1"
          Grid.Row="2"
          TextColor="White"
          Text=""
          HorizontalTextAlignment="Center"
          FontFamily="{StaticResource Montserrat-Medium}"
          Style="{DynamicResource SubtitleStyle}"/>
            </Grid>
  </ListView.Header>
  <ListView.ItemTemplate>
    <DataTemplate>
                <ViewCell>

                    <StackLayout Orientation = "Horizontal" Margin = "10" HorizontalOptions="FillAndExpand">
                            <Image Source = "{Binding Image}" HorizontalOptions="Start" >
                                <Image.HeightRequest>
                                    <OnPlatform x:TypeArguments="x:Double">
                                    <On Platform="Android,Windows">30</On>
                                    </OnPlatform>
                                </Image.HeightRequest>
                            </Image>
                        <Label Text = "{Binding Title}" 
                                   VerticalOptions="FillAndExpand" 
                 FontFamily="{StaticResource Montserrat-Medium}"
                VerticalTextAlignment="Center"
                FontSize="18"/>

                    </StackLayout>
      </ViewCell>
    </DataTemplate>
  </ListView.ItemTemplate>
</ListView>
</StackLayout>

有人知道我该如何解决这个问题吗？提前致谢

更新：测试 1 - 结果：result test 1

<Image Aspect="Fill" Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="3" Grid.RowSpan="3" x:Name="circlebg" Source="" VerticalOptions="CenterAndExpand" HorizontalOptions="CenterAndExpand"></Image>

测试 2 - 结果：result test 2

【问题讨论】：

你说的是Header还是ViewCell？
我认为是视单元。当我单击汉堡包图标，然后出现菜单。所有菜单都可以，但是我想放置照片和背景照片的地方，我有一个白色的空白区域。看：i.stack.imgur.com/VeFrJ.jpg
我会先删除边距
边距它是我的菜单列表的一部分（ImageIcon - PageName）。问题出在上方的和上方
这显然是标题。我只是问你是不是标题，你说不是。

标签： c# xaml xamarin xamarin.forms xamarin.android

【解决方案1】：

将Aspect="Fill" 设置为图像，它将填充空间。

<Image Aspect="Fill" Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="3" Grid.RowSpan="3" x:Name="circlebg" Source="Images"  VerticalOptions="CenterAndExpand" HorizontalOptions="CenterAndExpand"></Image>

更新：

        <Grid.RowDefinitions>
            <RowDefinition Height="30"/>
            <RowDefinition Height="80"/>
            <RowDefinition Height="100"/>
        </Grid.RowDefinitions>

【讨论】：

它在水平上工作，但在垂直上我仍然有一个空白。我会用新图片编辑我的帖子
这可能是第四行引起的。您在网格中定义了 4 行，而您只使用了 3 行。查看我更新的答案，它会为你工作。