如何在Listview中创建几列？

问题描述

 <ListView x:Name="listview" ItemsSource="{Binding MotorType}"  SelectionMode="None" Margin="0" HeightRequest="220">
                    <ListView.ItemTemplate>
                        <DataTemplate>
                            <ViewCell>
                                <StackLayout Orientation="Horizontal">
                                    <CheckBox HorizontalOptions="Start" Color="Black" CheckedChanged="CheckBox_CheckedChanged"
                                    IsChecked="{Binding IsSelected}"
                                    />
                                    <Label Text="{Binding Name}" TextColor="Gray"></Label>
                                </StackLayout>
                            </ViewCell>
                        </DataTemplate>
                    </ListView.ItemTemplate>
                </ListView>

我有listview，请说出如何使几列成为空白（我不使用collectionview） 我有这个 enter image description here 我要这个 enter image description here

解决方法

您可以创建一个ExtendedFlexLayout来将您的MotorType ItemSource绑定到它

   public class ExtendedFlexLayout : FlexLayout
{
    public static readonly BindableProperty ItemsSourceProperty = BindableProperty.Create(nameof(ItemsSource),typeof(IEnumerable),typeof(ExtendedFlexLayout),propertyChanged: OnItemsSourceChanged);
    public static readonly BindableProperty ItemTemplateProperty = BindableProperty.Create(nameof(ItemTemplate),typeof(DataTemplate),typeof(ExtendedFlexLayout));

    public IEnumerable ItemsSource
    {
        get { return (IEnumerable)GetValue(ItemsSourceProperty); }
        set { SetValue(ItemsSourceProperty,value); }
    }

    public DataTemplate ItemTemplate
    {
        get { return (DataTemplate)GetValue(ItemTemplateProperty); }
        set { SetValue(ItemTemplateProperty,value); }
    }

    static void OnItemsSourceChanged(BindableObject bindable,object oldVal,object newVal)
    {
        IEnumerable newValue = newVal as IEnumerable;
        var layout = (ExtendedFlexLayout)bindable;

        layout.Children.Clear();
        if (newValue != null)
        {
            foreach (var item in newValue)
            {
                layout.Children.Add(layout.CreateChildView(item));
            }
        }
    }

    View CreateChildView(object item)
    {
        ItemTemplate.SetValue(BindableObject.BindingContextProperty,item);
        return (View)ItemTemplate.CreateContent();
    }
}

代码信用和来自David Britch's blog

的更多详细信息

然后在DataTemplate的{​​{1}}中，设置ExtendedFlexLayout，以使Flexlayout知道将您的项目分为3列

FlexLayout.Basis=33%

ExtendedFlexlayout中也不需要 <StackLayout Orientation="Horizontal" FlexLayout.Basis="33%"> <CheckBox HorizontalOptions="Start" Color="Black" CheckedChanged="CheckBox_CheckedChanged" IsChecked="{Binding IsSelected}"/> <Label Text="{Binding Name}" TextColor="Gray"></Label> </StackLayout> 。

,

ListView 目前不支持平铺视图。为什么不使用 CollectionView ？如果您不想使用它，则可以从nuget安装插件 FlowListView 。

<flv:FlowListView FlowColumnCount="2" FlowItemsSource="{Binding xxx}" >

    <flv:FlowListView.FlowColumnTemplate>
        <DataTemplate>

           //...

        </DataTemplate>
    </flv:FlowListView.FlowColumnTemplate>

</flv:FlowListView>