Question

我在接下来的日子里开始了一个非常大的项目，我想到了创建项目的最佳方式。现在我对一个控件有一个重要的问题，我真的不知道实现它的最佳方法是什么。

我有一个LED灯矩阵。（32x16 leds）。这些必须在网格中显示，现在是棘手的部分。我必须能够用它们做很多事情。作为示例，我必须能够轻松地访问数据绑定leds进行一些操作，例如将所有这些操作向右或向左移动2次或反转它们等等。

我想过在像这样的项目控件中显示它们：

<ItemsControl ItemsSource="{Binding Path=Leds}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <UniformGrid Rows="16" Columns="32"/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate DataType="{x:Type local:Led}">
                <Ellipse Name="ellipse" Fill="Green"/>
                <DataTemplate.Triggers>
                    <DataTrigger Binding="{Binding Path=State}" Value="Off">
                        <Setter TargetName="ellipse" Property="Fill" Value="Red"/>
                    </DataTrigger>
                </DataTemplate.Triggers>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

但是我应该如何处理led上的鼠标点击来转动它。（我正在使用MVVM）你会如何在LED中抽象整个网格？

有很多解决方案，但我不知道应该选哪一个？

您是否有一个有趣的想法如何创建一个简单的CLEAN解决方案。

Answer 1

而不是UniformGrid，请考虑在Grid中使用常规ItemsControl并将Grid.Column中的Grid.Row和ItemContainerStyle绑定到<ItemsControl ItemsSource="{Binding Leds}">  <ItemsControl.ItemsPanel> <ItemsPanelTemplate> <Grid local:GridHelpers.RowCount="16" local:GridHelpers.ColumnCount="32" /> </ItemsPanelTemplate> </ItemsControl.ItemsPanel>  <ItemsControl.ItemContainerStyle> <Style> <Setter Property="Grid.Column" Value="{Binding ColumnIndex}" /> <Setter Property="Grid.Row" Value="{Binding RowIndex}" /> </Style> </ItemsControl.ItemContainerStyle>  <ItemsControl.ItemTemplate> <DataTemplate> ... </DataTemplate> </ItemsControl.ItemTemplate> </ItemsControl>对象的值。这样可以更轻松地完成移动整列或行的操作。

你可以写出16和32行/列定义，或者我有一些attached properties on my blog可以让你用每行一行。

Button

至于点击它们打开/关闭它们，将每个项目包装在Template标记中并覆盖Command以查找您想要的方式。然后，您可以将CommandParameter事件绑定到ViewModel中的属性，并将选定的LED作为<Button Command="{Binding RelativeSource={RelativeSource ItemsControl}, Path=DataContext.ToggleLedCommand}" CommandParameter="{Binding }"> <Button.Template> <ControlTemplate TargetType="{x:Type Button}"> <Ellipse Name="ellipse" Fill="Green"/> <ControlTemplate.Triggers> <DataTrigger Binding="{Binding Path=State}" Value="Off"> <Setter TargetName="ellipse" Property="Fill" Value="Red"/> </DataTrigger> </ControlTemplate.Triggers> </ControlTemplate> </Button.Template> </Button>

传递给它

void ToggleLed(LedModel led)
{
    led.State = (led.State == "On" ? "Off" : "On");
}

你的Command实现只是

{{1}}

Answer 2

我宁愿建议您使用in this stackoverflow thread引入的UniformGrid控件

，而不是使用DataGrid2D。

它允许您将DataGrid2D的{{1}}绑定到2D对象（在您的情况下为ItemsSource），然后在2D中显示您的任何更改阵列。假设您要切换两个LED，例如从位置[1,2]到[2,5]，您只需要在Led[,]数组上执行此操作，视图将自动更新

WPF Simple DataMatrix

2 个答案: