Aan de slag met Inkt in WPF

Windows Presentation Foundation (WPF) heeft een inktfunctie waarmee u eenvoudig digitale inkt in uw app kunt opnemen.

Vereiste voorwaarden

Als u de volgende voorbeelden wilt gebruiken, installeert u eerst Visual Studio. Het helpt ook om te weten hoe u eenvoudige WPF-apps schrijft. Zie Walkthrough: Mijn eerste WPF-bureaubladtoepassing voor hulp bij het aan de slag gaan met WPF.

Snel aan de slag

Deze sectie helpt u bij het schrijven van een eenvoudige WPF-toepassing waarmee inkt wordt verzameld.

Inkt nodig?

Een WPF-app maken die inkt ondersteunt:

1. Open Visual Studio.

2. Maak een nieuwe WPF-app.

   Vouw in het dialoogvenster Nieuw project de categorie Geïnstalleerde>Visual C# of Visual Basic>Windows Desktop uit. Selecteer vervolgens de WPF-appsjabloon (.NET Framework). Voer een naam in en selecteer VERVOLGENS OK.

   Visual Studio maakt het project en MainWindow.xaml wordt geopend in de ontwerpfunctie.

3. Typ <InkCanvas/> tussen de <Grid> tags.

   

4. Druk op F5 om uw toepassing te starten in het foutopsporingsprogramma.

5. Schrijf hallo wereld in het venster met behulp van een stylus of muis.

U hebt het inktequivalent van een 'hallo wereld'-toepassing geschreven met slechts 12 toetsaanslagen!

Verlevendig uw app

Laten we profiteren van enkele functies van de WPF. Vervang alles tussen de venstertags openen en sluiten <> door de volgende markeringen:

<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>

Deze XAML creëert een achtergrond met kleurovergangen op het inktoppervlak.

Code achter de XAML toevoegen

Hoewel XAML het heel eenvoudig maakt om de gebruikersinterface te ontwerpen, moet elke echte toepassing code toevoegen om gebeurtenissen te verwerken. Hier volgt een eenvoudig voorbeeld waarin wordt ingezoomd op de inkt als reactie op een muisklik met de rechtermuisknop.

1. Stel de MouseRightButtonUp handler in uw XAML in:

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

2. In Solution Explorer vouw je MainWindow.xaml uit en open je vervolgens het code-behind-bestand (MainWindow.xaml.cs of MainWindow.xaml.vb). Voeg de volgende gebeurtenis-handlercode toe:

   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
   

3. Voer de toepassing uit. Voeg wat inkt toe en klik met de rechtermuisknop of voer een drukken en vasthouden met een stylus uit.

   De weergave zoomt in telkens wanneer u met de rechtermuisknop klikt.

Procedurele code gebruiken in plaats van XAML

U kunt alle WPF-functies openen vanuit procedurele code. Volg deze stappen om een 'Hello Ink World'-toepassing te maken voor WPF die helemaal geen XAML gebruikt.

1. Maak een nieuw consoletoepassingsproject in Visual Studio.

   Vouw in het dialoogvenster Nieuw project de categorie Geïnstalleerde>Visual C# of Visual Basic>Windows Desktop uit. Selecteer vervolgens de console-app-sjabloon (.NET Framework). Voer een naam in en selecteer VERVOLGENS OK.

2. Plak de volgende code in het bestand Program.cs of 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
   

3. Voeg verwijzingen toe aan de assembly's PresentationCore, PresentationFramework en WindowsBase door met de rechtermuisknop op Verwijzingen in Solution Explorer te klikken en Verwijzing toevoegen te kiezen.

   

4. Bouw de toepassing door op F5 te drukken.

Zie ook

• Digitale inkt
• inkt verzamelen
• handschriftherkenning
• Opslaan van Inkt