Как отобразить вложенный список в ListView?

Question

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

Чего я хочу достичь

Код для MainPage с некоторыми фиктивными данными для тестирования

 public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            InitializeComponent();

            List<Product> products = new List<Product>();

            var stronaInternetowa = new Product("Webpage", 100f, new ProductOption("Option1", 10f));
            var sklepInternetowy = new Product("Shop", 100f, new ProductOption("Option1", 10f));

            products.Add(stronaInternetowa);
            products.Add(sklepInternetowy);

            listView.ItemsSource = products;

        }
    }

Класс ProductOption для хранения данных об опциях для Product.

 class ProductOption
    {
        public string OptionName { get; private set; }
        public float OptionPrice { get; private set; }

        public ProductOption(string name, float price)
        {
            OptionName = name;
            OptionPrice = price;

        }

    }

XAML MainPage с примером ListView того, что я хочу получить

 <ListView x:Name="listView" RowHeight="100">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <StackLayout>
                            <Label Text="{Binding Name}"></Label>
                            <!-- Here i would like to display all of the ProductOptions in the list along with Sliders -->
                        </StackLayout>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

Класс продукции.

 class Product 
    {


        public string Name { get; set; }
        public float Price { get; set; }



        public List<ProductOption> ProductOptions { get; private set; } = new List<ProductOption>();

        public Product(string name, float price,params ProductOption[] productOption)
        {
            Name = name;
            Price = price;              
            foreach(ProductOption p in productOption)
            {
                ProductOptions.Add(p);
            }
        }
    }

Что я пробовал до сих пор:

1. Группировка, у меня не получается так, как я пытался это сделать.
2. Вложенный ListView, но он не поддерживается.

Answer 1

Вы можете внести некоторые изменения, чтобы включить группировку:

XAML должен быть:

<ListView 
    x:Name="listView"
    IsGroupingEnabled="True"        
    HasUnevenRows="True">
    <ListView.GroupHeaderTemplate>
        <DataTemplate>
            <ViewCell Height="45">
                <Grid Padding="10" BackgroundColor="WhiteSmoke">
                    <Label FontSize="18">
                        <Label.FormattedText>
                            <FormattedString>
                                <Span Text="{Binding Name}"/>
                                <Span Text=",  "/>
                                <Span Text="{Binding Price}"/>
                            </FormattedString>
                        </Label.FormattedText>
                    </Label>
                </Grid>
            </ViewCell>
        </DataTemplate>
    </ListView.GroupHeaderTemplate>
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell Height="40">
                <Grid Padding="10" BackgroundColor="White">
                    <Label FontSize="15">
                        <Label.FormattedText>
                            <FormattedString>
                                <Span Text="{Binding OptionName}"/>
                                <Span Text=",  "/>
                                <Span Text="{Binding OptionPrice}"/>
                            </FormattedString>
                        </Label.FormattedText>
                     </Label>
                 </Grid>
            </ViewCell>
        </DataTemplate>
     </ListView.ItemTemplate>
</ListView>

Модель продукта должна быть:

Запишите, что я унаследовал Product с List<ProductOptions>

public class Product : List<ProductOption>
{
    public string Name { get; set; }
    public float Price { get; set; }
    public List<ProductOption> ProductOptions => this;
    public Product(string name, float price, params ProductOption[] productOption)
    {
        Name = name;
        Price = price;
        foreach (ProductOption p in productOption)
        {
            ProductOptions.Add(p);
        }
    }
}

Когда я попробовал следующие данные:

var stronaInternetowa = new Product("Webpage", 100f, new ProductOption("Option1", 10f), new ProductOption("Option2", 20f), new ProductOption("Option3", 30f));
var sklepInternetowy = new Product("Shop", 100f, new ProductOption("Option1", 10f), new ProductOption("Option2", 20f));

Я получил следующий результат: