代码之家 › 专栏 › 技术社区 › Bartek ChyÅ¼y

Xamarin窗体中的可编辑分组列表视图

xamarin.forms mvvm xaml .net c#

Bartek ChyÅ¼y · 技术社区 · 7 年前

我想在xamarin表单中显示类似嵌套listview的内容。我的意思是我想要一份有他们订单的人的清单(订单清单可以是空的)。该列表允许向特定人员添加订单、删除人员(及其所有订单)和删除特定订单。

我考虑创建 订单模型 在哪里? 订单模型 看起来像:

public class OrderModel
{
    public string PersonName {get;set;}
    public Order Order {get; set;}
}

但我不知道这是不是一个好主意,以及如何实现这样的事情。

0 回复 | 直到 7 年前

nevermore 7 年前

我写了一个简单的演示来达到你的要求。我用的是 Grouped ListViews 以下内容:

订单模型 以下内容:

public class OrderModel
{

    public string orderName { get; set; }

    public OrderModel()
    {
    }
}

public class GroupedOrderModel : ObservableCollection<OrderModel>
{
    public string personName { get; set; }
}

设置数据源:

public partial class GroupedListXaml : ContentPage
{
    private ObservableCollection<GroupedOrderModel> grouped { get; set; }
    public GroupedListXaml ()
    {
        InitializeComponent ();
        grouped = new ObservableCollection<GroupedOrderModel> ();
        var person1Group = new GroupedOrderModel() { personName = "   john"};
        var person2Group = new GroupedOrderModel() { personName = "   alex"};
        var person3Group = new GroupedOrderModel() { personName = "   jack"};


        person1Group.Add (new OrderModel () { orderName = "   OrderOne"});
        person1Group.Add (new OrderModel() { orderName = "   OrderTwo" });
        person1Group.Add (new OrderModel() { orderName = "   OrderThree"});
        person1Group.Add (new OrderModel() { orderName = "   OrderFour"});

        person2Group.Add (new OrderModel() { orderName = "   OrderOne"});
        person2Group.Add (new OrderModel() { orderName = "   OrderTwo"});
        person2Group.Add (new OrderModel() { orderName = "   OrderThree"});

        grouped.Add (person1Group);
        grouped.Add (person2Group);

        //Person3 without OrderModel
        grouped.Add(person3Group);

        lstView.ItemsSource = grouped;
    }
}

以xaml为单位 使用 ListView.GroupHeaderTemplate 要自定义组标题:

<ContentPage.Content>
    <ListView x:Name ="lstView" IsGroupingEnabled="true" Footer="">

        <ListView.ItemTemplate>
            <DataTemplate>
                <ViewCell>
                    <StackLayout Orientation="Horizontal">
                        <Label Text="{Binding orderName}" VerticalOptions="Center"  HorizontalOptions="StartAndExpand"/>
                        <Button Text="remove   " HorizontalOptions="EndAndExpand" VerticalOptions="CenterAndExpand"/>
                    </StackLayout>
                </ViewCell>

            </DataTemplate>
        </ListView.ItemTemplate>


        <ListView.GroupHeaderTemplate>
            <DataTemplate>
                <ViewCell>
                    <StackLayout Orientation="Horizontal">
                        <Label Text="{Binding personName}" VerticalOptions="Center"  HorizontalOptions="StartAndExpand"/>
                        <Button Text="remove all   " TextColor="Red" HorizontalOptions="EndAndExpand" VerticalOptions="CenterAndExpand"/>
                    </StackLayout>
                </ViewCell>
            </DataTemplate>
        </ListView.GroupHeaderTemplate>

    </ListView>
</ContentPage.Content>

让我们看看结果:

如果person3的项目列表为空,我如何显示它?

检查 dataSource 代码和人员3没有 orderModel 是的。