F#
1：FsXamlでのアプリケーションの背後にあるF＃WPFコード
サーチ…
前書き
F＃WPFプログラミングで見つかったほとんどの例は、MVVMパターンに対応しているようですが、MVCではいくつかの例がありますが、「良い」古いコードを正しく起動して実行する方法を正しく示していないものがあります。
コードビハインドパターンは、教育だけでなく実験にも使いやすいです。それは、Web上の多数の紹介図書や学習資料に使用されています。それが理由です。
これらの例では、ウィンドウ、コントロール、画像とアイコンなどを含むコードビハインドのアプリケーションを作成する方法を示します。
アプリケーションの背後に新しいF＃WPFコードを作成します。
F＃コンソールアプリケーションを作成します。
アプリケーションの出力タイプをWindowsアプリケーションに変更します 。
FsXaml NuGetパッケージを追加します。
これらの4つのソースファイルをここに記載されている順序で追加します。
MainWindow.xaml
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="First Demo" Height="200" Width="300">
<Canvas>
<Button Name="btnTest" Content="Test" Canvas.Left="10" Canvas.Top="10" Height="28" Width="72"/>
</Canvas>
</Window>
MainWindow.xaml.fs
namespace FirstDemo
type MainWindowXaml = FsXaml.XAML<"MainWindow.xaml">
type MainWindow() as this =
inherit MainWindowXaml()
let whenLoaded _ =
()
let whenClosing _ =
()
let whenClosed _ =
()
let btnTestClick _ =
this.Title <- "Yup, it works!"
do
this.Loaded.Add whenLoaded
this.Closing.Add whenClosing
this.Closed.Add whenClosed
this.btnTest.Click.Add btnTestClick
App.xaml
<Application xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Application.Resources>
</Application.Resources>
</Application>
App.xaml.fs
namespace FirstDemo
open System
type App = FsXaml.XAML<"App.xaml">
module Main =
[<STAThread; EntryPoint>]
let main _ =
let app = App()
let mainWindow = new MainWindow()
app.Run(mainWindow) // Returns application's exit code.
プロジェクトからProgram.fsファイルを削除します。
2つのxamlファイルのBuild ActionをResourceに変更します。
.NETアセンブリUIAutomationTypesへの参照を追加します。
コンパイルして実行します。
デザイナを使用してイベントハンドラを追加することはできませんが、それはまったく問題にはなりません。この例の3つのハンドラ（テストボタンのハンドラを含む）のように、手動でコードを手動で追加してください。
更新：FsXamlにイベントハンドラを追加するための、おそらくよりエレガントな方法が追加されました。イベントハンドラはC＃と同じようにXAMLに追加できますが、手動で行う必要があります。その後、F＃タイプの対応するメンバをオーバーライドする必要があります。私はこれをお勧めします。
3：ウィンドウにアイコンを追加する
1つまたは複数のフォルダにすべてのアイコンと画像を保存することをお勧めします。
プロジェクトを右クリックし、F＃Power Tools / New Folderを使用してImagesという名前のフォルダを作成します。
ディスク上に、アイコンを新しいImagesフォルダに配置します。
Visual Studioに戻ってImagesを右クリックし、 Add / Existing Itemを使用して、 All Files（ 。 ）**を表示して、アイコンファイルを選択して追加することができます。
アイコンファイルを選択し、 Build ActionをResourceに設定します 。
MainWindow.xamlでは、このようなIcon属性を使用します。文脈のために周囲の線が示されている。
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="First Demo" Height="200" Width="300"
Icon="Images/MainWindow.ico">
<Canvas>
実行する前に、Buildだけでなく、Rebuildを実行します。これは、再ビルドしない限り、Visual Studioは常にアイコンファイルを実行可能ファイルに入れないためです。
アプリケーションではなくウィンドウで、アイコンが表示されます。実行時にウィンドウの左上にアイコンが表示され、タスクバーにそのアイコンが表示されます。タスクマネージャとWindowsファイルエクスプローラは、ウィンドウアイコンではなくアプリケーションアイコンを表示するため、このアイコンを表示しません。
4：アプリケーションにアイコンを追加する
次の内容のAppIcon.rcという名前のテキストファイルを作成します。
1 ICON "AppIcon.ico"
これを行うには、AppIcon.icoという名前のアイコンファイルが必要ですが、好きなように名前を調整することもできます。
次のコマンドを実行します。
"C:\Program Files (x86)\Windows Kits\10\bin\x64\rc.exe" /v AppIcon.rc
この場所にrc.exeが見つからない場合は、 C：¥Program Files（x86）¥Windows Kitsの下にあるrc.exeを探してください。それでも見つからない場合は、MicrosoftからWindows SDKをダウンロードしてください。
AppIcon.resという名前のファイルが生成されます。
Visual Studioで、プロジェクトのプロパティを開きます。 アプリケーションページを選択します。
リソースファイルというタイトルのテキストボックスにAppIcon.res （またはそこに配置する場合はImages \ AppIcon.res ）と入力し、プロジェクトプロパティを閉じて保存します。
「入力されたリソースファイルが存在しません。無視してください。エラーメッセージは再表示されません」というエラーメッセージが表示されます。
再構築する。実行可能ファイルにアプリケーションアイコンが表示され、ファイルエクスプローラに表示されます。実行中は、このアイコンもタスクマネージャに表示されます。
2：コントロールを追加する
メインウィンドウのファイルの上に、この2つのファイルをこの順序で追加します。
MyControl.xaml
<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d" Height="50" Width="150">
<Canvas Background="LightGreen">
<Button Name="btnMyTest" Content="My Test" Canvas.Left="10" Canvas.Top="10" Height="28" Width="106"/>
</Canvas>
</UserControl>
MyControl.xaml.fs
namespace FirstDemo
type MyControlXaml = FsXaml.XAML<"MyControl.xaml">
type MyControl() =
inherit MyControlXaml()
MyControl.xamlのビルドアクションをリソースに設定する必要があります。
もちろん、メインウィンドウの場合と同じように、MyControlの宣言に "this as"を追加する必要があります。
MainWindowクラスのMainWindow.xaml.fsファイルに次の行を追加します
let myControl = MyControl()
これらの2行をメインウィンドウクラスのdoセクションに追加します。
this.mainCanvas.Children.Add myControl |> ignore
myControl.btnMyTest.Content <- "We're in business!"
あるクラスに複数のdo -sectionが存在する可能性があり、たくさんのコードビハインドコードを書くときに必要になるでしょう。
コントロールは明るい緑色の背景色を与えられているので、どこにあるのかを簡単に確認できます。
コントロールがメインウィンドウのボタンを表示しないようにします。 WPFを一般的に教えることは、これらの例の範囲を超えているので、ここでは修正しません。
サードパーティのライブラリからコントロールを追加する方法
C＃WPFプロジェクトでサードパーティのライブラリからコントロールを追加すると、XAMLファイルには通常このような行があります。
xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
これはおそらくFsXamlでは動作しません。
デザイナーとコンパイラはその行を受け取りますが、実行時にXAMLを読み込んだときにサードパーティの型が見つからないと不平を言っている可能性があります。
代わりに次のようなものを試してみてください。
xmlns:xctk="clr-namespace:Xceed.Wpf.Toolkit;assembly=Xceed.Wpf.Toolkit"
これは、上記に依存するコントロールの例です。
<xctk:IntegerUpDown Name="tbInput" Increment="1" Maximum="10" Minimum="0" Canvas.Left="13" Canvas.Top="27" Width="270"/>
この例で使用されるライブラリは、Extended Wpf Toolkitであり、NuGetまたはインストーラとして無料で利用できます。 NuGetでライブラリをダウンロードした場合、コントロールはツールボックスで使用できませんが、XAMLで手動で追加するとデザイナに表示され、プロパティがプロパティペインに表示されます。