Question

我有以下代码很简单，但它给我带来了很多麻烦。

按下按钮时，必须将数据加载到ObservableCollection中，但按下时（不是加载应用程序时）的加载速度很慢。只有50个带有网格和边框对象的项目。

c＃代码是：

using GalaSoft.MvvmLight;
using GalaSoft.MvvmLight.Command;
using SampleUWA.ClassLibrary;
using System.Collections;
using System.Collections.ObjectModel;
using System.Linq;

namespace SampleUWA.ViewModel
{
    public class MainViewModel : ViewModelBase
    {
        #region Objects
        /// <summary>
        /// Master list
        /// </summary>
        private ObservableCollection<Master> masterList;

        /// <summary>
        /// DetailList
        /// </summary>
        private ObservableCollection<Detail> detailList;
        public ObservableCollection<Detail> DetailList
        {
            get
            {
                return detailList;
            }
            set
            {
                Set(ref detailList, value);
            }
        }
        #endregion

        public MainViewModel()
        {
            masterList = new ObservableCollection<Master>();
            DetailList = new ObservableCollection<Detail>();

            if (IsInDesignMode)
            {
                DetailList = new ObservableCollection<Detail>()
                {
                    new Detail()
                    {
                        Name = "EXAMPLE DETAIL"
                    }
                };
            }
            else
            {
                fill();
            }
        }

        private void fill()
        {
            for (int i = 1; i < 5; i++)
            {
                Master newMaster = new Master()
                {
                    Name = "MASTER " + i.ToString()
                };

                newMaster.Details = new ObservableCollection<Detail>();

                for (int x = 0; x < 50; x++)
                {
                    newMaster.Details.Add(new Detail()
                    {
                        Name = newMaster.Name + " - DETAIL " + x.ToString()
                    });
                }

                masterList.Add(newMaster);
            }
        }

        private RelayCommand<string> _selectMasterCommand;
        public RelayCommand<string> SelectMasterCommand
        {
            get
            {
                return _selectMasterCommand
                       ?? (_selectMasterCommand = new RelayCommand<string>(
                           (name) =>
                           {
                               DetailList = new ObservableCollection<Detail>(masterList.First(m => m.Name == name).Details);
                           }));
            }
        }
    }
}

XAML代码是：

    <Page.Resources>
        <DataTemplate x:Key="DataTemplateData">
            <Grid>
                <Border BorderBrush="Black" BorderThickness="1" HorizontalAlignment="Right" Height="60" Margin="0" VerticalAlignment="Bottom" Width="60" Background="#FFF70000" CornerRadius="2">
                    <TextBlock x:Name="textBlock" TextWrapping="Wrap" Text="{Binding Name}" VerticalAlignment="Center" HorizontalAlignment="Center" TextAlignment="Center"/>
                </Border>
            </Grid>
        </DataTemplate>
</Page.Resources>

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition />
    </Grid.RowDefinitions>
    <Grid Width="400"  Grid.Row="1" Height="123" VerticalAlignment="Top">
        <StackPanel Orientation="Horizontal">
            <Button x:Name="button" Content="MASTER 1" HorizontalAlignment="Left" VerticalAlignment="Stretch" Margin="0,0,0,1.333" Width="74" RenderTransformOrigin="0.5,0.501" FontSize="12" Command="{Binding SelectMasterCommand, Mode=OneWay}" CommandParameter="MASTER 1"/>
            <Button x:Name="button_Copy" Content="MASTER 2" HorizontalAlignment="Left" VerticalAlignment="Stretch" Width="30" d:LayoutOverrides="TopMargin, BottomMargin, TopPosition, BottomPosition" FontSize="12" Command="{Binding SelectMasterCommand, Mode=OneWay}" CommandParameter="MASTER 2"/>
            <Button x:Name="button_Copy1" Content="MASTER 3" HorizontalAlignment="Left" VerticalAlignment="Stretch" Width="30" d:LayoutOverrides="TopMargin, BottomMargin, TopPosition, BottomPosition" FontSize="12" Command="{Binding SelectMasterCommand, Mode=OneWay}" CommandParameter="MASTER 3"/>
            <Button x:Name="button_Copy2" Content="MASTER 4" HorizontalAlignment="Left" VerticalAlignment="Stretch" Width="30" d:LayoutOverrides="TopMargin, BottomMargin, TopPosition, BottomPosition" FontSize="12" Command="{Binding SelectMasterCommand, Mode=OneWay}" CommandParameter="MASTER 4"/>
        </StackPanel>
    </Grid>
    <ListBox x:Name="listBox" Margin="10,123,10,10" Grid.Row="1" d:LayoutOverrides="LeftPosition, RightPosition, TopPosition, BottomPosition" ItemTemplate="{StaticResource DataTemplateData}" ItemsSource="{Binding DetailList}" Background="{x:Null}">
        <ListBox.ItemsPanel>
            <ItemsPanelTemplate>
                <toolkit:WrapPanel/>
            </ItemsPanelTemplate>
        </ListBox.ItemsPanel>
    </ListBox>
</Grid>

感谢。

更新：我使用UWP项目并使用Microsoft Lumia 640进行测试。我将项目上传到

https://github.com/SPKDevelopers/Sample

Answer 1

如果你使用ItemsControl而不是Listbox，那不是更好吗？

<ItemsControl x:Name="listBox" 
              Margin="10,123,10,10" Grid.Row="1"        
              ItemTemplate="{StaticResource DataTemplateData}" 
              ItemsSource="{Binding DetailList}" >
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <toolkit:WrapPanel/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
    </ItemsControl>

列表框在加载数据时很慢

1 个答案: