開始在 WPF 中使用數位筆跡

發行項
12/18/2024

Windows Presentation Foundation (WPF) 具備數位筆跡功能，可輕鬆地將數位筆跡整合進應用程式中。

必要條件

若要練習以下範例，請先安裝 Visual Studio。 Visual Studio 亦有助於瞭解如何撰寫基本的 WPF 應用程式。如需開始使用 WPF 的相關資訊，請參閱逐步解說︰我的第一個 WPF 桌面應用程式。

快速入門

本節將協助您撰寫一個簡單的 WPF 應用程式，以收集數位筆跡。

要收集數位筆跡嗎？

若要建立支援數位筆跡的 WPF 應用程式：

開啟 Visual Studio。
建立新的 WPF 應用程式。

在新增專案對話中，展開已安裝> Visual C# 或 Visual Basic >Windows 桌面類別。然後選取 WPF 應用程式 (.NET Framework) 應用程式範本。輸入名稱，然後選取確定。

Visual Studio 會建立專案，並在設計工具中開啟 MainWindow.xaml。
在標籤 <Grid> 之間輸入 <InkCanvas/>。

具備數位筆跡畫布標籤的 XAML 設計工具
按下 F5，可在偵錯工具中啟動應用程式。
使用手寫筆或滑鼠，在視窗裡寫下 Hello World。

您只用手寫筆/滑鼠劃下 12 道筆跡，就寫出相當於「Hello World」應用程式的成品!

為您的應用程式增添色彩

來看看 WPF 還有哪些功能。以下列標記取代開啟和關閉<視窗>標籤之間的所有內容：

<Page>
  <InkCanvas Name="myInkCanvas" MouseRightButtonUp="RightMouseUpHandler">
    <InkCanvas.Background>
      <LinearGradientBrush>
        <GradientStop Color="Yellow" Offset="0.0" />
          <GradientStop Color="Blue" Offset="0.5" />
            <GradientStop Color="HotPink" Offset="1.0" />
              </LinearGradientBrush>
    </InkCanvas.Background>
  </InkCanvas>
</Page>

此 XAML 會在手寫介面上建立漸層筆刷背景。

Gradient colors on inking surface in WPF app 在 WPF 應用程式的手寫介面加上漸層色彩

在 XAML 後新增一些程式碼

雖然 XAML 可讓設計使用者介面變得非常容易，但任何真實的應用程式都必須新增程式碼來處理事件。以下為以滑鼠右鍵按一下即可放大數位筆跡的簡單範例。

在 XAML 中設定 MouseRightButtonUp 控制碼：

<InkCanvas Name="myInkCanvas" MouseRightButtonUp="RightMouseUpHandler">

在方案總管中，展開 MainWindow.xaml 並開啟程式碼後置檔 (MainWindow.xaml.cs 或 MainWindow.xaml.vb)。新增以下事件控制程式碼：

private void RightMouseUpHandler(object sender,
                                 System.Windows.Input.MouseButtonEventArgs e)
{
    Matrix m = new Matrix();
    m.Scale(1.1d, 1.1d);
    ((InkCanvas)sender).Strokes.Transform(m, true);
}

Private Sub RightMouseUpHandler(ByVal sender As Object, _
                                ByVal e As System.Windows.Input.MouseButtonEventArgs)

    Dim m As New Matrix()
    m.Scale(1.1, 1.1)
    CType(sender, InkCanvas).Strokes.Transform(m, True)

End Sub

執行應用程式。再用手寫筆/滑鼠寫點東西，然後以滑鼠右鍵對著寫下的筆跡按一下，或以手寫筆上有相同功能的按鈕對著寫下的筆跡按住不放。

每次以滑鼠右鍵按一下時，顯示目標都會放大。

使用程序性程式碼取代 XAML

程序性程式碼可存取所有 WPF 功能。按照以下步驟為 WPF 建立「Hello Ink World」應用程式，過程中完全不使用 XAML。

在 Visual Studio 中建立新的主控台應用程式專案。

在新增專案對話中，展開已安裝> Visual C# 或 Visual Basic >Windows 桌面類別。然後選取主控台應用程式 (.NET Framework) 應用程式範本。輸入名稱，然後選取確定。

將下列程式碼貼到 Program.cs 或 Program.vb 檔中：

using System;
using System.Windows;
using System.Windows.Controls;
class Program : Application
{
    Window win;
    InkCanvas ic;

    protected override void OnStartup(StartupEventArgs args)
    {
        base.OnStartup(args);
        win = new Window();
        ic = new InkCanvas();
        win.Content = ic;
        win.Show();
    }

    [STAThread]
    static void Main(string[] args)
    {
        new Program().Run();
    }
}

Imports System.Windows
Imports System.Windows.Controls


Class Program
    Inherits Application
    Private win As Window
    Private ic As InkCanvas


    Protected Overrides Sub OnStartup(ByVal args As StartupEventArgs)
        MyBase.OnStartup(args)
        win = New Window()
        ic = New InkCanvas()
        win.Content = ic
        win.Show()

    End Sub

End Class

Module Module1

    Sub Main()
        Dim prog As New Program()
        prog.Run()

    End Sub

End Module

在方案總管中的參考上按一下滑鼠右鍵，然後選取新增參考，即可為 PresentationCore、PresentationFramework 和 WindowsBase 組件新增參考。

顯示 PresentationCore 和 PresentationFramework 的參考管理員
按下 F5，組建應用程式。

共用方式為