(c) 2021 Kouji Matsui F# Epoxy 2021.5.22 FUN FAN F# - KOUJI MATSUI @KEKYO2, @KOZY_KEKYO

(c) 2021 Kouji Matsui Kouji Matsui – kozy, kekyo • NAGOYA city, AICHI pref., JP • Twitter – @kekyo2, @kozy_kekyo • Self employed (I’m looking for a job) • Microsoft Most Valuable Professional VS and DevTech 2015- • Center CLR organizer. • .NET/F#/IL/metaprogramming or like… • Bicycle rider

(c) 2021 Kouji Matsui (c) 2021 Kouji Matsui Agenda Epoxyとは EpoxyをF#で使うために Epoxyがカバーする機能

(c) 2021 Kouji Matsui Epoxyとは XAML MVVM (Model – View – ViewModel) アーキテクチャを実現 するための、補助ライブラリ https://github.com/kekyo/Epoxy/ 同様の既存実装: ◦ Prism ◦ LightMVVM ◦ ReactiveUI ◦ ReactiveProperty ◦ Etc…

(c) 2021 Kouji Matsui Epoxyとは 特徴: C#, F#やそのほかの.NET処理系で使用出来る。 ◦ 素の.NET SDK、VS, RiderなどのIDE マルチプラットフォーム対応: ◦ WPF, UWP, Xamarin Forms, Avalonia, WinUI, Uno ◦ F#では、WPFとAvaloniaに対応 NuGetパッケージで導入出来て、特別な操作を必要としない。 シンプルな補助ライブラリで直交性がある。 完全に非同期処理対応。

(c) 2021 Kouji Matsui Epoxyとは MVVM:

(c) 2021 Kouji Matsui Epoxyとは MVVMを採用したい、一般的な動機と障害: 複雑に入り組んだコードを書きがち ◦ コードビハインドに逃げてしまう ◦ コードビハインドでは事実上書けない場合も… MVVM実現のための道具が足りない ◦ INotifyPropertyChanged実装のようなボイラープレート ◦ CLRイベントの安全なフック（メモリリーク） ◦ メッセンジャーパターン面倒くさいしわかりにくい ◦ 安全な非同期処理（UnobservedTaskException）

(c) 2021 Kouji Matsui Epoxyとは 重量級フレームワークの習得コスト ◦ 使い始めると逃れられない ◦ アドホックに使えない マルチプラットフォーム対応 ◦ ターゲットにしたいプラットフォームで異なるフレームワークを使 わざるを得ない

(c) 2021 Kouji Matsui Epoxyとは Demo: D:¥Projects>mkdir epoxy_wpf_fsharp D:¥Projects>cd epoxy_wpf_fsharp D:¥Projects¥epoxy_wpf_fsharp>dotnet new -i Epoxy.Templates 復元対象のプロジェクトを決定しています... C:¥Users¥k¥.templateengine¥dotnetcli¥v5.0.104¥scratch¥restore.csproj を復元しました (2.02 sec)。 D:¥Projects¥epoxy_wpf_fsharp>dotnet new epoxy-wpf -lang F# The template "Epoxy.Wpf MVVM template" was created successfully. D:¥Projects¥epoxy_wpf_fsharp>dotnet build .NET 向け Microsoft (R) Build Engine バージョン 16.8.3+39993bd9d Copyright (C) Microsoft Corporation.All rights reserved. 復元対象のプロジェクトを決定しています... D:¥Projects¥epoxy_wpf_fsharp¥epoxy_wpf_fsharp.Core¥epoxy_wpf_fsharp.Core.fsproj を復元しました (439 ms)。 D:¥Projects¥epoxy_wpf_fsharp¥epoxy_wpf_fsharp¥epoxy_wpf_fsharp.fsproj を復元しました (3.17 sec)。

(c) 2021 Kouji Matsui Epoxyとは

(c) 2021 Kouji Matsui Epoxyとは コンパクトであること: ◦ 小さいライブラリ（パッケージ） ◦ 小さい型（クラス・構造体） ◦ フレームワークとは呼べない構造を着地点に シンプルであること: ◦ 複雑な構造ではない ◦ 複雑なインターフェイスではない ◦ 複雑な使用方法ではない ◦ 標準で非同期処理に対応

(c) 2021 Kouji Matsui Epoxyとは 直交性があること: ◦ 各機能を個別に使用出来る ◦ 各機能を自由に組み合わせる事が出来る ◦ 他のライブラリやフレームワークと組み合わせて使用出来る 副作用が少ないこと: ◦ 意図しない動作を生まない・生みにくい ◦ 連携して使用することが前提の機能にしない

(c) 2021 Kouji Matsui Epoxyとは 学習コストが低いこと: ◦ 手早く動かせること ◦ 覚えることが少ない ◦ 固有のアーキテクチャ、目新しい概念などを持ち込まない ◦ 誤った操作を行う事が出来ないか、行いにくい、または気が付く事が 出来るようにする ◦ F#固有: XAML/MVVM自体がOOPベースなので、あまり無理にFP側に寄 せない

(c) 2021 Kouji Matsui (c) 2021 Kouji Matsui Agenda Epoxyとは EpoxyをF#で使うために Epoxyがカバーする機能

(c) 2021 Kouji Matsui EpoxyをF#で使うために WPFとAvalonia F#で便利に使えるように: C#/F#混在プロジェクトでも機能する camel-caseの関数名 F#型の直接サポート（関数型・Option） 既定の非同期型としてAsync型を使う ViewModelインジェクタ WPF XAMLページの自動リソース化

(c) 2021 Kouji Matsui EpoxyをF#で使うために WPFとAvalonia F#で便利に使えるように: C#/F#混在プロジェクトでも機能する camel-caseの関数名 F#型の直接サポート（関数型・Option） 既定の非同期型としてAsync型を使う ViewModelインジェクタ WPF XAMLページの自動リソース化

(c) 2021 Kouji Matsui EpoxyをF#で使うために C#/F#混在プロジェクトでも機能する ◦ インスタンス生成はファクトリで行う。 ◦ 共通の型のインスタンスが生成される。 ◦ メンバー（メソッド・関数）は、拡張メソッド・型拡張で。 ※ NuGetパッケージは FSharp.Epoxy.Wpf や FSharp.Epoxy.Avaloniaですが、 実際はいくつかのパッケージに分割されています。 FSharp.Epoxy.Wpf Epoxy.Wpf.Core Epoxy.Build

(c) 2021 Kouji Matsui EpoxyをF#で使うために WPF XAMLページの自動リソース化 ◦ WPFをF#で書く場合、C#のpartial classによるBAMLのロードと初期化が 出来ない。 ◦ ワークアラウンドとして、XAMLのままリソースに保存して、ダイナ ミックロードする手法がある。 ◦ XAMLをBAMLにコンパイルしないで格納するには、ItemGroupでPageで はなくResourceとしてビルドさせるようにする必要がある。 ◦ 上記をNuGetパッケージ内で自動化。

(c) 2021 Kouji Matsui (c) 2021 Kouji Matsui Agenda Epoxyとは EpoxyをF#で使うために Epoxyがカバーする機能

(c) 2021 Kouji Matsui Epoxyがカバーする機能 機能名 概要 1. ViewModelインジェクタ ViewModelに必要なPropertyChangedイベントなどを、ビルド時に自動的に実 装出来る機能。 2. ViewModel基底クラス ViewModelに必要なPropertyChangedイベントなどを、オーソドックスな基底 クラスとして提供。 3. CommandFactory 任意の非同期関数を、ICommandとして利用できるようにする。 4. EventBinder 任意のXAMLコントロールのCLRイベントを、ICommandとしてバインディン グ可能にする添付プロパティ。 5. Anchor/Pile 任意のXAMLコントロールを、一時的かつ安全にViewModelから参照出来るよ うにする。 6. ValueConverter XAMLの値コンバーターの基底クラスを提供する。 7. UIThread UIスレッドの扱いを、プラットフォーム間で統一出来出来る。 8. GlobalService コンパクトな、依存注入のためのインフラ。非常に高速で単純。 9. Designer デザイン時編集をサポート。 それぞれの機能は独立しているため、自由に組み合わせて使用出来る。

(c) 2021 Kouji Matsui Epoxyがカバーする機能 (1) 1. ViewModelインジェクタ ◦ ビルド時にILインジェクションを行って、 ViewModelに必要な実装を自 動で行う。 ◦ ViewModelAttributeを適用してビルドするだけ。 ◦ 完全に自動化されていて、SDKのみ環境やCIでも使用OK（VSIX不要）。 ◦ F#の記述としては、自動実装プロパティを使う。 ◦ INotifyPropertyChanging ◦ INotifyPropertyChanged ◦ PrettyPrinter (ToString)

(c) 2021 Kouji Matsui Epoxyがカバーする機能 (1)

(c) 2021 Kouji Matsui Epoxyがカバーする機能 (1)

(c) 2021 Kouji Matsui Epoxyがカバーする機能 (1)

(c) 2021 Kouji Matsui Epoxyがカバーする機能 (1)

(c) 2021 Kouji Matsui Epoxyがカバーする機能 (1) OnPropertyChangedに相当するフック: ◦ ダックタイピング

(c) 2021 Kouji Matsui Epoxyがカバーする機能 (2) 2. ViewModel基底クラス ◦ オーソドックスな、ViewModelの基底クラス。 ◦ ViewModelインジェクタと同様の実装を提供する。 ◦ 但し、プロパティの実装は自分で記述する必要がある。

(c) 2021 Kouji Matsui Epoxyがカバーする機能 (3) 3. CommandFactory ◦ ICommandを実装するクラスの提供。ボタンクリックなどに反応。 ◦ Commandの呼び出しで関数にバイパスする (DelegateCommandに類す る)。 ◦ 引数型を指定可能（ジェネリック引数）。 ◦ 関数は非同期前提（Asyncを返すことが前提）。

(c) 2021 Kouji Matsui Epoxyがカバーする機能 (4) 4. EventBinder ◦ 任意のXAMLコントロールのCLRイベントを、ICommandとしてバイン ディング可能にする添付プロパティ。 ◦ Commandプロパティが提供されていない任意のイベントを、安全にバ インディング出来る。

(c) 2021 Kouji Matsui Epoxyがカバーする機能 (4) Command側は、EventArgsを引数に取る関数として実装。

(c) 2021 Kouji Matsui ViewModel Epoxyがカバーする機能 (5) 5. Anchor/Pile ◦ XAML側のコントロールの完全な操作を、一時的に可能にする。 ◦ コードビハインドを完全に排除出来る。メッセンジャー実装をView側 に書く必要がない。 XAML: TextBox

(c) 2021 Kouji Matsui Epoxyがカバーする機能 (5) XAML: TextBox ViewModel Pile: LogPile Anchor fun()

(c) 2021 Kouji Matsui Epoxyがカバーする機能 (5)

(c) 2021 Kouji Matsui Epoxyがカバーする機能 (6) 6. ValueConverter ◦ XAML 値コンバーターの基底クラス。 ◦ 型チェックを自動的に行う。ハンドラ関数は、明示された型を前 提に実装する。 ◦ 変換できない場合はNoneを返す事が出来る。 int → Brush

(c) 2021 Kouji Matsui Epoxyがカバーする機能 (6)

(c) 2021 Kouji Matsui Epoxyがカバーする機能 (7) 7. UIThread ◦ UIスレッドとワーカースレッドの遷移を、非同期ワークフロー内 で行うための補助実装。 ◦ モデル操作をワーカースレッドで行う場合に使用出来る。

(c) 2021 Kouji Matsui Epoxyがカバーする機能 (8) 8. GlobalService ◦ 依存注入や依存分離といったテクニックを、Epoxy上で実現する。 ◦ GlobalService属性でインターフェイスを識別。 ◦ 単純な、シングルトンインスタンス戦略。 ◦ 非同期処理対応。 ◦ Anchor/Pile同様に、一時的に参照を得る事で生存期間を短縮。

(c) 2021 Kouji Matsui Epoxyがカバーする機能 (8)

(c) 2021 Kouji Matsui Epoxyがカバーする機能 (8)

(c) 2021 Kouji Matsui 質疑応答 GitHub: https://github.com/kekyo/Epoxy/ NuGet: ◦ https://www.nuget.org/packages/FSharp.Epoxy.Wpf ◦ https://www.nuget.org/packages/FSharp.Epoxy.Avalonia 資料: ◦ 2021年のXAML事情とEpoxyを作った話 https://www.kekyo.net/2021/02/23/7230 ◦ Epoxyで C# MVVMアーキテクチャを簡単に実装する話 https://www.youtube.com/watch?v=LkyrgJbuiQs