WPF「ObservableCollection」「INotifyCollectionChanged」「Class」が良く分からない

Question

初めまして、よろしくお願いいたします。

前提・実現したいこと

WPFで表を作る場合、「ObservableCollection」でまとめたほうが良いとみかけます。
「INotifyCollectionChanged」を利用すれば、更新したという事が分かるとも見かけました。
物凄く初歩的な話を分かっていないのだと思います。

以下内容を一行したいと思っています。
①データをファイルから読み込む（Button1）
②WPFアプリ上でテキストボックスなど入力後ボタンを押してデータを追加する（Button3)
③データをファイルに書き出す（①と③は同じデータ形式）(Button2?)

例えるなら、CSVをWPF上で開き、変更して保存したいという感じです。
列の項目は決まっており、途中コンボボックスでしか選択できない項目もあります。

別のフォームでも値を利用したいことから、
Publicにすればいいと思いました。

とりあえず、XMLファイルへの書き出し、読み込みをしようと思っています。

発生している問題・エラーメッセージ

　1.xmlファイルの読み込みの、どこがおかしいのかが分からない。
「https://memo.abridge-lab.com/?p=145」のサイトを参考にしましたが、
Class?のつくり方が違うので良くわかりませんでした。
xmlファイルを読込み、itemsの中にデータを入れてDataGridにデータを表示させたいです。

　2.IDは連番（カウントアップ方式で重ならない）にしたいのですが、番号の保持方法が良く分からない
※　行の削除、追加も検討中のため、IDを変更することがあります

該当のソースコード

<Window x:Class="ClickCap.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:ClickCap"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <DataGrid  ItemsSource="{Binding}" AutoGenerateColumns="False" Margin="0,0,0,67">
            <DataGrid.Columns>

                <DataGridTextColumn Header="ID" Binding="{Binding Myid}" />
                <DataGridTextColumn Header="タイトル" Binding="{Binding Title}" />
                <DataGridTextColumn Header="詳細" Binding="{Binding Detail}" />
            </DataGrid.Columns>
        </DataGrid>
        <Button Content="Button" HorizontalAlignment="Left" Margin="182,391,0,0" VerticalAlignment="Top" Click="Button_Click"/>
        <Button Content="Button" HorizontalAlignment="Left" Margin="446,392,0,0" VerticalAlignment="Top" Click="Button_Click_1"/>
        <Button Content="Button" HorizontalAlignment="Left" Margin="680,392,0,0" VerticalAlignment="Top" Click="Button_Click_2"/>
    </Grid>
</Window>

using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.IO;
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 System.Xml.Serialization;

namespace ClickCap
{
    /// <summary>
    /// MainWindow.xaml の相互作用ロジック
    /// </summary>
    public partial class MainWindow : Window
    {
        public ObservableCollection<Item> items { get; } = new ObservableCollection<Item>();
        public class Item
        {
            public int Myid { get; set; }
            public string Title { get; set; }
            public string Detail { get; set; }
            public bool Isedit { get; set; }
        }

        public MainWindow()
        {
            InitializeComponent();
            items.Add(new Item { Myid = 1, Title = "タイトル1", Detail = "詳細1", Isedit = true });
            items.Add(new Item { Myid = 2, Title = "タイトル2", Detail = "詳細2", Isedit = true });
            items.Add(new Item { Myid = 3, Title = "タイトル3", Detail = "詳細3", Isedit = false });
            this.DataContext = items;
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {

            XmlSerializer serializer = new XmlSerializer(items.GetType());
            using (FileStream fs = new FileStream(Directory.GetCurrentDirectory() + "\\" + "mydata.xml", FileMode.Create))
                serializer.Serialize(fs, items);
        }

        private void Button_Click_1(object sender, RoutedEventArgs e)
        {
            XmlSerializer serializer = new XmlSerializer(items.GetType());
            using (FileStream fs = new FileStream(Directory.GetCurrentDirectory() + "\\" + "mydata.xml", FileMode.Open)) ;
            //test = (Item)serializer.Deserialize(fs);
        }

        private void Button_Click_2(object sender, RoutedEventArgs e)
        {
            items.Add(new Item { Myid = 7, Title = "追加", Detail = "追加1", Isedit = true });
        }
    }
}

試したこと

　エラーになったところをコメントアウトしてみましたが、何も変わりませんでした。

補足情報（FW/ツールのバージョンなど）

.Net Framework 4.7.2

Answer 1

WPF「ObservableCollection」「INotifyCollectionChanged」「Class」が良く分からない

というよりわからないのは、XmlSerializerのほうですよね？

1.xmlファイルの読み込みの、どこがおかしいのかが分からない。
(Item)serializer.Deserialize(fs);

itemsをシリアライズしたのですから、デシリアライズされた型はitemsの型です。

(ObservableCollection<Item>)serializer.Deserialize(fs);

　2.IDは連番（カウントアップ方式で重ならない）にしたいのですが、番号の保持方法が良く分からない

データベース等使わずにテキスト（xmlやcsv）で保存するなら、自分で管理する必要があります。
「読み込んだ時に最大値を覚えておく」でいいんじゃないですか？

※　行の削除、追加も検討中のため、IDを変更することがあります

空いた番号を詰めるということですか？（データベースでは普通しない操作です）
ユニークなIDが必要なのはそれに紐づく別のデータがあるからで、Itemがそれ単体で完結しているならそもそもIDを保存する意味ありますか？

<Window
  x:Class="Q1ypxtzrjzwnam0.MainWindow"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  Width="800"
  Height="450">
  <Grid>
    <Grid.RowDefinitions>
      <RowDefinition />
      <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>

    <DataGrid AutoGenerateColumns="False" ItemsSource="{Binding}">
      <DataGrid.Columns>
        <DataGridTextColumn Binding="{Binding Id}" Header="ID" IsReadOnly="True" />
        <DataGridTextColumn Binding="{Binding Myid}" Header="Myid" />
        <DataGridTextColumn Binding="{Binding Title}" Header="タイトル" />
        <DataGridTextColumn Binding="{Binding Detail}" Header="詳細" />
      </DataGrid.Columns>
    </DataGrid>

    <UniformGrid Grid.Row="1" HorizontalAlignment="Center" Rows="1">
      <Button Margin="10" Click="SaveButton_Click" Content="Save" />
      <Button Margin="10" Click="LoadButton_Click" Content="Load" />
      <Button Margin="10" Click="AddButton_Click" Content="Add" />
    </UniformGrid>
  </Grid>
</Window>

using System.Collections.ObjectModel;
using System.IO;
using System.Linq;
using System.Windows;
using System.Xml.Serialization;

namespace Q1ypxtzrjzwnam0
{
    public class Item
    {
        public static int MaxId; // 雑いｗ

        public int Id { get; }
        [XmlAttribute] public int Myid { get; set; }
        [XmlAttribute] public string Title { get; set; }
        [XmlAttribute] public string Detail { get; set; }
        [XmlAttribute] public bool Isedit { get; set; }

        public Item() => Id = ++MaxId;
    }

    public partial class MainWindow : Window
    {
        public ObservableCollection<Item> Items { get; private set; } = new ObservableCollection<Item>();

        private int maxMyid;

        public MainWindow()
        {
            InitializeComponent();

            Items.Add(new Item { Myid = 1, Title = "タイトル1", Detail = "詳細1", Isedit = true, });
            Items.Add(new Item { Myid = 2, Title = "タイトル2", Detail = "詳細2", Isedit = true, });
            Items.Add(new Item { Myid = 3, Title = "タイトル3", Detail = "詳細3", Isedit = false, });
            maxMyid = Items.Max(x => x.Myid);

            DataContext = Items;
        }

        private void SaveButton_Click(object sender, RoutedEventArgs e)
        {
            var serializer = new XmlSerializer(Items.GetType());
            using (var fs = new FileStream("mydata.xml", FileMode.Create))
                serializer.Serialize(fs, Items);
        }

        private void LoadButton_Click(object sender, RoutedEventArgs e)
        {
            Item.MaxId = 0; // 数字が増えちゃうのでリセット^^;

            var serializer = new XmlSerializer(Items.GetType());
            using (var fs = new FileStream("mydata.xml", FileMode.Open))
            {
                Items = (ObservableCollection<Item>)serializer.Deserialize(fs);
                maxMyid = Items.Max(x => x.Myid);

                // Items自体の変更は通知されないので明示的に入れ替え
                // INotifyPropertyChangedを実装するか、Clear・Addするか
                DataContext = null;
                DataContext = Items;
            }
        }

        private void AddButton_Click(object sender, RoutedEventArgs e)
        {
            var i = ++maxMyid;
            Items.Add(new Item { Myid = i, Title = $"タイトル{i}", Detail = $"詳細{i}", Isedit = true, });
        }
    }

}

---

DataGridの最下行（空行）をクリックするとアイテムが追加されます（禁止にすることもできますが）
注意が必要です（現状Myidが0で追加される）

ぐちゃぐちゃマージン（Margin="182,391,0,0"のようなもの）はやめましょう。
ウィンドウをリサイズすると大変残念なことになります。