Xamarin Forms: TemplatedItems возвращает только ячейки просмотра из сгруппированных заголовков

(См. ответ, который дал @Knoop, чтобы сделать это правильно с правильными привязками и командами форм xamarin)

Поскольку я смог выполнить свою первоначальную цель, которая заключалась в программном изменении цвета фона каждой ячейки просмотра в коде позади, я опубликую свой результат в качестве ответа.

Сначала я узнал, что перебирать ячейки просмотра — плохая идея, потому что это противоречит шаблону проектирования. Поэтому я использовал привязки, а также пользовательский конвертер BoolToColor для динамического обновления цвета фона ячеек просмотра.

Это код, который я написал:

Класс модели (документ):

   public class Document : BaseModel<int>, IDocument, INotifyPropertyChanged
    {
        #region INotifyPropertyChanged

        public event PropertyChangedEventHandler PropertyChanged;

        protected void OnPropertyChanged([CallerMemberName] string propertyName = "")
        {
            var changed = PropertyChanged;

            changed?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }

        #endregion // INotifyPropertyChanged

        public bool HasDefaultColor
        {
            get => hasDefaultColor;
            set
            {
                hasDefaultColor = value;
                OnPropertyChanged();
            }
        }
    }

Преобразователь

public class BoolToColorConverter : IValueConverter (see question for detailed code...)

Реализация конвертера в xaml:

<Frame BackgroundColor = "{Binding HasDefaultColor, Converter = {converters:BoolToColorConverter}}"  Padding = "0" HorizontalOptions = "FillAndExpand" HasShadow = "True">

И, наконец (это та часть, с которой я застрял), правильное обновление коллекции в привязанной модели представления в методе OnTapped():

        private void DocumentViewCell_OnTapped(object sender, EventArgs e)
        {
            try
            {
                // Determine which document was selected
                if (sender.GetType() == typeof(ViewCell))
                {
                    ViewCell selectedViewCell = (ViewCell)sender;

                    if (selectedViewCell.BindingContext != null && selectedViewCell.BindingContext.GetType() == typeof(Document))
                    {
                        Document document = (Document)selectedViewCell.BindingContext;

                        if (document != null)
                        {
                            // Update default color (viewcell) for binded model
                            document.HasDefaultColor = !document.HasDefaultColor;

                            // Update backing field selectedDocument for correct bindings and to show correct detail page

                            ObservableCollection<Grouping<string, Document>> documents = viewModel.GroupedDocuments;
                            foreach (var group in documents)
                            {
                                foreach (var doc in group)
                                {
                                    if (doc.Name == document.Name)
                                    {
                                        doc.HasDefaultColor = document.HasDefaultColor;
                                    }
                                }
                            }

                            viewModel.GroupedDocuments = documents;
                            selectedDocument = document;
                        }
                    }
               }
           }
       }

Наконец-то у меня появилось время, чтобы подготовить для вас ответ.

Я вижу, вы уже нашли обходной путь, но поскольку он не совсем соответствует философии дизайна Xamarin.Forms (он выполняет жестко закодированную работу в коде программной части, чтобы получить то, что вы хотите, вместо использования Xamarin.Forms функциональности.

В любом случае я разработаю 2 возможных решения, которые, на мой взгляд, лучше соответствуют хорошему Xamarin.Forms дизайну.

Опция 1:

Этот параметр отслеживает текущий выбранный элемент и использует преобразователь значений для каждого элемента в списке, чтобы проверить, равен ли он этому выбранному элементу, и вернуть цвет на основе этого.

В нашем ViewModel нам нужно настроить коллекцию для нашего ListView нашего SelectedItem свойства, которое уведомляет нас об изменениях свойств, и, наконец, ItemTappedCommand, которое изменит наше SelectedItem:

private ObservableCollection<ItemGroup> _itemGroups;
public ObservableCollection<ItemGroup> ItemGroups
{
    get => _itemGroups;
    set => SetProperty(ref _itemGroups, value);
}

private Item _selectedItem;
public Item SelectedItem
{
    get => _selectedItem;
    set => SetProperty(ref _selectedItem, value);
}

private ICommand _itemTappedCommand;
public ICommand ItemTappedCommand => _itemTappedCommand ?? (_itemTappedCommand = new Command<Item>((item) =>
{
    SelectedItem = item;
}));

Затем нам понадобится ValueConverter, который проверит равенство и вернет правильное Color:

public class EqualityToColorConverter : IValueConverter
{
    public Color EqualityColor { get; set; }

    public Color InequalityColor { get; set; }
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {

        if (value == null || parameter == null)
            return InequalityColor;

        if (parameter is Binding binding && binding.Source is View view)
        {
            parameter = view.BindingContext;
        }

        return value == parameter ? EqualityColor : InequalityColor;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

Этот конвертер использует небольшой обходной путь для извлечения фактического элемента из parameter, поскольку по какой-то причине он продолжал возвращать мне Binding вместо фактического Item.

Теперь, когда у нас есть все необходимое, мы можем создать нашу страницу:

<ContentPage xmlns = "http://xamarin.com/schemas/2014/forms"
             xmlns:x = "http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:converters = "clr-namespace:ColorChangeDemo.Converters"
             x:Class = "ColorChangeDemo.Views.SelectedItemPage">
    <ContentPage.Resources>
        <ResourceDictionary>
            <converters:EqualityToColorConverter x:Key = "equalityToColorConverter" EqualityColor = "Green" InequalityColor = "Gray" />
        </ResourceDictionary>
    </ContentPage.Resources>
    <ContentPage.Content>
        <ListView x:Name = "ListView"  ItemsSource = "{Binding ItemGroups}" GroupShortNameBinding = "{Binding Key}" GroupDisplayBinding = "{Binding Key}" IsGroupingEnabled = "True">
            <ListView.GroupHeaderTemplate>
                <DataTemplate>
                    <ViewCell>
                        <Label Text = "{Binding Key}" />
                    </ViewCell>
                </DataTemplate>
            </ListView.GroupHeaderTemplate>
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <Button 
                            x:Name = "Button"
                            Text = "{Binding Id}" 
                            BackgroundColor = "{Binding Source = {x:Reference ListView}, Path=BindingContext.SelectedItem, Converter = {StaticResource equalityToColorConverter}, ConverterParameter = {Binding Source = {x:Reference Button}}}"
                            Command = "{Binding Source = {x:Reference ListView}, Path=BindingContext.ItemTappedCommand}"
                            CommandParameter = "{Binding .}"/>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </ContentPage.Content>
</ContentPage>

Преимущество этого решения заключается в том, что вам не нужно менять свой класс Item (если у вас нет никакого контроля над ним), однако недостатком является то, что при каждом изменении выбора все элементы будут реагировать на измененное значение. Поэтому, если отображается много элементов, это может быть неоптимальным.

Вариант 2:

Эта опция добавит свойство Selected к классу Item и будет отслеживать ранее выбранный элемент, чтобы иметь возможность отменить его выбор при выборе другого элемента.

Мы снова начинаем с нашего ViewModel, сначала с нашими свойствами:

private ObservableCollection<SelectableItemGroup> _selectableItemGroups;
public ObservableCollection<SelectableItemGroup> SelectableItemGroups
{
    get => _selectableItemGroups;
    set => SetProperty(ref _selectableItemGroups, value);
}

public ICommand ItemTappedCommand { get; }

И в конструкторе создаем нашу команду. Чтобы это работало, мы создаем локальную переменную, которую мы можем использовать для захвата в команде, чтобы мы могли отслеживать ранее выбранный элемент:

SelectableItem previous = null;

ItemTappedCommand = new Command<SelectableItem>((item) =>
{
    if (previous != null)
        previous.Selected = false;
    previous = item;
    item.Selected = true;
});

Теперь нам нужен ValueConverter, который может преобразовать наше свойство Selected в правильное Color:

public class BoolToColorConverter: IValueConverter
{
    public Color TrueColor { get; set; }

    public Color FalseColor { get; set; }

    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        if (value != null && value is bool boolValue)
            return boolValue ? TrueColor : FalseColor;
        return FalseColor;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

И снова у нас есть все настройки для создания нашей страницы:

<ContentPage xmlns = "http://xamarin.com/schemas/2014/forms"
             xmlns:x = "http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:converters = "clr-namespace:ColorChangeDemo.Converters"
             x:Class = "ColorChangeDemo.Views.DeselectPage">
    <ContentPage.Resources>
        <ResourceDictionary>
            <converters:BoolToColorConverter x:Key = "boolToColorConverter" TrueColor = "Green" FalseColor = "Gray" />
        </ResourceDictionary>
    </ContentPage.Resources>
    <ContentPage.Content>
        <ListView x:Name = "ListView"  ItemsSource = "{Binding SelectableItemGroups}" GroupShortNameBinding = "{Binding Key}" GroupDisplayBinding = "{Binding Key}" IsGroupingEnabled = "True">
            <ListView.GroupHeaderTemplate>
                <DataTemplate>
                    <ViewCell>
                        <Label Text = "{Binding Key}" />
                    </ViewCell>
                </DataTemplate>
            </ListView.GroupHeaderTemplate>
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <Button 
                            x:Name = "Button"
                            Text = "{Binding Id}" 
                            BackgroundColor = "{Binding Selected, Converter = {StaticResource boolToColorConverter}}"
                            Command = "{Binding Source = {x:Reference ListView}, Path=BindingContext.ItemTappedCommand}"
                            CommandParameter = "{Binding .}"/>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </ContentPage.Content>
</ContentPage>

Преимущество этой опции в том, что она не просматривает весь список, чтобы убедиться, что все правильно Color.

Демонстрационный проект

Чтобы увидеть это в действии, я загрузил небольшой демонстрационный проект, в котором я реализовал оба решения:

https://github.com/nknoop/ChangeColorDemo