【WPF学習中】ドラッグアンドドロップで画像を表示する。20220304

mkdir プロジェクト名
cd プロジェクト名
dotnet new wpf
dotnet add package Microsoft.Xaml.Behaviors.Wpf
dotnet add package ReactiveProperty.WPF
code .

<Window x:Class="DDImageView.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:DDImageView"
        xmlns:i="clr-namespace:Microsoft.Xaml.Behaviors;assembly=Microsoft.Xaml.Behaviors"
        xmlns:interactivity="clr-namespace:Reactive.Bindings.Interactivity;assembly=ReactiveProperty.WPF"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Window.DataContext>
        <local:MainWindowViewModel />
    </Window.DataContext>
    <i:Interaction.Triggers>
        <i:EventTrigger EventName="Closed">
            <interactivity:EventToReactiveCommand Command="{Binding WindowClosedCommand}" />
        </i:EventTrigger>
        <i:EventTrigger EventName="SizeChanged">
            <interactivity:EventToReactiveCommand Command="{Binding WindowSizeChangedCommand}" />
        </i:EventTrigger>
    </i:Interaction.Triggers>
    <Grid>
        <StackPanel>
            <Canvas
                Width="{Binding CanvasWidth.Value}"
                Height="{Binding CanvasHeight.Value}"
                Background="Gray"
                AllowDrop="True">          
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="DragOver">
                        <interactivity:EventToReactiveCommand Command="{Binding DragOverCommand}" />
                    </i:EventTrigger>
                    <i:EventTrigger EventName="Drop">
                        <interactivity:EventToReactiveCommand Command="{Binding DropCommand}" />
                    </i:EventTrigger>
                </i:Interaction.Triggers>
                <Image
                    Stretch="None"
                    Source="{Binding PictureView.Value}">
                </Image>
            </Canvas>
        </StackPanel>
    </Grid>
</Window>

using System.Diagnostics;
using System;
using System.ComponentModel;
using Reactive.Bindings;
using Reactive.Bindings.Extensions;
using System.Reactive.Disposables;
using System.Windows;
using System.Windows.Media.Imaging;
using System.IO;
using System.Threading.Tasks;

namespace DDImageView
{
    public class MainWindowViewModel : INotifyPropertyChanged, IDisposable
    {
        public event PropertyChangedEventHandler PropertyChanged;
        protected virtual void OnPropertyChanged(string name) =>
            PropertyChanged(this, new PropertyChangedEventArgs(name));
        private CompositeDisposable Disposable { get; } = new ();

        public ReactiveCommand<EventArgs> WindowClosedCommand { get; }
        public ReactiveProperty<int> CanvasHeight { get; private set; } = new(450);
        public ReactiveProperty<int> CanvasWidth { get; private set; } = new(800);
        public ReactiveCommand<SizeChangedEventArgs> WindowSizeChangedCommand { get; }
        public ReactiveProperty<BitmapImage> PictureView { get; private set; }
        public ReactiveCommand<DragEventArgs> DragOverCommand { get; }
        public ReactiveCommand<DragEventArgs> DropCommand { get; }
        public MainWindowViewModel()
        {
            PropertyChanged += (o, e) => {};
            
            WindowClosedCommand = new ReactiveCommand<EventArgs>()
                .WithSubscribe(e =>this.Dispose()).AddTo(Disposable);
            
            WindowSizeChangedCommand = new ReactiveCommand<SizeChangedEventArgs>()
                .WithSubscribe(e=>
                {
                    var sz = e.NewSize;
                    CanvasWidth.Value = (int)sz.Width;
                    CanvasHeight.Value = (int)sz.Height;
                }).AddTo(Disposable);
            
            PictureView = new ReactiveProperty<BitmapImage>().AddTo(Disposable);

            DragOverCommand = new ReactiveCommand<DragEventArgs>()
                .WithSubscribe(e=>
                {
                    if (e.Data.GetDataPresent(DataFormats.FileDrop))
                    {
                        e.Effects = DragDropEffects.Copy;
                        e.Handled = true;
                    }
                    else
                    {
                        e.Effects = DragDropEffects.None;
                        e.Handled = false;
                    }
                }).AddTo(Disposable);
            
            var LoadPicture = new Func<string, BitmapImage> ((path)=>
            {
                BitmapImage bi = new();

                using (var fs = new FileStream(path, FileMode.Open, FileAccess.Read))
                using(var ms = new MemoryStream())
                {
                    fs.CopyTo(ms);
                    ms.Seek(0, SeekOrigin.Begin);
                    bi.BeginInit();
                    bi.CacheOption = BitmapCacheOption.OnLoad;
                    bi.StreamSource = ms;
                    bi.EndInit();
                    bi.Freeze();
                }

                return bi;                
            });

            DropCommand = new ReactiveCommand<DragEventArgs>()
                .WithSubscribe(async e=>
                {
                    var files = (string[])e.Data.GetData(DataFormats.FileDrop);

                    var bi = await Task.Run(() => LoadPicture(files[0]));

                    PictureView.Value = bi;
                }).AddTo(Disposable);
        }
        public void Dispose()
        {
            Debug.WriteLine("Dispose()");
            Disposable.Dispose();
        }
    }
}

dotnet run