F#
1 : F # WPF 코드 FsXaml 응용 프로그램 뒤에

소개

응용 프로그램 뒤에 새로운 F # WPF 코드를 만듭니다.

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 파일에 대해 Build Action 을 Resource 로 변경하십시오.

.NET 어셈블리 UIAutomationTypes에 대한 참조를 추가하십시오.

컴파일하고 실행하십시오.

디자이너를 사용하여 이벤트 처리기를 추가 할 수는 없지만 전혀 문제가되지 않습니다. 이 예제의 세 개의 핸들러 (테스트 버튼 핸들러 포함)에서 볼 수있는 것처럼 코드 뒤에 수동으로 코드를 추가하기 만하면됩니다.

업데이트 : FsXaml에 이벤트 처리기를 추가하는 또 다른 방법이 추가되었습니다. C #에서와 마찬가지로 XAML에서 이벤트 핸들러를 추가 할 수 있지만 수동으로 수행 한 다음 F # 유형으로 표시되는 해당 멤버를 재정의해야합니다. 나는 이것을 추천한다.

3 : 창에 아이콘 추가

모든 아이콘과 이미지를 하나 이상의 폴더에 보관하는 것이 좋습니다.

프로젝트를 마우스 오른쪽 버튼으로 클릭하고 F # Power Tools / New Folder를 사용하여 Images라는 폴더를 만듭니다.

디스크에 아이콘을 새 Images 폴더에 놓습니다.

Visual Studio로 돌아가서 이미지를 마우스 오른쪽 단추로 클릭하고 항목 추가 / 기존 항목 을 사용한 다음 모든 파일 표시 ( . ) **를 클릭하여 아이콘 파일을보고 선택할 수 있도록 표시 한 다음 추가 합니다.

아이콘 파일을 선택하고 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 키트 아래에서 rc.exe를 검색하십시오. 그래도 찾을 수 없으면 Microsoft에서 Windows SDK를 다운로드하십시오.

AppIcon.res라는 파일이 생성됩니다.

Visual Studio에서 프로젝트 속성을 엽니 다. 응용 프로그램 페이지를 선택하십시오.

리소스 파일 이라는 텍스트 상자에 AppIcon.res (또는 거기에 이미지 / 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()

MyControl.xaml에 대한 Build Action 은 Resource 로 설정되어야합니다.

물론 나중에 메인 윈도우에서와 마찬가지로 MyControl 선언에 "this as"를 추가해야합니다.

MainWindow 클래스의 MainWindow.xaml.fs 파일에서이 줄을 추가하십시오.

let myControl = MyControl()

메인 윈도우 클래스의 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"/>

이 예제에서 사용 된 라이브러리는 NuGet 또는 설치 프로그램을 통해 무료로 사용할 수있는 Extended Wpf Toolkit입니다. NuGet을 통해 라이브러리를 다운로드하면 도구 상자에서 해당 컨트롤을 사용할 수 없지만 XAML에서 수동으로 컨트롤을 추가하면 해당 컨트롤이 여전히 디자이너에 표시되며 속성은 속성 창에서 사용할 수 있습니다.