如何在WPF中创建赛道记分牌

时间：2014-12-04 08:18:01

标签： wpf sorting mvvm observablecollection

我试图开发这样的赛道记分牌：

enter image description here

问题是我不知道哪种方法最好。实际上我试图创建一个不断更新的Observable Collection。好吧，问题在于当我尝试通过驾驶员最佳圈数对记分牌进行分类时，驾驶员位置始终是静态的。

我使用了一个CollectionViewSource和一个ListBox来对Property＆＃34; BestLap＆＃34;但似乎只有当我第一次运行程序时，才会对驾驶员位置进行排序，然后不进行任何排序。

我还试图在viewmodel中不断地对ObservableCollection进行排序，使Driver类IComparable并创建一个新的ObservableCollection，它按照bestlap对驱动程序进行排序。但它认为这不是一个好习惯。

我想找一个做类似事情的样本，但我还没有找到它。如果您对如何执行此操作有任何建议，请与我们联系。

抱歉我的英文。

非常感谢！

1 个答案:

答案 0 :(得分：1)

使用例如ObservableCollection（OC）司机是正确的方法。此外，使用CollectionViewSource（CVS）也是一种好方法。在您的情况下产生的问题是，当源（OC）发生变化时，您的CVS才会被实现。这意味着如果添加或删除了驱动程序。

当您的来源对象的属性（例如＆＃34; BestLap＆＃34;）发生变化时，您会收到通知。

stackoverflow和其他处理此问题的网站有几个问题/答案。

现在找到一个可能的解决方案（从第二个链接中提取）：启用＆＃34; IsLiveSortingRequested＆＃34;并添加＆＃34; SortDescription＆＃34;包含用于分类的属性。 

     <Window.Resources>
            <CollectionViewSource x:Key="cvsDrivers" Source="{Binding DriversList}" IsLiveSortingRequested="True">
                <CollectionViewSource.LiveSortingProperties>
                    <clr:String>BestLap</clr:String>
                </CollectionViewSource.LiveSortingProperties>
                <CollectionViewSource.SortDescriptions>
                    <scm:SortDescription PropertyName="BestLap" />
                </CollectionViewSource.SortDescriptions>
            </CollectionViewSource>
        </Window.Resources>

修改

这是一个使用适当的MVVM方法的（非常简单和基本的）工作示例：

模型（driver.cs）：

public class Driver : INotifyPropertyChanged
{
    private string name;
    public string Name
    {
        get { return name; }
        set
        {
            name = value; 
            OnPropertyChanged("Name");
        }
    }

    private double bestLap;
    public double BestLap
    {
        get { return bestLap; }
        set
        {
            bestLap = value;
            OnPropertyChanged("BestLap");
        }
    }

    private int startNr;
    public int StartNr
    {
        get { return startNr; }
        set
        {
            startNr = value;
            OnPropertyChanged("StartNr");
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChangedEventHandler handler = PropertyChanged;
        if (handler != null) handler(this, new PropertyChangedEventArgs(propertyName));
    }
}

ViewModel.cs：

public class DriverViewModel
{
    public ObservableCollection<Driver> DriverList { get; set; }

    public DriverViewModel()
    {
        DriverList = new ObservableCollection<Driver>();
    }
}

视图（MainWindow.xaml）：

<Window.Resources>
    <CollectionViewSource x:Key="CvsDriver" 
                          Source="{Binding DriverList}" 
                          IsLiveSortingRequested="True">
        <CollectionViewSource.SortDescriptions>
            <componentModel:SortDescription PropertyName="BestLap" Direction="Ascending" />
        </CollectionViewSource.SortDescriptions>
    </CollectionViewSource>

    <Style x:Key="DriverListBoxItemContainerStyle" TargetType="{x:Type ListBoxItem}">
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="HorizontalContentAlignment" Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
        <Setter Property="VerticalContentAlignment" Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
        <Setter Property="Padding" Value="2,0,0,0"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ListBoxItem}">
                    <Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true">
                        <StackPanel Height="Auto" Orientation="Horizontal">
                            <TextBlock TextWrapping="Wrap" Text="{Binding BestLap, StringFormat=\{0:F2\}}"/>
                            <TextBlock TextWrapping="Wrap" Text="{Binding StartNr}" Margin="8,0,0,0"/>
                            <TextBlock TextWrapping="Wrap" Text="{Binding Name}" Margin="8,0,0,0"/>
                        </StackPanel>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsSelected" Value="true">
                            <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
                            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>
                        </Trigger>
                        <MultiTrigger>
                            <MultiTrigger.Conditions>
                                <Condition Property="IsSelected" Value="true"/>
                                <Condition Property="Selector.IsSelectionActive" Value="false"/>
                            </MultiTrigger.Conditions>
                            <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.InactiveSelectionHighlightBrushKey}}"/>
                            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.InactiveSelectionHighlightTextBrushKey}}"/>
                        </MultiTrigger>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>

<Grid>
    <ListBox ItemsSource="{Binding Source={StaticResource CvsDriver}}" 
             ItemContainerStyle="{DynamicResource DriverListBoxItemContainerStyle}" />
</Grid>

最后是MainWindow.cs 

public partial class MainWindow : Window
{
    private readonly DriverViewModel driverViewModel;

    public MainWindow()
    {
        // Timer generating random BestLap double values from 1.0 to 4.0 every 5 seconds
        DispatcherTimer randomlyUpdateDriverBestLapTimer = new DispatcherTimer();
        randomlyUpdateDriverBestLapTimer.Interval = TimeSpan.FromSeconds(5);
        randomlyUpdateDriverBestLapTimer.Tick += RandomlyUpdateDriverBestLapTimerOnTick;

        driverViewModel = new DriverViewModel();

        Driver driver = new Driver { BestLap = 1.2, Name = "Meyer", StartNr = 1 };
        driverViewModel.DriverList.Add(driver);

        driver = new Driver { BestLap = 1.4, Name = "Sand", StartNr = 2 };
        driverViewModel.DriverList.Add(driver);

        driver = new Driver { BestLap = 1.5, Name = "Huntelaar", StartNr = 3 };
        driverViewModel.DriverList.Add(driver);

        this.DataContext = driverViewModel;

        InitializeComponent();

        randomlyUpdateDriverBestLapTimer.Start();
    }

    private void RandomlyUpdateDriverBestLapTimerOnTick(object sender, EventArgs eventArgs)
    {
        // Important to declare Random object not in the loop because it will generate the same random double for each driver
        Random random = new Random();

        foreach (var driver in driverViewModel.DriverList)
        {
            // Random double from 1.0 - 4.0 (Source code from https://stackoverflow.com/questions/1064901/random-number-between-2-double-numbers)
            driver.BestLap = random.NextDouble() * (4.0 - 1.0) + 1.0;
        }
    }
相关问题
最新问题