ListView与分组标题不显示listview项目 - Xamarin

时间:2018-02-11 13:57:30

标签: c# android listview xamarin grouping

我有一个listview,其中itemsource绑定到视图模型中的ObservableCollection属性。 然后我想按照日期值对这些项目进行分组,但现在列表视图没有明显填充。 下面是我在Xaml页面中的列表视图。

    <ListView 
                              ItemsSource="{Binding UpcomingGamesGrouped}"
                              IsGroupingEnabled="True"
                              GroupDisplayBinding="{Binding Key}"
                              GroupShortNameBinding="{Binding Key}"
                              ItemSelected="ListView_ItemSelected" 
                              SelectedItem="{Binding SelectedFixture, Mode=TwoWay}"  
                              HasUnevenRows="True" IsVisible="True" Grid.Column="1">
                        <ListView.GroupHeaderTemplate>
                            <DataTemplate>
                                <ViewCell Height="25">
                                    <StackLayout VerticalOptions="FillAndExpand"
                                                   Padding="5"
                                                   BackgroundColor="#3498DB">   
                                        <Label Text="{Binding Key}" TextColor="White" VerticalOptions="Center"/>
                                    </StackLayout>
                                </ViewCell>
                            </DataTemplate>
                        </ListView.GroupHeaderTemplate>
    <ListView.ItemTemplate>
                            <DataTemplate>
                                <ViewCell>
                                    <ViewCell.View>
                                        <Grid >
                                            <Grid.RowDefinitions>
                                                <RowDefinition Height="*"/>
                                                <RowDefinition Height="*"/>
                                            </Grid.RowDefinitions>
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition/>
                                                <ColumnDefinition Width="50"/>
                                                <ColumnDefinition/>
                                            </Grid.ColumnDefinitions>
                                            <Label Text="{Binding HomeTeam}" TextColor="{DynamicResource mainTextColor}" 
                                                    Grid.Column="0" Grid.Row="0" HorizontalOptions="CenterAndExpand"
                                                    FontSize="{DynamicResource teamFontSize}"/>
                                            <Label Text="{Binding Time}" FontSize="{DynamicResource regularFontSize}" HorizontalTextAlignment="Center" WidthRequest="40"
                                                   BackgroundColor="{DynamicResource subTextColor}" 
                                                        HorizontalOptions="Center" Grid.Column="1" Grid.Row="0"/>
                                            <Label Text="{Binding AwayTeam}" TextColor="{DynamicResource mainTextColor}" 
                                                    Grid.Column="2" Grid.Row="0" HorizontalOptions="CenterAndExpand" 
                                                    FontSize="{DynamicResource teamFontSize}"/>
                                            <Label Text="{Binding Location}" FontSize="{DynamicResource subtitleFontSize}" 
                                                    HorizontalOptions="CenterAndExpand" Grid.Column="0" Grid.Row="1" Grid.ColumnSpan="3"/>
                                        </Grid>
                                    </ViewCell.View>
                                </ViewCell>
                            </DataTemplate>
                        </ListView.ItemTemplate>

UpComingGame模型如下所示:

public class UpComingGame
    {
        public string Location { get; private set; }
        public string Time { get; private set; }
        public string HomeTeam { get; private set; }
        public string AwayTeam { get; private set; }
        public string Date { get; private set; }

        public string DateSort
        {
            get
            {
                if (string.IsNullOrWhiteSpace(Date) || Date.Length == 0)
                    return "?";

                return Date;
            }
        }

        public UpComingGame(string awayTeam, string homeTeam, string time, string location, string date)
        {
            HomeTeam = homeTeam;
            AwayTeam = awayTeam;
            Time = time;
            Location = location;
            Date = date;
        }
    }

我创建了一个名为Grouping的独立类,如下所示

public class Grouping<K, T> : ObservableCollection<T>
    {
        public K Key { get; private set; }

        public Grouping(K key, IEnumerable<T> items)
        {
            Key = key;
            foreach (var item in items)
                this.Items.Add(item);
        }
    }

最后在视图模型中......

private void LoadData()
        {
            if (_isDataLoaded)
                return;

            _isDataLoaded = true;

            var upcomingGames = _htmlParser.GetUpcomingGames(url);

            var sorted = from fixture in upcomingGames
                         orderby fixture.Date
                         group fixture by fixture.DateSort into fixtureGroup
                         select new Grouping<string, UpComingGame>(fixtureGroup.Key, fixtureGroup);

            UpcomingGamesGrouped = new ObservableCollection<Grouping<string, UpComingGame>>(sorted);

        }

当我只有listview(没有标题)时,绑定应该没问题,因为我使用Debug.WriteLine测试了UpcomingGamesGrouped集合似乎正确分配

但我无法弄清楚部署到模拟器时项目未在ListView中显示的原因。

1 个答案:

答案 0 :(得分:0)

代码看起来很好。但你必须确保两件事:

  1. 页面的BindingContext被正确设置为例如您的ViewModel(参见示例)
  2. UpcomingGamesGrouped属性通知有关更改(因为您更改了属性本身而不是集合中包含的项目)
  3. <强>视图模型

    public class MyGameOverviewViewModel : INotifyPropertyChanged
    {
        private ObservableCollection<Grouping<string, UpComingGame>> _upcomingGamesGrouped;
        public event PropertyChangedEventHandler PropertyChanged;
    
        public ObservableCollection<Grouping<string, UpComingGame>> UpcomingGamesGrouped
        {
            get { return _upcomingGamesGrouped; }
            set
            {
                _upcomingGamesGrouped = value;
                OnPropertyChanged(); // comment this line to see what you have done wrong
            }
        }
    
        protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
    
        public void LoadData()
        {
            var upcomingGames = new[]
            {
                new UpComingGame("Berlin", "Munich", "1000435", "Munich", "today"),
                new UpComingGame("Frankfurt", "Munich", "1000435", "Munich", "today"),
                new UpComingGame("Hamburg", "Munich", "1000435", "Munich", "today"),
                new UpComingGame("Gera", "Munich", "1000435", "Munich", "tomorrow"),
                new UpComingGame("Stauutgart", "Munich", "1000435", "Munich", "tomorrow"),
            };
    
            var sorted = from fixture in upcomingGames
                         orderby fixture.Date
                         group fixture by fixture.DateSort into fixtureGroup
                         select new Grouping<string, UpComingGame>(fixtureGroup.Key, fixtureGroup);
    
            UpcomingGamesGrouped = new ObservableCollection<Grouping<string, UpComingGame>>(sorted);
        }
    }
    

    网页

    public partial class MainPage : ContentPage
    {
        private MyGameOverviewViewModel _viewModel = new MyGameOverviewViewModel();
    
        public MainPage()
        {
    
            BindingContext = _viewModel;
            InitializeComponent();
        }
    
        protected override void OnAppearing()
        {
            base.OnAppearing();
            _viewModel.LoadData();
        }
    }