c# - 在 Xamarin.Forms 中显示包含许多其他视图的视图的最佳方式

Question

我创建AddonPickerControl了一个水平StackLayout的视图AddonControls。问题是包含AddonPickerListView加载大约 2 秒的页面，它太长了。

我试图通过将插件绑定到 a 来获得相同的结果ListView，但问题是每个单元格都必须有一个计数器来描述选择了多少特定插件。我不知道如何做到这一点ViewCell，所以我决定StackLayout。

public partial class AddonPickerControl : ContentView
{
    public AddonPickerControl (AddonPicker addonPicker)
    {
        InitializeComponent ();
        _addonPicker = addonPicker;
        BindingContext = _addonPicker;
    }

    private readonly AddonPicker _addonPicker;

    protected override void OnAppearing()
    {
        foreach (var addon in _addonPicker.AvailableAddons)
        {
            var addonControl = new AddonControl(addon);
            addonControl.AddonPicked += OnAddonPicked;

            AddonContainer.Children.Add(addonControl);
        }
    }
        ...
}


public partial class AddonControl : ContentView
{
    public AddonControl (Addon addon)
    {
        InitializeComponent ();
        _addon = addon;
        this.BindingContext = _addon;
    }

    private readonly Addon _addon;
        ...
}

我应该如何显示AddonPickerControl？填充StackLayout其他视图需要太多时间。或者，也许可以创建一个ViewCell计数器来描述已经选择了多少绑定的插件。

标签： c#androidxamarinxamarin.forms

Answer 1

这是一个示例，说明如何在列表视图中的每个项目中使用按钮来更新该项目的计数。

首先，这是一个简单的列表视图，其中包含一个带有 3 个标签和两个按钮的视图单元格：

<ListView x:Name="listView" ItemsSource="{Binding Items}">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <StackLayout Orientation="Horizontal">
                    <Label Text="{Binding ItemName}" />
                    <Label Text="Count:" />
                    <Label Text="{Binding Count}" />
                    <Button Text="+" Command="{Binding BtnClickPlusCommand}"  />
                    <Button Text="-" Command="{Binding BtnClickMinusCommand}"  />
                </StackLayout>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

然后在后面的代码中：

public partial class MainPage : ContentPage
{
    public ObservableCollection<Item> Items { get; set; } = new ObservableCollection<Item>();


    public MainPage()
    {
        InitializeComponent();
        for (int i=1; i<11; i++)
        {
            Item item = new Item { ItemName = $"Item {i}", Count = "5" };
            Items.Add(item);
        }

        BindingContext = this;
    }

}

该类Item将具有您的点击处理程序，并且是一个简单的视图模型，因为它实现了INotifyPropertyChanged：

public class Item : INotifyPropertyChanged
{
    public string ItemName { get; set; }
    int _count;
    public ICommand BtnClickPlusCommand { get; private set; }
    public ICommand BtnClickMinusCommand { get; private set; }

    public Item()
    {
        BtnClickPlusCommand = new Command(btnClickPlus);
        BtnClickMinusCommand = new Command(btnClickMinus);
    }

    void btnClickPlus()
    {
        Count = (++_count).ToString();
    }

    void btnClickMinus()
    {
        Count = (--_count).ToString();
    }

    public string Count 
    {
        get
        {
            return _count.ToString();
        }
        set
        {
            int j;
            if (Int32.TryParse(value, out j))
            {
                _count = j;
                PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("Count"));
            }
            else
                Console.WriteLine("value could not be parsed to int");
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;
}

因此，在这种情况下，我们实际上为每个项目创建了一个视图模型，因此我们可以拥有将处理与按钮关联的实际 Item 对象中的按钮单击的命令，因此我们只需要更新计数。并且使用绑定，UI 会自动更新为新的计数。结果：