如何强制 ListView 在同一行中显示来自 ObservableCollection 不同元素的两个不同数据

Question

在我的 xaml 文件中，我有一个 ListView ：

<ListView x:Name="MyListView" ItemsSource="{Binding MyData}" HasUnevenRows="true">
             <ListView.ItemTemplate>
                 <DataTemplate x:Name="dataTemplate">
                     <ViewCell>
                         <FramePadding="2" BorderColor="DarkSlateGray">
                             <Grid x:Name="grid" Padding="0">
                                 <Grid.ColumnDefinitions>
                                     <ColumnDefinition Width="1.6*"/>
                                     <ColumnDefinition Width="2.5*"/>
                                     <ColumnDefinition Width="2.5*"/>
                                     <ColumnDefinition Width="2.5*"/>
                                     <ColumnDefinition Width="2.5*"/>
                                     <ColumnDefinition Width="2.5*"/>
                                     <ColumnDefinition Width="2.5*"/>
                                 </Grid.ColumnDefinitions>
    
                                 <Label Grid.Column="0" VerticalTextAlignment="Center" >
                                     <Label.FormattedText>
                                         <FormattedString>
                                             <Span TextDecorations="Underline" TextColor="Black"  Text="{Binding dateName}"/>
                                             <Span Text="{x:Static system:Environment.NewLine}"/>
                                             <Span Text="{Binding date}"/>
                                         </FormattedString>
                                     </Label.FormattedText>
                                 </Label>
                                 <Label Grid.Column="{Binding gridNumber}" Grid.ColumnSpan="2" HorizontalTextAlignment="Center" BackgroundColor="{Binding BgColor}">
                                     <Label.FormattedText>
                                         <FormattedString>
                                             <Span TextColor="Black"  Text="{Binding Information}"/>
                                         </FormattedString>
                                     </Label.FormattedText>
                                 </Label>
    
                                 <BoxView BackgroundColor="DarkSlateGray" WidthRequest="3" Grid.Column="0" HorizontalOptions="EndAndExpand" VerticalOptions="FillAndExpand" />
                                 <BoxView IsVisible="{Binding IsSimpleSeance}" BackgroundColor="DarkSlateGray" WidthRequest="1" Grid.Column="{Binding gridNumber}" HorizontalOptions="EndAndExpand" VerticalOptions="FillAndExpand"/>
                                 <BoxView BackgroundColor="DarkSlateGray" WidthRequest="1" Grid.Column="2" HorizontalOptions="EndAndExpand" VerticalOptions="FillAndExpand"/>
                                 <BoxView BackgroundColor="DarkSlateGray" WidthRequest="1" Grid.Column="3" HorizontalOptions="EndAndExpand" />
                                 <BoxView BackgroundColor="DarkSlateGray" WidthRequest="1" Grid.Column="5" HorizontalOptions="EndAndExpand" VerticalOptions="FillAndExpand"/>
                                 <BoxView BackgroundColor="DarkSlateGray" WidthRequest="1" Grid.Column="6" HorizontalOptions="EndAndExpand" VerticalOptions="FillAndExpand"/>
                             </Grid>
                         </Frame>
                     </ViewCell>
                 </DataTemplate>
             </ListView.ItemTemplate>
         </ListView>

在我的 ViewModel 文件中，我有这个 ObservableCollection：

 lObservableCollectionist<MyObject> MyList = [
  {"Monday", "07/12", "Some Data in First Line", 1},
  { "Monday", "07/12", "Some Other Data ALSO in First Line",4},
  { "Tuesday", "08/12", "New Data in Second Line" ,1},
  { "Tuesday", "08/12", "New Other Data in Second Line",4 },
  { "Tuesday", "08/12", "Newest Data Also in Second Line",6 },
   ...
   ]

所以，问题是 ListView 像这样在新行中显示 ObservableCollection 的每个元素！ What I get 但我想要的是将同一天的数据分组在一行中。像这样的

What I want

Answer 1

您可以做的不是一个标签，而是添加多个标签并将每个标签与每一列映射并更改您的信息属性 并删除 gridNumber 属性

你的模型

public class MyObject
{
    ...
    public string InformationColumn1 { get; set; }
    public string InformationColumn2 { get; set; }
    public string InformationColumn3 { get; set; }
    public string InformationColumn4 { get; set; }
    ...

}

Xaml

...
<!-- Remove grid number binding and add label for each column-->
<Label Grid.Column="1" Grid.ColumnSpan="2" HorizontalTextAlignment="Center" BackgroundColor="{Binding BgColor}">
    <Label.FormattedText>
        <FormattedString>
            <Span TextColor="Black"  Text="{Binding InformationColumn1}"/>
        </FormattedString>
    </Label.FormattedText>
</Label>
<Label Grid.Column="2" HorizontalTextAlignment="Center" BackgroundColor="{Binding BgColor}">
    <Label.FormattedText>
        <FormattedString>
            <Span TextColor="Black"  Text="{Binding InformationColumn2}"/>
        </FormattedString>
    </Label.FormattedText>
</Label>
<Label Grid.Column="3" Grid.ColumnSpan="2" HorizontalTextAlignment="Center" BackgroundColor="{Binding BgColor}">
    <Label.FormattedText>
        <FormattedString>
            <Span TextColor="Black"  Text="{Binding InformationColumn3}"/>
        </FormattedString>
    </Label.FormattedText>
</Label>
...

附：您可以进一步将所有Label 的CONVERTER 设置为IsVisible 属性，使其仅在InformationColumn 数据不为空时可见。