可扩展列表项布局

Question

我知道 ExpandableListView，但只要我能看到 ExpandableListView 有一个项目列表作为子项目。 我想要做的是有一个包含父项的列表，当我单击父项时，它会展开并显示更多信息。

注意：父项展开时显示的布局不是列表。这只是一个简单的布局，由于在每个示例中我都看到 ExpandableListView 与 List 一起用作子项，我不确定在这种情况下它是否是正确的控件。

可能的解决方案：我可以使用 ExpandableListView 并且列表中只有一个子项目，但我正在寻找比只有一个项目的列表更优雅的东西。

ExpandableListView 是此处使用的正确控件吗？

编辑：我使用的是 Xamarin Native (Xamarin.Android)，而不是 Xamarin.Forms

Answer 1

我不建议使用可扩展的 ListView，因为当有更多数据时它可能会导致性能问题。

但如果你想实现它，请按照以下步骤操作：

1. 你的模型应该像 List 中的 List

   public class Model1 { public string Name { get; set; } public List<Model2> Model2Name { get; set; } } public class Model2 { public string Name1 { get; set; } }

   在此处输入代码

那么你的 XAML 应该是这样的

<ListView HasUnevenRows="True" ItemSelected="ItemSelected" ItemsSource="{Binding DataList}"> <ListView.ItemTemplate> <DataTemplate> <ViewCell> <Grid > <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition Height="Auto"/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="9*"/> </Grid.ColumnDefinitions> <Label Grid.Row="0" Text="{Binding Name}" YAlign="Center"/> <ListView Grid.Row="1" IsVisible="{Binding ListVisibility}" SeparatorVisibility="None" ItemSelected="ProductSelected" HeightRequest="220" BackgroundColor="#f2f2f2" HorizontalOptions="FillAndExpand" ItemsSource="{Binding Model.Products}"> <ListView.ItemTemplate> <DataTemplate> <ViewCell> <Grid > <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition Height="Auto"/> </Grid.RowDefinitions> <Label Grid.Row="0" Grid.Column="0" Text="{Binding Name}" YAlign="Center" /> </Grid> </ViewCell> </DataTemplate> </ListView.ItemTemplate> </ListView> </Grid> </ViewCell> </DataTemplate> </ListView.ItemTemplate> </ListView>

现在你必须包装你的模型。为此，您必须编写一个包装类，如下所示：

public class WrapperModel<T> : INotifyPropertyChanged
{
    public T Model { get; set; }
    public event PropertyChangedEventHandler PropertyChanged = delegate { };
    bool listVisibility = false;
    public bool ListVisibility
    {
        get
        {
            return listVisibility;
        }
        set
        {
            if (listVisibility != value)
            {
                listVisibility = value;
                PropertyChanged(this, new PropertyChangedEventArgs("ListVisibility"));
            }
        }
    }
}

现在在 viewModel 中，您必须如下声明您的 List 属性：

private List<WrapperModel<ProductCategoryModel>> dataList;
    public List<WrapperModel<ProductCategoryModel>> DataList
    {
        get { return dataList; }
        set
        {
            dataList = value;
            OnPropertyChanged("DataList");
        }
    }

现在按如下方式初始化您的列表：

 foreach (var item in List)
 {
 DataList.Add(new WrapperModel<ModelName>
 { Model = item, ListVisibility = false});
                        }

现在列表将处于折叠状态。要在单击每个项目时获取内部列表，您必须按如下方式设置 ItemSelected：

private void ItemSelected(object sender, SelectedItemChangedEventArgs e)
    {
        if (e.SelectedItem == null) return;

        var tappedItem = (WrapperModel<ModelName>)e.SelectedItem;
        tappedItem.ListVisibility = !tappedItem.ListVisibility;
        ((ListView)sender).SelectedItem = null;
    }

如果您有任何疑问，请告诉我