Samla bläck

Artikel
12/19/2024

Plattformen Windows Presentation Foundation samlar in digitalt bläck som en central del av dess funktionalitet. I det här avsnittet beskrivs insamlingsmetoder för bläck i Windows Presentation Foundation (WPF).

Förutsättningar

Om du vill använda följande exempel måste du först installera Visual Studio och Windows SDK. Du bör också förstå hur du skriver program för WPF. Mer information om hur du kommer igång med WPF finns i Genomgång: Mitt första WPF-skrivbordsprogram.

Använda InkCanvas-elementet

Elementet System.Windows.Controls.InkCanvas är det enklaste sättet att samla in bläck i WPF. Använd ett InkCanvas-element för att ta emot och visa bläckinmatning. Du matar ofta in bläck med hjälp av en penna, som interagerar med en digitaliserare för att skapa pennstreck. Dessutom kan en mus användas i stället för en penna. De skapade linjerna representeras som Stroke objekt, och de kan manipuleras både programmatiskt och med användarindata. Med InkCanvas kan användarna välja, ändra eller ta bort en befintlig Stroke.

Genom att använda XAML kan du konfigurera bläcksinsamling lika enkelt som att lägga till ett InkCanvas-element i trädet. I följande exempel läggs en InkCanvas till ett WPF-standardprojekt som skapats i Visual Studio:

<Grid>
  <InkCanvas/>
</Grid>

InkCanvas- element kan också innehålla underordnade element, vilket gör det möjligt att lägga till funktioner för pennanteckning i nästan alla typer av XAML-element. Om du till exempel vill lägga till ritfunktioner i ett textelement, ska du helt enkelt göra det till en underordnad komponent i en InkCanvas.

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

Det är lika enkelt att lägga till stöd för att markera en bild med pennanteckning:

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

Bläckinsamlingslägen

InkCanvas ger stöd för olika indatalägen via dess egenskap EditingMode.

Hantera bläck

InkCanvas har stöd för många pennanteckningsredigeringsåtgärder. InkCanvas har till exempel stöd för suddgummi på baksidan av pennan, och ingen ytterligare kod behövs för att lägga till denna funktionalitet i elementet.

Urval

Det är lika enkelt att ställa in markeringsläget som att ange egenskapen InkCanvasEditingMode till Välj.

Följande kod anger redigeringsläget baserat på värdet för en CheckBox:

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

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

Ritningsattribut

Använd egenskapen DrawingAttributes för att ändra utseendet på pennstreck. Till exempel anger Color medlem i DrawingAttributes färgen på den renderade Stroke.

I följande exempel ändras färgen på de markerade linjerna till röd:

// 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;
    }
}

' 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

Standardritningsattribut

Egenskapen DefaultDrawingAttributes ger åtkomst till egenskaper som höjd, bredd och färg för de linjer som ska skapas i en InkCanvas. När du har ändrat DefaultDrawingAttributes, återges alla framtida drag som anges i InkCanvas med de nya egenskapsvärdena.

Förutom att ändra DefaultDrawingAttributes i filen bakom koden kan du använda XAML-syntax för att ange DefaultDrawingAttributes egenskaper.

I nästa exempel visas hur du anger egenskapen Color. Om du vill använda den här koden skapar du ett nytt WPF-projekt med namnet "HelloInkCanvas" i Visual Studio. Ersätt koden i filen MainWindow.xaml med följande kod:

<Window x:Class="HelloInkCanvas.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://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>

Lägg sedan till följande knapphändelsehanterare i koden bakom filen i klassen MainWindow:

// 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;
}

När du har kopierat den här koden trycker du på F5- i Visual Studio för att köra programmet i felsökningsprogrammet.

Observera hur StackPanel placerar knapparna ovanpå InkCanvas. Om du försöker rita med bläck över knapparna, så samlar InkCanvas in och återger bläcket bakom knapparna. Detta beror på att knapparna är syskon till InkCanvas i stället för barn. Knapparna är också högre i z-ordningen, så pennanteckningen återges bakom dem.

Dela via