交互式WPF关系数据网格系统样本? [英] Interactive WPF relational datagrid system samples?

查看:103
本文介绍了交互式WPF关系数据网格系统样本?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想知道有人可以共享或指向可以在Silverlight应用程序中使用的数据网格结构的良好示例。我需要有4个关系数据库,其中有一个是主数据网格,它具有大部分数据。我应该能够删除或添加或更改项目的属性。此更改也应影响其他数据标签。例如,如果我从master datagrid中删除一个项目,那么该项目的实例应该从其他datagrids中删除。任何信息高度赞赏。谢谢你提前!

I am wondering if someone can share or point to good samples of datagrid structure that can be used in Silverlight application. I need to have 4 relational datagrids where one of them is master datagrid which has most of the data. I should be able to delete or add or change properties of the items. This changes should also affect other datagrids. For example, if I delete one item from master datagrid then the instance of that item should be deleted from other datagrids. Any information is highly appreciated. Thank you in advance!

推荐答案

我以前创建了一个类似于你正在寻找的原型。我没有使用DataGrid,实际上我使用的是一个ItemsControl,但是我认为这对你来说可能是有益的。

I had previously created a prototype similar to what you are looking for. I didn't use a DataGrid, I was actually using an ItemsControl, but I think it may be beneficial for you.

我所做的是做我的ItemsControls在相同的数据。这样,如果我要删除一个对象,它也将从另一个对象中删除(因为它是相同的数据源)。

What I did is made both of my ItemsControls look at the same data. This way, if I were to delete one object, it would also be removed from the other (since it's the same data source).

使用MVVM模式,我接近

Using the MVVM pattern, I approached it like this.

要开始,这两个网格是什么样的,它们都显示相同数据的不同表示。

To start off, here's what the two grids look like, they're both showing different representations of the same data.

这是我的MainPage.xaml

Here's my MainPage.xaml

<UserControl x:Class="ViewModelDeleteObject.MainPage"
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:ViewModelDeleteObject"
xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">

<UserControl.DataContext>
    <local:MainPage_ViewModel/>
</UserControl.DataContext>

<StackPanel Orientation="Horizontal">
    <ItemsControl ItemsSource="{Binding Coordinates}" Margin="20">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Border BorderBrush="Blue" BorderThickness="1">
                    <StackPanel Orientation="Horizontal" Margin="3">
                        <Border BorderBrush="Red" BorderThickness="1">
                            <TextBlock Text="{Binding X}" TextAlignment="Right" Width="100" Margin="3"/>
                        </Border>
                        <Border BorderBrush="Red" BorderThickness="1">
                            <TextBlock Text="{Binding Y}" TextAlignment="Right" Width="100" Margin="3"/>
                        </Border>
                        <Button Content="Delete" Click="Button_Click" Tag="{Binding}"/>
                    </StackPanel>
                </Border>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

    <ItemsControl ItemsSource="{Binding Coordinates}" Margin="20">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Border BorderBrush="Blue" BorderThickness="1">
                    <Border BorderBrush="Red" BorderThickness="1">
                        <TextBlock Text="{Binding XYCoordinate}" TextAlignment="Right" Width="100" Margin="3"/>
                    </Border>
                </Border>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</StackPanel>

public partial class MainPage : UserControl
{
    public MainPage()
    {
        InitializeComponent();
        this.viewModel = this.DataContext as MainPage_ViewModel;
    }
    private MainPage_ViewModel viewModel;

    private void Button_Click(object sender, RoutedEventArgs e)
    {
        viewModel.DeleteCoordinate((sender as Button).Tag as Coordinate_DataViewModel);
    }
}

MainPage.xaml将以下MainPage_ViewModel.cs设置为它的DataContext:

MainPage.xaml has the following MainPage_ViewModel.cs set as its DataContext:

public class MainPage_ViewModel : INotifyPropertyChanged
{
    public MainPage_ViewModel()
    {
        coordinates.Add(new Coordinate_DataViewModel(new Coordinate_Model() { X = 1, Y = 2 }));
        coordinates.Add(new Coordinate_DataViewModel(new Coordinate_Model() { X = 2, Y = 4 }));
        coordinates.Add(new Coordinate_DataViewModel(new Coordinate_Model() { X = 3, Y = 6 }));
        coordinates.Add(new Coordinate_DataViewModel(new Coordinate_Model() { X = 4, Y = 8 }));
        coordinates.Add(new Coordinate_DataViewModel(new Coordinate_Model() { X = 5, Y = 10 }));
        coordinates.Add(new Coordinate_DataViewModel(new Coordinate_Model() { X = 6, Y = 12 }));
    }

    public ObservableCollection<Coordinate_DataViewModel> Coordinates
    {
        get { return coordinates; }
        set 
        {
            if (coordinates != value)
            {
                coordinates = value;
                OnPropertyChanged("Coordinates");
            }
        }
    }
    private ObservableCollection<Coordinate_DataViewModel> coordinates = new ObservableCollection<Coordinate_DataViewModel>();

    public event PropertyChangedEventHandler PropertyChanged;

    public void OnPropertyChanged(string propertyName)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }

    public void DeleteCoordinate(Coordinate_DataViewModel dvmToDelete)
    {
        coordinates.Remove(dvmToDelete);
    }
}

我的模型和数据视图模型类也在下面显示

My model and data view model classes are also shown below.

模型

public class Coordinate_Model
{
    public double X;
    public double Y;
}

DataViewModel

DataViewModel

public class Coordinate_DataViewModel
{
    public Coordinate_DataViewModel(Coordinate_Model model)
    {
        this.underlyingModel = model;
    }
    private Coordinate_Model underlyingModel;

    public double X
    {
        get { return underlyingModel.X; }
        set { underlyingModel.X = value; }
    }

    public double Y
    {
        get { return underlyingModel.Y; }
        set { underlyingModel.Y = value; }
    }

    public string XYCoordinate
    {
        get { return "(" + X + "," + Y + ")"; }
    }
}

现在,当我从第一个网格,第二个网格立即更新,如下所示,我删除了4,8:

Now, when I delete a row from the first grid, the second grid immediately updates as shown below where I deleted the 4,8:

我认为这可能与您的想法相似。希望它有助于:)

I think this may be similar to what you were thinking. Hope it helps :)

注意:所有的代码都在这里,所以你应该能够复制&粘贴并执行自己,如果你愿意的话。

Note: All of the code is here, so you should be able to copy & paste and execute yourself if you'd like.

更新:这个解决方案是用Silverlight编写的,但是我注意到你的问题是'WPF'如Silverlight。即使你使用WPF,这个例子还是有益的。对不起!

更新:好的,我会更新它来使用DataGrid。这字面上我花了两分钟的时间来实现与之前提供的代码。唯一不得不改变的是这个观点,请注意,没有其他代码被触动。

Update: OK, I'll update it to use a DataGrid. This literally took me two minutes to implement with the previous code that was given. The only thing that had to change was the view, please note that no other code was touched.

这是视图中的新项目:

<data:DataGrid ItemsSource="{Binding Coordinates}" AutoGenerateColumns="False" Margin="10">
        <data:DataGrid.Columns>
            <data:DataGridTextColumn Header="X Position" Width="100" Binding="{Binding X}"/>
            <data:DataGridTextColumn Header="Y Position" Width="100" Binding="{Binding Y}"/>
            <data:DataGridTemplateColumn Header="Delete Item" Width="100">
                <data:DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <Button Content="Delete" Tag="{Binding}" Click="Button_Click"/>
                    </DataTemplate>
                </data:DataGridTemplateColumn.CellTemplate>
            </data:DataGridTemplateColumn>
        </data:DataGrid.Columns>
    </data:DataGrid>

    <data:DataGrid ItemsSource="{Binding Coordinates}" AutoGenerateColumns="False" Margin="10">
        <data:DataGrid.Columns>
            <data:DataGridTextColumn Header="Coordinate" Width="100" Binding="{Binding XYCoordinate}"/>
        </data:DataGrid.Columns>
    </data:DataGrid>

这是初始网格的样子:

Here's what the initial grids look like:

删除后的内容是这样的:

Here's what it looks like after delete:

这篇关于交互式WPF关系数据网格系统样本?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆