Bagikan melalui

Kumpulkan Tinta

  • Artikel

Platform Windows Presentation Foundation mengumpulkan tinta digital sebagai bagian inti dari fungsionalitasnya. Topik ini membahas metode untuk pengumpulan tinta di Windows Presentation Foundation (WPF).

Prasyarat

Untuk menggunakan contoh berikut, Anda harus terlebih dahulu menginstal Visual Studio dan Windows SDK. Anda juga harus memahami cara menulis aplikasi untuk WPF. Untuk informasi selengkapnya tentang memulai WPF, lihat Panduan: Aplikasi desktop WPF pertama saya.

Menggunakan Elemen InkCanvas

Elemen ini System.Windows.Controls.InkCanvas menyediakan cara term mudah untuk mengumpulkan tinta di WPF. InkCanvas Gunakan elemen untuk menerima dan menampilkan input tinta. Anda biasanya memasukkan tinta melalui penggunaan stylus, yang berinteraksi dengan digitizer untuk menghasilkan goresan tinta. Selain itu, mouse dapat digunakan sebagai pengganti stylus. Goresan yang dibuat direpresentasikan sebagai Stroke objek, dan dapat dimanipulasi baik secara terprogram maupun oleh input pengguna. memungkinkan InkCanvas pengguna untuk memilih, memodifikasi, atau menghapus .Stroke

Dengan menggunakan XAML, Anda dapat mengatur koleksi tinta semampu menambahkan elemen InkCanvas ke pohon Anda. Contoh berikut menambahkan ke proyek WPF default yang InkCanvas dibuat di Visual Studio:

<Grid>
  <InkCanvas/>
</Grid>

Elemen InkCanvas juga dapat berisi elemen turunan, sehingga memungkinkan untuk menambahkan kemampuan anotasi tinta ke hampir semua jenis elemen XAML. Misalnya, untuk menambahkan kemampuan penintaan ke elemen teks, cukup jadikan itu anak dari InkCanvas:

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

Menambahkan dukungan untuk menandai gambar dengan tinta sama mudahnya:

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

Mode InkCollection

menyediakan InkCanvas dukungan untuk berbagai mode input melalui propertinya EditingMode .

Memanipulasi Tinta

menyediakan InkCanvas dukungan untuk banyak operasi pengeditan tinta. Misalnya, InkCanvas mendukung penghapusan back-of-pen, dan tidak ada kode tambahan yang diperlukan untuk menambahkan fungsionalitas ke elemen .

Pilihan

Mengatur mode pemilihan semahal mengatur properti ke InkCanvasEditingModePilih.

Kode berikut mengatur mode pengeditan berdasarkan nilai 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

DrawingAttributes

DrawingAttributes Gunakan properti untuk mengubah tampilan goresan tinta. Misalnya, Color anggota DrawingAttributes mengatur warna yang dirender Stroke.

Contoh berikut mengubah warna goresan yang dipilih menjadi merah:

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

DefaultDrawingAttributes

Properti DefaultDrawingAttributes ini menyediakan akses ke properti seperti tinggi, lebar, dan warna goresan yang InkCanvasakan dibuat dalam . Setelah Anda mengubah DefaultDrawingAttributes, semua goresan di masa mendatang yang dimasukkan ke dalam InkCanvas dirender dengan nilai properti baru.

Selain memodifikasi DefaultDrawingAttributes dalam file code-behind, Anda dapat menggunakan sintaks XAML untuk menentukan DefaultDrawingAttributes properti.

Contoh berikutnya menunjukkan cara mengatur Color properti. Untuk menggunakan kode ini, buat proyek WPF baru yang disebut "HelloInkCanvas" di Visual Studio. Ganti kode dalam file MainWindow.xaml dengan kode berikut:

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

Selanjutnya, tambahkan penanganan aktivitas tombol berikut ke kode di belakang file, di dalam kelas 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;
}

Setelah menyalin kode ini, tekan F5 di Visual Studio untuk menjalankan program di debugger.

Perhatikan bagaimana StackPanel tombol-tombol di atas InkCanvas. Jika Anda mencoba tinta di atas tombol, InkCanvas mengumpulkan dan merender tinta di belakang tombol. Ini karena tombol adalah saudara kandung dari InkCanvas yang berlawanan dengan anak-anak. Selain itu, tombol lebih tinggi dalam urutan z, sehingga tinta dirender di belakangnya.

Baca juga