全て
| カテゴリ未分類
| 通常
| 数学
| 投資
| 副業
| 転職・就職
| ブログ
| 株Stock
| VBA
| SharePoint
| REST API
| RenderListDataAsStream
| PowerAutomateDesktop
| Graph API
| PowerApps
| PowerAutomate
| PowerFx
| OfficeScriptオフィススクリプト
| PowerAutomate日時Excel日時相互関係
| PowerShell
| Dataverse
| UiPath
| OneDrive
| LINQ
| VB.NET
| C#.NET
| WPFC#.NET
| Git
2024.03.14
カテゴリ： C#.NET
以下は、C#とWPFを使用した基本的なMVVMパターンのサンプルコードです。この例では、簡単なToDoリストアプリケーションを作成します。ToDoアイテムを追加し、削除できるようにします。
まず、`ToDoItem`というクラスを作成します。これはToDoアイテムのデータを表します。
```csharp
public class ToDoItem
{
public string Task { get; set; }
}
```
次に、ビューモデルクラスを作成します。
```csharp
using System.Collections.ObjectModel;
using System.Windows.Input;
using System.Windows;
public class MainViewModel : ViewModelBase
{
public ObservableCollection<ToDoItem> ToDoItems { get; set; }
public ICommand AddCommand { get; set; }
public ICommand RemoveCommand { get; set; }
private string _newTask;
public string NewTask
{
get { return _newTask; }
set
{
_newTask = value;
OnPropertyChanged(nameof(NewTask));
}
}
public MainViewModel()
{
ToDoItems = new ObservableCollection<ToDoItem>();
AddCommand = new RelayCommand(AddTask);
RemoveCommand = new RelayCommand(RemoveTask);
}
private void AddTask()
{
if (!string.IsNullOrWhiteSpace(NewTask))
{
ToDoItems.Add(new ToDoItem { Task = NewTask });
NewTask = string.Empty;
}
}
private void RemoveTask(object obj)
{
var item = obj as ToDoItem;
if (item != null)
{
ToDoItems.Remove(item);
}
}
}
```
`ViewModelBase`は、`INotifyPropertyChanged`を実装する基本クラスです。`RelayCommand`は、`ICommand`を実装し、ビューからビューモデルのコマンドをバインディングするための便利なクラスです。これらのクラスは、通常、MVVMライブラリから取得できます。
ビューモデルクラスで使用されている`RelayCommand`の実装例は以下の通りです。
```csharp
using System;
using System.Windows.Input;
public class RelayCommand : ICommand
{
private readonly Action _execute;
private readonly Func<bool> _canExecute;
public RelayCommand(Action execute, Func<bool> canExecute = null)
{
_execute = execute ?? throw new ArgumentNullException(nameof(execute));
_canExecute = canExecute;
}
public bool CanExecute(object parameter)
{
return _canExecute == null || _canExecute();
}
public void Execute(object parameter)
{
_execute();
}
public event EventHandler CanExecuteChanged
{
add { CommandManager.RequerySuggested += value; }
remove { CommandManager.RequerySuggested -= value; }
}
}
```
最後に、XAMLファイルでビューを作成します。
```xml
<Window x:Class="ToDoList.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:ToDoList"
mc:Ignorable="d"
Title="ToDo List" Height="450" Width="800">
<Window.DataContext>
<local:MainViewModel/>
</Window.DataContext>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<StackPanel Grid.Row="0" Orientation="Horizontal">
<TextBox Width="200" Margin="5" Text="{Binding NewTask, UpdateSourceTrigger=PropertyChanged}"/>
<Button Width="80" Margin="5" Content="Add" Command="{Binding AddCommand}"/>
</StackPanel>
<ListBox Grid.Row="1" ItemsSource="{Binding ToDoItems}" DisplayMemberPath="Task">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Task}"/>
<Button Content="Remove" Command="{Binding DataContext.RemoveCommand, RelativeSource={RelativeSource AncestorType=ListBox}}" CommandParameter="{Binding}"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</Window>
```
これで、基本的なMVVMパターンを使用したToDoリストアプリケーションが完成しました。ビューはXAMLで定義され、ビューモデルはコードビハインドから分離されます。ビューとビューモデルは、データバインディングとコマンドバインディングを使用して相互に通信します。
お気に入りの記事を「いいね！」で応援しよう
Last updated
2024.03.14 03:53:03
[C#.NET] カテゴリの最新記事
-
ID、名前、住所、郵便番号、年齢のプロパ… 2024.05.29
-
C# WPFのMVVMパターン 2024.05.29
-
WPFで`TextBox`に対して意図的に`LostFocu… 2024.05.19
【毎日開催】
15記事にいいね！で1ポイント
© Rakuten Group, Inc.
