将模型 Class 的 list/collection/IEnumerable 绑定到数据网格并选择列

Question

我似乎无法通过搜索找到这个答案，也无法将其他示例中的点与我的场景联系起来。

使用 MVVM 模式：

如何在我的视图中通过 ViewModel 将我的模型 class 绑定到 listbox/datagrid？
如何挑选和选择要显示的列？
问题 2 后续：我可以通过 visual Studio UI 属性进行选择吗？如果可以，如何选择？
如果用 XAML 完成，我的 model/viewmodel class 是否有自动完成功能？
使用 Observable Collection，正确的实现方式是什么？
什么是 "preferred" XAML 控件（数据网格？、列表框？等）

我已将示例简化为：型号 Class:

using System;
using System.Collections.Generic;
using System.Text;
using System.Threading.Tasks;


namespace TestListBinding.Models
{
    public class ProjectModel
    {
        public string Id { get; set; }
        public string ProjectTitle { get; set; }
        public string ProjectDetails { get; set; }
    }
}

视图模型Class:

using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Text;
using System.Threading.Tasks;
using TestListBinding.Models;

namespace TestListBinding.ViewModels
{
    public class ProjectViewModel
    {
        private ProjectModel _project;
        private ObservableCollection<ProjectModel> _projects;

        public ProjectViewModel()
        {
            _projects = new ObservableCollection<ProjectModel>();
            var proj = new ProjectModel();
            for (int i = 1; i <= 3; i++)
            {
                proj.Id = "ID" + i.ToString();
                proj.ProjectTitle = "Project " + i.ToString();
                proj.ProjectDetails = "Details about this: " + i.ToString();
                _projects.Add(proj);
                proj = new ProjectModel();
            }
        }

        public IEnumerable<ProjectModel> Projects
        {
            get { return _projects; }
        }
    }
}

视图部分：

我知道我需要 DataContext 才能查看。许多示例显示它是在代码隐藏中设置的（见下文），一些示例引用列表框的 "StaticResource"。我还没有找到通过 UI 设置绑定的方法以及我的代码设置方式。

MainWindow.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using TestListBinding.ViewModels;

namespace TestListBinding
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            DataContext = new ProjectViewModel();//is this correct, or is there an alternative method via XAML/control properties?
        }
    }
}

XAML（通过代码或UI）你能帮我完成数据网格吗columns/bindings: 根据@EdPlunkett

更新

    <Window x:Class="TestListBinding.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:TestListBinding"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <DataGrid HorizontalAlignment="Left" Height="239" Margin="42,32,0,0" VerticalAlignment="Top" Width="435" ItemsSource="{Binding Projects}">
            <DataGrid.Columns>
                <DataGridTextColumn Header="Project Title" Binding="{Binding ProjectTitle}"/>
                <DataGridTextColumn Header="Project Details" Binding="{Binding ProjectDetails}"/>
            </DataGrid.Columns>

        </DataGrid>

    </Grid>
</Window>

这会产生一个带有额外列的奇怪布局：

Answer 1

这在您的 window 构造函数中是正确的：

DataContext = new ProjectViewModel();

这应该会在网格中显示一些内容：

<DataGrid.Columns>
    <DataGridTextColumn Binding="{Binding Id}" Header="ID"  />
    <DataGridTextColumn Binding="{Binding ProjectTitle}" Header="Project Title" />
    <DataGridTextColumn Binding="{Binding ProjectDetails}" Header="Project Details" />
</DataGrid.Columns>

WPF 用户通常不使用 designer/Properties 窗格的东西。它不是很好，而且十多年来没有改善。在这种情况下，您的自动完成功能也不走运。

首选控件？取决于您的需要：如果您希望每行有多个列，请使用 DataGrid 或 ListView。如果您希望每行显示一个值，或者每行某种漂亮的模板化 UI，请使用 ListBox。

快速列表框：

<ListBox
    ItemsSource=“{Binding Projects}”
    DisplayMemberPath=“ProjectTitle”
    />

将模型 Class 的 list/collection/IEnumerable 绑定到数据网格并选择列

Binding a list/collection/IEnumerable of Model Class to a Data Grid and Selecting Columns

c#

wpf

mvvm

data-binding

wpfdatagrid