如何根据单元格

时间:2016-09-27 11:23:19

标签: c# wpf colors datagrid rows

我目前正在使用C#WPF DataGrid DataGrid正在使用我的数据库ItemsSource,我正在使用DataGrid列出我的订单。
例如:

  

BIG BURGER 1
  BIG MAC 1
  CHEESEBURGER 1

     

MCNUGGETS 2
  鸡2 2   COCA-COLA 2
  PEPSI 2

正如您所看到的,我列出了每个订单中的商品,每个商品旁边都有数字1或数字2.这些数字正在帮我定位哪个商品属于哪个订单。

我的问题是如何绘制每一行,哪些项目属于特定顺序,例如当项目与订单1关联时为红色,当项目与订单2关联时为蓝色,依此类推。或者,作为替代方案,仅绘制每个订单的最后一行(请参见下面的粗体部分)。

我需要以某种方式将它们分开,因为当我将它们加载到datagrid时,它看起来很乱。

想象一下:

  

BIG BURGER 1   BIG MAC 1
   CHEESEBURGER 1
  MCNUGGETS 2
  鸡2 2   COCA-COLA 2
   PEPSI 2
  BIG BURGER 3
  BIG MAC 3
  CHEESEBURGER 3
   MCNUGGETS 3
  鸡4 4   COCA-COLA 4
   PEPSI 4

看起来很乱......

(正如我之前所说的那样,可以只绘制每个订单的最后一行,只是为了在屏幕上创建可见的分隔,如果不可能有整行。)

这是我现在所拥有的,但这不是最佳的,因为它使用硬编码值:

 <DataGrid.RowStyle>
        <Style TargetType="DataGridRow"> 
            <Style.Triggers>
                <DataTrigger Binding="{Binding NumberOfOrder}"  Value="1">
                    <Setter Property="Background" Value="Red"></Setter>
                </DataTrigger>
                <DataTrigger Binding="{Binding NumberOfOrder}"  Value="2">
                    <Setter Property="Background" Value="Green"></Setter>
                </DataTrigger>
                <DataTrigger Binding="{Binding NumberOfOrder}"  Value="3">
                    <Setter Property="Background" Value="Orange"></Setter>
                </DataTrigger>
            </Style.Triggers>
        </Style>
</DataGrid.RowStyle>

背后的代码:

public partial class MainWindow : Window
{
    public MainWindow()
    {
        try
        {
            InitializeComponent();
            this.WindowStartupLocation = WindowStartupLocation.CenterScreen;
            this.WindowState = WindowState.Maximized;

            datagrid1.ItemsSource = OrdersController.localOrders();
        }
        catch(Exception ex)
        {
            MessageBox.Show(ex.Message);
        }
    }
}

在这里您可以看到我正在使用硬编码值,以防我的NumberOfOrder为1,2或3 执行下一步: 绘制行,以及这不是一个好的解决方案,因为NumberOfOrder会有很多不同的值。

在Mat的回答后编辑:

public MainWindow()
{
InitializeComponent();

    CollectionViewSource collectionViewSource = new CollectionViewSource();

    var ordersList = OrdersController.localOrders(); //ORDERS LIST

    collectionViewSource.Source = new List<OrdersController.OrdersLocal>()
    {
        foreach(var item in ordersList) 
        {
            new OrdersController.OrdersLocal() {Title = item.Title, NumberOfOrder = item.NumberOfOrder, Desc = item.Desc,   User = item.User }
        }

    };

    collectionViewSource.GroupDescriptions.Add(new PropertyGroupDescription("NumberOfOrder"));

    DataContext = collectionViewSource;
}

3 个答案:

答案 0 :(得分:1)

您可以尝试使用值转换器绑定来执行此操作。

我用这种方式做了细胞样式:

<Style TargetType="DataGridCell">
    <Setter Property="Background"
            Value="{Binding State, Converter={x:Static l:Converters.CoupleStateConverter}}" />
                    </Style>

因此转换器会根据状态返回背景颜色(在我的示例中为int)。这与您的需求类似。

如您所见,单元格的数据上下文是行的值,因此我可以绑定到示例中的Property State。我假设该行对该行有效,因此数据上下文将是要在此行中显示的项。

答案 1 :(得分:1)

您可以使用CollectionViewSource并按NumberOfOrder分组: XAML:

        <DataGrid ItemsSource="{Binding}" >
        <DataGrid.GroupStyle>
            <!-- Style for groups at top level. -->
            <GroupStyle>
                <GroupStyle.ContainerStyle>
                    <Style TargetType="{x:Type GroupItem}">
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="{x:Type GroupItem}">
                                    <Expander IsExpanded="True">
                                        <Expander.Header>
                                            <DockPanel>
                                                <TextBlock FontWeight="Bold"
                                                           Text="{Binding Path=Name}" />
                                            </DockPanel>
                                        </Expander.Header>
                                        <Expander.Content>
                                            <ItemsPresenter />
                                        </Expander.Content>
                                    </Expander>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </GroupStyle.ContainerStyle>
            </GroupStyle>
        </DataGrid.GroupStyle>
    </DataGrid>

代码隐藏:

 CollectionViewSource collectionViewSource = new CollectionViewSource();
        collectionViewSource.Source = new List<RowItem>()
            {
              new RowItem() {NumberOfOrder =1, Name ="kong foo" },
              new RowItem() {NumberOfOrder =1,Name ="asdf" },
              new RowItem() {NumberOfOrder =2,Name ="asdf" },
              new RowItem() {NumberOfOrder =3,Name ="foo"}
            };


        collectionViewSource.GroupDescriptions.Add(new PropertyGroupDescription("NumberOfOrder"));

        DataContext = collectionViewSource;

答案 2 :(得分:0)

使用MultiDataTrigger根据a)订单编号和b)最后一行订单更改背景。您可能希望在模型中添加一个属性,该属性表明该行是否是该订单的最后一行。

尝试这样的事情(未经测试):

<Style.Triggers>
    <MultiDataTrigger>
        <MultiDataTrigger.Conditions>
            <Condition Binding="{Binding NumberOfOrder}" Value="1" />
            <Condition Binding="{Binding IsLastRow}" Value="True" />
        </MultiDataTrigger.Conditions>
        <Setter Property="Background" Value="Red" />
    </MultiDataTrigger>
    ...
</Style.Triggers>