收集筆墨

更新：2007 年 11 月

Windows Presentation Foundation 平台會收集數位筆墨，做為其中一部分的核心功能。這個主題將討論 Windows Presentation Foundation (WPF) 中的筆墨收集方法。

必要條件

您必須先安裝 Microsoft Visual Studio 2005 和 Windows SDK，才能使用下列範例。也應該了解如何撰寫 WPF 的應用程式。如需開始使用 WPF 的詳細資訊，請參閱 Windows Presentation Foundation 使用者入門。

使用 InkCanvas 項目

InkCanvas 項目會提供在 WPF 中收集筆墨最簡易的方法。InkCanvas 項目與 Tablet PC SDK 1.7 和較早版本中的 InkOverlay 物件類似。

使用 InkCanvas 項目以接收和顯示筆墨輸入。您通常是使用手寫筆來輸入筆墨，這會與數位板互動而產生筆墨筆劃。此外，滑鼠也用來代替手寫筆。建立的筆劃表示為 Stroke 物件，且可以應由程式設計和使用者輸入加以操作。InkCanvas可讓使用者選取、修改或刪除現有的 Stroke。

透過使用 XAML，您可以設定筆墨集合，就像將 InkCanvas 項目加入至樹狀目錄一樣輕鬆。下列範例會將 InkCanvas 加入在 Microsoft Visual Studio 2005 中建立的預設 WPF 專案。

<Grid>
  <InkCanvas/>
</Grid>

InkCanvas 項目也可以包含子項目，以便將筆墨附註加入至幾乎所有類型的 XAML 項目。例如，如果要將筆墨功能加入至文字項目，只要將之設為 InkCanvas 的子系即可。

<InkCanvas>
  <TextBlock>Show text here.</TextBlock>
</InkCanvas>

使用筆墨支援產生影像的作法也一樣簡單。

<InkCanvas>
  <Image Source="myPicture.jpg"/>
</InkCanvas>

InkCollection 模式

InkCanvas 透過其 EditingMode 屬性提供對各種輸入模式的支援。

操作筆墨

InkCanvas 提供對許多筆墨編輯作業的支援。例如，InkCanvas 支援畫筆背面清除功能，且不需要額外的程式碼，即可將功能加入至項目中。

選取

設定選取模式就像將 InkCanvasEditingMode 屬性設定為 Select 一樣簡單。下列程式碼會根據 CheckBox 的值設定編輯模式：

' Set the selection mode based on a checkbox
If CBool(cbSelectionMode.IsChecked) Then
    theInkCanvas.EditingMode = InkCanvasEditingMode.Select
Else
    theInkCanvas.EditingMode = InkCanvasEditingMode.Ink
End If

// Set the selection mode based on a checkbox
if ((bool)cbSelectionMode.IsChecked)
{
    theInkCanvas.EditingMode = InkCanvasEditingMode.Select;
}
else
{
    theInkCanvas.EditingMode = InkCanvasEditingMode.Ink;
}

DrawingAttributes

使用 DrawingAttributes 屬性變更筆墨筆劃的外觀。例如，DrawingAttributes 的 Color 成員會設定所呈現之 Stroke 的色彩。下列範例會將選取之筆劃的色彩變更為紅色。

' Get the selected strokes from the InkCanvas
Dim selection As StrokeCollection = theInkCanvas.GetSelectedStrokes()

' Check to see if any strokes are actually selected
If selection.Count > 0 Then
    ' Change the color of each stroke in the collection to red
    Dim stroke As System.Windows.Ink.Stroke
    For Each stroke In  selection
        stroke.DrawingAttributes.Color = System.Windows.Media.Colors.Red
    Next stroke
End If

// Get the selected strokes from the InkCanvas
StrokeCollection selection = theInkCanvas.GetSelectedStrokes();

// Check to see if any strokes are actually selected
if (selection.Count > 0)
{
    // Change the color of each stroke in the collection to red
    foreach (System.Windows.Ink.Stroke stroke in selection)
    {
        stroke.DrawingAttributes.Color = System.Windows.Media.Colors.Red;
    }
}

DefaultDrawingAttributes

DefaultDrawingAttributes 屬性會提供要在 InkCanvas 中建立之筆劃的屬性 (例如，高度、寬度和色彩)。變更 DefaultDrawingAttributes 之後，所有在未來輸入 InkCanvas 的筆劃都會以新的屬性值呈現。

除了在程式碼後置檔案中修改 DefaultDrawingAttributes 之外，您也可以使用 XAML 語法來指定 DefaultDrawingAttributes 屬性。下列 XAML 程式碼會示範如何設定 Color 屬性。若要使用這個程式碼，請在 Visual Studio 2005 中建立名為 "HelloInkCanvas" WPF 的新專案。使用下列程式碼取代 Window1.xaml 檔案中的程式碼。

<Window x:Class="Window1"
    xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:Ink="clr-namespace:System.Windows.Ink;assembly=PresentationCore"
    Title="Hello, InkCanvas!" Height="300" Width="300"
    >
  <Grid>
    <InkCanvas Name="inkCanvas1" Background="Ivory">
      <InkCanvas.DefaultDrawingAttributes>
        <Ink:DrawingAttributes xmlns:ink="system-windows-ink" Color="Red" Width="5" />
      </InkCanvas.DefaultDrawingAttributes>

    </InkCanvas>

    <!-- This stack panel of buttons is a sibling to InkCanvas (not a child) but overlapping it, 
         higher in z-order, so that ink is collected and rendered behind -->
    <StackPanel Name="buttonBar" VerticalAlignment="Top" Height="26" Orientation="Horizontal" Margin="5">
      <Button Click="Ink">Ink</Button>
      <Button Click="Highlight">Highlight</Button>
      <Button Click="EraseStroke">EraseStroke</Button>
      <Button Click="Select">Select</Button>
    </StackPanel>
  </Grid>
</Window>

<Window x:Class="HelloInkCanvas.Window1"
    xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:Ink="clr-namespace:System.Windows.Ink;assembly=PresentationCore"
    Title="Hello, InkCanvas!" Height="300" Width="300"
    >
  <Grid>
    <InkCanvas Name="inkCanvas1" Background="Ivory">
      <InkCanvas.DefaultDrawingAttributes>
        <Ink:DrawingAttributes xmlns:ink="system-windows-ink" Color="Red" Width="5" />
      </InkCanvas.DefaultDrawingAttributes>
    </InkCanvas>

    <!-- This stack panel of buttons is a sibling to InkCanvas (not a child) but overlapping it, 
         higher in z-order, so that ink is collected and rendered behind -->
    <StackPanel Name="buttonBar" VerticalAlignment="Top" Height="26" Orientation="Horizontal" Margin="5">
      <Button Click="Ink">Ink</Button>
      <Button Click="Highlight">Highlight</Button>
      <Button Click="EraseStroke">EraseStroke</Button>
      <Button Click="Select">Select</Button>
    </StackPanel>
  </Grid>
</Window>

接下來，將下列按鈕事件處理常式加入至 Window1 類別內的程式碼後置檔案。

' Set the EditingMode to ink input.
Private Sub Ink(ByVal sender As Object, ByVal e As RoutedEventArgs) 

    inkCanvas1.EditingMode = InkCanvasEditingMode.Ink

    ' Set the DefaultDrawingAttributes for a red pen.
    inkCanvas1.DefaultDrawingAttributes.Color = Colors.Red
    inkCanvas1.DefaultDrawingAttributes.IsHighlighter = False
    inkCanvas1.DefaultDrawingAttributes.Height = 2

End Sub 'Ink

' Set the EditingMode to highlighter input.
Private Sub Highlight(ByVal sender As Object, ByVal e As RoutedEventArgs) 

    inkCanvas1.EditingMode = InkCanvasEditingMode.Ink

    ' Set the DefaultDrawingAttributes for a highlighter pen.
    inkCanvas1.DefaultDrawingAttributes.Color = Colors.Yellow
    inkCanvas1.DefaultDrawingAttributes.IsHighlighter = True
    inkCanvas1.DefaultDrawingAttributes.Height = 25

End Sub 'Highlight


' Set the EditingMode to erase by stroke.
Private Sub EraseStroke(ByVal sender As Object, ByVal e As RoutedEventArgs) 

    inkCanvas1.EditingMode = InkCanvasEditingMode.EraseByStroke

End Sub 'EraseStroke

' Set the EditingMode to selection.
Private Sub [Select](ByVal sender As Object, ByVal e As RoutedEventArgs) 

    inkCanvas1.EditingMode = InkCanvasEditingMode.Select

End Sub 'Select

// Set the EditingMode to ink input.
private void Ink(object sender, RoutedEventArgs e)
{
    inkCanvas1.EditingMode = InkCanvasEditingMode.Ink;

    // Set the DefaultDrawingAttributes for a red pen.
    inkCanvas1.DefaultDrawingAttributes.Color = Colors.Red;
    inkCanvas1.DefaultDrawingAttributes.IsHighlighter = false;
    inkCanvas1.DefaultDrawingAttributes.Height = 2;
}

// Set the EditingMode to highlighter input.
private void Highlight(object sender, RoutedEventArgs e)
{
    inkCanvas1.EditingMode = InkCanvasEditingMode.Ink;

    // Set the DefaultDrawingAttributes for a highlighter pen.
    inkCanvas1.DefaultDrawingAttributes.Color = Colors.Yellow;
    inkCanvas1.DefaultDrawingAttributes.IsHighlighter = true;
    inkCanvas1.DefaultDrawingAttributes.Height = 25;
}

// Set the EditingMode to erase by stroke.
private void EraseStroke(object sender, RoutedEventArgs e)
{
    inkCanvas1.EditingMode = InkCanvasEditingMode.EraseByStroke;
}

// Set the EditingMode to selection.
private void Select(object sender, RoutedEventArgs e)
{
    inkCanvas1.EditingMode = InkCanvasEditingMode.Select;
}

複製這個程式碼之後，請按下 Microsoft Visual Studio 2005 中的 F5 在偵錯工具中執行程式。

請注意 StackPanel 在 InkCanvas 頂端放置按鈕的方式。如果您想在按鈕頂端加上筆墨，InkCanvas 便會收集和呈現按鈕後面的筆墨。這是因為按鈕和 InkCanvas 屬於同層級，而與子系相反。此外，按鈕會處於疊置順序中的較高位置，因此筆墨會在按鈕後面呈現。

請參閱

參考

DrawingAttributes

DefaultDrawingAttributes()

System.Windows.Ink