F#
1: F # Код WPF для приложения с FsXaml
Поиск…
Вступление
Большинство примеров, найденных для программирования F # WPF, похоже, имеют отношение к шаблону MVVM, а некоторые из них - MVC, но рядом нет ни одного, который правильно показывает, как встать и работать с «старым старым» кодом.
Код за рисунком очень прост в использовании для обучения, а также экспериментов. Он используется в многочисленных вводных книгах и учебных материалах в Интернете. Вот почему.
Эти примеры продемонстрируют, как создать код за приложением с окнами, элементами управления, изображениями и значками и т. Д.
Создайте новый код WPF F # для приложения.
Создайте консольное приложение F #.
Измените тип вывода приложения на приложение Windows .
Добавьте пакет FsXaml NuGet.
Добавьте эти четыре исходных файла в порядке, указанном здесь.
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 из проекта.
Измените действие сборки на ресурс для двух файлов xaml.
Добавьте ссылку на сборку UIAutomationTypes сборки .NET.
Скомпилируйте и запустите.
Вы не можете использовать конструктор для добавления обработчиков событий, но это совсем не проблема. Просто добавьте их вручную в код позади, как вы видите с тремя обработчиками в этом примере, включая обработчик тестовой кнопки.
UPDATE: в FsXaml добавлен альтернативный и, возможно, более элегантный способ добавления обработчиков событий. Вы можете добавить обработчик событий в XAML, как и в C #, но вы должны сделать это вручную, а затем переопределить соответствующий член, который появляется в вашем F #. Я рекомендую это.
3: добавление значка в окно
Рекомендуется сохранять все значки и изображения в одной или нескольких папках.
Щелкните правой кнопкой мыши по проекту и используйте F # Power Tools / New Folder для создания папки с именем «Изображения».
На диске поместите значок в папку «Новые изображения ».
Вернитесь в Visual Studio, щелкните правой кнопкой мыши по изображению и используйте « Добавить / существующий элемент» , а затем отобразите « Все файлы» ( . ) **, чтобы увидеть файл значка, чтобы его можно было выбрать, а затем « Добавить» .
Выберите файл значка и установите его действие «Построение» в « Ресурс» .
В MainWindow.xaml используйте атрибут Icon как это. Окружающие линии показаны для контекста.
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="First Demo" Height="200" Width="300"
Icon="Images/MainWindow.ico">
<Canvas>
Перед тем, как запустить, выполните перестройку, а не просто сборку. Это связано с тем, что 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 . Если вы все еще не можете найти его, загрузите Windows SDK из Microsoft.
Будет создан файл с именем AppIcon.res.
В Visual Studio откройте свойства проекта. Выберите страницу приложения .
В текстовом поле « Файл ресурсов» введите AppIcon.res (или Images \ AppIcon.res, если вы положили его там), а затем закройте свойства проекта для сохранения.
Появится сообщение об ошибке: «Введенный файл ресурсов не существует. Игнорируйте это. Сообщение об ошибке не появится снова.
Перестроить. Затем исполняемый файл имеет значок приложения, и это отображается в Проводнике. При запуске этот значок также появится в диспетчере задач.
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()
Для Action для MyControl.xaml должен быть установлен ресурс .
Вы, конечно, позже должны добавить «как это» в объявление MyControl, как это сделано для главного окна.
В файле MainWindow.xaml.fs в классе для MainWindow добавьте эту строку
let myControl = MyControl()
и добавьте эти две строки в do- section основного класса окна.
this.mainCanvas.Children.Add myControl |> ignore
myControl.btnMyTest.Content <- "We're in business!"
Там может быть более чем один сделать -сече- в классе, и вы, вероятно, понадобится при написании много кода за кодом.
Элемент управления получил светло-зеленый цвет фона, так что вы можете легко увидеть, где он находится.
Имейте в виду, что элемент управления заблокирует кнопку главного окна из представления. Это не входит в объем этих примеров, чтобы научить вас 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"/>
Библиотека, используемая в этом примере, - это расширенный набор инструментов Wpf, доступный бесплатно через NuGet или установщик. Если вы загружаете библиотеки через NuGet, элементы управления недоступны в панели инструментов, но они все еще отображаются в дизайнере, если вы добавите их вручную в XAML, а свойства доступны на панели «Свойства».