Mürekkep Topla

Makale
10/18/2023

Windows Presentation Foundation platformu, işlevselliğinin temel bir parçası olarak dijital mürekkep toplar. Bu konuda, Windows Presentation Foundation'da (WPF) mürekkep toplama yöntemleri açıklanmaktadır.

Ön koşullar

Aşağıdaki örnekleri kullanmak için önce Visual Studio'yu ve Windows SDK'sını yüklemeniz gerekir. WPF için uygulama yazmayı da anlamanız gerekir. WPF kullanmaya başlama hakkında daha fazla bilgi için bkz . İzlenecek yol: İlk WPF masaüstü uygulamam.

InkCanvas Öğesini Kullanma

öğesi WPF'de System.Windows.Controls.InkCanvas mürekkep toplamanın en kolay yolunu sağlar. Mürekkep girişini almak ve görüntülemek için bir InkCanvas öğe kullanın. Mürekkep vuruşları üretmek için bir basamaklandırıcıyla etkileşim kuran ekran kalemi kullanarak genellikle mürekkep girişi yapılır. Buna ek olarak, ekran kalemi yerine fare kullanılabilir. Oluşturulan vuruşlar nesne olarak Stroke temsil edilir ve hem program aracılığıyla hem de kullanıcı girişiyle değiştirilebilir. , InkCanvas kullanıcıların mevcut Strokebir öğesini seçmesine, değiştirmesine veya silmesine olanak tanır.

XAML kullanarak, ink koleksiyonunu, ağacınıza inkCanvas öğesi eklemek kadar kolay bir şekilde ayarlayabilirsiniz. Aşağıdaki örnek, Visual Studio'da oluşturulan varsayılan WPF projesine bir InkCanvas ekler:

<Grid>
  <InkCanvas/>
</Grid>

InkCanvas öğesi de alt öğeler içerebilir ve bu da neredeyse her tür XAML öğesine mürekkep ek açıklaması özellikleri eklemeyi mümkün hale getirir. Örneğin, bir metin öğesine mürekkep oluşturma özellikleri eklemek için bunu öğesinin InkCanvasalt öğesi yapmanız yeterlidir:

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

Bir görüntüyü mürekkeple işaretleme desteği eklemek de aynı şekilde kolaydır:

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

InkCollection Modları

InkCanvas özelliği aracılığıyla EditingMode çeşitli giriş modları için destek sağlar.

Mürekkep manipüle

, InkCanvas birçok mürekkep düzenleme işlemi için destek sağlar. Örneğin, InkCanvas kalem arkası silmeyi destekler ve öğeye işlevselliği eklemek için ek kod gerekmez.

Seçim

Seçim modunu ayarlamak, özelliği Seç olarak ayarlamak InkCanvasEditingMode kadar basittir.

Aşağıdaki kod, düzenleme modunu değerini CheckBoxtemel alarak ayarlar:

// 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 Mürekkep vuruşlarının görünümünü değiştirmek için özelliğini kullanın. Örneğin, öğesinin Color DrawingAttributes üyesi işlenen Strokeöğesinin rengini ayarlar.

Aşağıdaki örnek, seçili vuruşların rengini kırmızıya değiştirir:

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

özelliği, DefaultDrawingAttributes içinde InkCanvasoluşturulacak vuruşların yüksekliği, genişliği ve rengi gibi özelliklere erişim sağlar. değerini değiştirdiğinizde DefaultDrawingAttributes, içine InkCanvas girilen gelecekteki tüm vuruşlar yeni özellik değerleriyle işlenir.

Arka planda kod dosyasında öğesini değiştirmenin DefaultDrawingAttributes yanı sıra, özellikleri belirtmek DefaultDrawingAttributes için XAML söz dizimini kullanabilirsiniz.

Sonraki örnekte özelliğin nasıl ayarlanacağı gösterilmektedir Color . Bu kodu kullanmak için Visual Studio'da "HelloInkCanvas" adlı yeni bir WPF projesi oluşturun. MainWindow.xaml dosyasındaki kodu aşağıdaki kodla değiştirin:

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

Ardından aşağıdaki düğme olay işleyicilerini MainWindow sınıfının içindeki dosyanın arkasındaki koda ekleyin:

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

Bu kodu kopyaladıktan sonra Visual Studio'da F5 tuşuna basarak programı hata ayıklayıcıda çalıştırın.

Düğmelerin öğesinin StackPanel üzerine nasıl yerleştirenlere InkCanvasdikkat edin. Düğmelerin üst kısmında mürekkep oluşturmaya çalışırsanız, InkCanvas mürekkep düğmelerin arkasında toplanır ve işlenir. Bunun nedeni düğmelerin çocuklara göre eşdüzey InkCanvas olmasıdır. Ayrıca, düğmeler z düzeninde daha yüksektir, bu nedenle mürekkep arkalarında işlenir.

Aracılığıyla paylaş