WPF- ItemsControl的ListView与TextBoxes性能问题

时间:2018-09-24 07:28:30

标签: wpf performance listview mvvm itemscontrol

我正在努力寻找解决WPF性能问题的解决方案。 我有一个C#项目,该项目从串行端口接收一些“消息”并将其显示在GUI上。该GUI允许编辑每个接收到的消息的字节,还具有一个“保存”按钮,可将已编辑的消息保存到文件中。

对于GUI,将MVVM与WPF结合使用,我为实现上述要求所做的工作如下:

  • 一个“ MainViewModel”类,其中包含一个可观察到的“ SerialMessageViewModel”集合。
  • 每个“ SerialMessageViewModel”类都包含串行消息(字符串)的“名称”及其数据字节。

该视图使用ListView显示“ SerialMessageViewModel”的集合,对于每个SerialMessage,我使用ItemsControl来显示MessageData字节。因为我想让字节可以编辑,所以我使用TextBox作为ItemsControl的ItemTemplate。 这里的想法是让ItemsControl像GUI一样充当“ HexEditor”。

除了ListView的滚动速度非常慢之外,其他所有操作实际上都正常。enter image description here

这使应用程序使用起来非常沮丧。 我知道将ItemsControl的ListView与类似TextBoxes一起使用会生成很多TextBoxes,但是我找不到其他类似方法。 Visual Studio性能分析工具显示滚动的滞后是由“布局”时间引起的。 enter image description here

关于如何解决此问题的任何建议? 非常感谢你!

查看XAML

<Window x:Class="WpfListIssue.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:WpfListIssue"
    mc:Ignorable="d"
    Title="MainWindow" Height="800" Width="600">
<Window.Resources>
    <ResourceDictionary>
        <local:ByteToHexStringConverter x:Key="ByteToHexStringConverter" />
    </ResourceDictionary>
</Window.Resources>
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>

    <ProgressBar Grid.Row="0" Height="20" IsIndeterminate="True" />

    <ListView Grid.Row="1" Margin="10" ItemsSource="{Binding Messages}">
        <ListView.View>
            <GridView>
                <GridViewColumn Header="Message Name" Width="120" DisplayMemberBinding="{Binding MessageName}" />
                <GridViewColumn Header="Message Data" Width="400" >
                    <GridViewColumn.CellTemplate>
                        <DataTemplate>
                            <ItemsControl ItemsSource="{Binding MessageData}">
                                <ItemsControl.ItemTemplate>
                                    <DataTemplate>
                                        <TextBox Text="{Binding Value, Converter={StaticResource ByteToHexStringConverter}}" />
                                    </DataTemplate>
                                </ItemsControl.ItemTemplate>
                                <ItemsControl.ItemsPanel>
                                    <ItemsPanelTemplate>
                                        <VirtualizingStackPanel Orientation="Horizontal" />
                                    </ItemsPanelTemplate>
                                </ItemsControl.ItemsPanel>
                            </ItemsControl>
                        </DataTemplate>
                    </GridViewColumn.CellTemplate>
                </GridViewColumn>
            </GridView>
        </ListView.View>
    </ListView>
</Grid>
</Window>

ViewModels

public class MainViewModel : ViewModelBase
{
    private ObservableCollection<SerialMessageViewModel> _messages;

    public ObservableCollection<SerialMessageViewModel> Messages
    {
        get { return _messages; }
        set
        {
            if (Equals(value, _messages)) return;
            _messages = value;
            RaisePropertyChanged();
        }
    }

    public MainViewModel()
    {
        GetMessages();
    }

    private void GetMessages()
    {
        // Simulates the reception of messages from serial
        Messages = new ObservableCollection<SerialMessageViewModel>();
        Random rand = new Random();

        for (int i = 0; i < 100; i++)
        {
            byte[] data = new byte[50];
            rand.NextBytes(data);
            SerialMessageViewModel message = new SerialMessageViewModel("Message n." + i, data);
            Messages.Add(message);
        }
    }
}

public class SerialMessageViewModel : ViewModelBase
{
    private string _messageName;
    private ObservableCollection<NotifyByte> _messageData;

    public string MessageName
    {
        get { return _messageName; }
        set
        {
            if (Equals(value, _messageData)) return;
            _messageName = value;
            RaisePropertyChanged();
        }
    }

    public ObservableCollection<NotifyByte> MessageData
    {
        get { return _messageData; }
        set
        {
            if (Equals(value, _messageData)) return;
            _messageData = value;
            RaisePropertyChanged();
        }
    }

    public SerialMessageViewModel(string messageName, byte[] data)
    {
        MessageName = messageName;
        MessageData = new ObservableCollection<NotifyByte>();
        foreach (byte b in data)
            MessageData.Add(new NotifyByte(b));
    }
}

public class NotifyByte : ViewModelBase
{
    private byte _value;

    public byte Value
    {
        get { return _value; }
        set
        {
            if (Equals(value, _value)) return;
            _value = value;
            RaisePropertyChanged();
        }
    }

    public NotifyByte(byte value)
    {
        _value = value;
    }
}

ByteToHexStringConverter

public class ByteToHexStringConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        byte num = (byte)value;
        return num.ToString("X2");
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        string input = (string)value;
        if (!String.IsNullOrEmpty(input))
        {
            input = input.Replace(" ", "");
            return System.Convert.ToByte(input, 16);
        }
        return 0x00;
    }
}

1 个答案:

答案 0 :(得分:1)

这不使用您的示例代码,但总的来说,这是您可以使用DataGrid来实现所要查找的内容,并尝试使其更加轻巧的方法。请注意,由于我们不想允许从单元格进行编辑,因此我正在使用TextBlock。您的自定义文本框XAML将放在CellEditTemplate中。

MainWindow.xaml

<DataGrid AutoGenerateColumns="False"
               ItemsSource="{Binding DataSet}">
    <DataGrid.Columns>
        <DataGridTextColumn Binding="{Binding DisplayName}" />
        <DataGridTemplateColumn>
            <DataGridTemplateColumn.CellTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding DisplayForIsSomethingRelevant}" />
                </DataTemplate>
            </DataGridTemplateColumn.CellTemplate>
            <DataGridTemplateColumn.CellEditingTemplate>
                <DataTemplate>
                    <CheckBox IsChecked="{Binding IsSomethingRelevant}" />
                </DataTemplate>
            </DataGridTemplateColumn.CellEditingTemplate>
        </DataGridTemplateColumn>
    </DataGrid.Columns>
</DataGrid>

MainWindowVm.cs

public class MainWindowVm
{
   public ObservableCollection<TestObject> DataSet { get; set; } = new ObservableCollection<TestObject>();

   public MainWindowVm()
   {
      DataSet.Add(new TestObject {DisplayName = "Booyah", IsSomethingRelevant = true});
      DataSet.Add(new TestObject {DisplayName = "Iggy Boop", IsSomethingRelevant = false});
   }
}

TestObject.cs(bindablebase仅提供针对notifypropertychanged的默认实现)

public class TestObject : BindableBase
{
   private string _displayName;

   public string DisplayName
   {
      get { return _displayName; }
      set { SetProperty(ref _displayName, value); }
   }

   private bool _IsSomethingRelevant;

   public bool IsSomethingRelevant
   {
      get { return _IsSomethingRelevant; }
      set
      {
         SetProperty(ref _IsSomethingRelevant, value); 
         NotifyPropertyChanged(nameof(DisplayForIsSomethingRelevant));
      }
   }

   public string DisplayForIsSomethingRelevant => IsSomethingRelevant
                                                     ? "Totes Relevant"
                                                     : "Non-Relevono";
}