World War I Windows 10 (61) and World War I 61

World War I Windows 10 (61) and World War I 61

[Download source code]

Backwater world war I Windows 10 (61)-Controls (media class): InkCanvas graffiti editing

Author: webabcd


Introduction
Controls for Windows 10 (Media)

• InkCanvas graffiti editing

Example
Demonstrate operations related to InkCanvas graffiti board editing
Controls/MediaControl/InkCanvasDemo2.xaml

<Page x: Class = "Windows10.Controls. MediaControl. InkCanvasDemo2" xmlns =" http://schemas.microsoft.com/winfx/2006/xaml /Presentation "xmlns: x =" http://schemas.microsoft.com/winfx/2006/xaml "Xmlns: local =" using: Windows10.Controls. MediaControl "xmlns: d =" http://schemas.microsoft.com/expression/blend/2008 "Xmlns: mc =" http://schemas.openxmlformats.org/markup-compatibility/2006 "Mc: ignorable = "d"> <Grid Background = "Transparent"> <StackPanel Margin = "10 0 10"> <Grid Background = "White" Width = "480" Height =" 320 "Margin =" 5 "HorizontalAlignment =" Left "> <! -- Canvas-used to draw the selected box in this example (right-click the box in this example to draw) --> <Canvas Name = "selectionCanvas"/> <! -- InkCanvas-graffiti control --> <InkCanvas Name = "inkCanvas"/> </Grid> <Button Name = "clear" Content = "clear all graffiti" Margin = "5" Click = "clear_Click"/> <Button Name = "cut" Content = "cut selected graffiti to clipboard" Margin = "5" Click = "cut_Click"/> <Button Name = "copy "Content =" Copy selected graffiti to clipboard "Margin =" 5 "Click =" copy_Click "/> <Button Name =" paste "Content =" paste graffiti from clipboard "Margin =" 5 "Click =" paste_Click "/> <Button Name =" move "Content =" move selected graffiti "Margin =" 5 "Click =" move_Click "/> <Button Name =" cloneAll "Content =" clone all graffiti "Margin =" 5 "Click =" cloneAll_Click "/> <Button Name =" selectAll "Content =" select all graffiti "Margin =" 5" click = "selectAll_Click"/> <Button Name = "changeColor" Content = "change the color of all graffiti" Margin = "5" Click = "changeColor_Click"/> </StackPanel> </Grid> </Page>

Controls/MediaControl/InkCanvasDemo2.xaml. cs

/** InkCanvas-graffiti control (inherited from FrameworkElement, see/Controls/BaseControl/FrameworkElementDemo /) * InkPresenter-get the InkPresenter object ** InkPresenter-graffiti Board * StrokeContainer-return the InkStrokeContainer type object * InputProcessingConfiguration. rightDragAction-enter the graffiti button * AllowProcessing-all buttons can be used for graffiti, such as the left and right mouse buttons can be used for graffiti. The default value is * LeaveUnprocessed-special keys cannot be used for graffiti. For example, the right-click of the mouse cannot be used for graffiti * UnprocessedInput-some events used to listen to pointers * PointerEntered, PointerExited, PointerHovered, pointermov, pointerReleased-some events as the name suggests * Note: When InputProcessingConfiguration. when RightDragAction is set to AllowProcessing, only PointerEntered, PointerExited, and PointerHovered events * SetPredefinedConfiguration (InkPresenterPredefinedConfiguration value) are triggered) -Set graffiti behavior (SimpleSinglePointer-single touch point graffiti; SimpleMultiplePointer-multi-touch point graffiti) * StrokesCollected-events triggered when one or more InkStroke are drawn * StrokesErased-events triggered when one or more InkStroke are erased * StrokeInput-used to listen to some graffiti events * strokeStarted, strokeEnded, StrokeContinued, StrokeCanceled-some events as the name suggests ** InkStrokeContainer-used to manage graffiti * GetStrokes () -Get all InkStroke object sets * BoundingRect-Get Rect region of all InkStroke objects of the current graffiti Board * Clear () -Clear all graffiti * SelectWithLine (Point from, Point to)-return the Rect area of the graffiti in the specified diagonal line * SelectWithPolyLine (IEnumerable <Point> polyline) -Return the Rect area of the graffiti in the specified Polyline * CopySelectedToClipboard ()-copy the selected graffiti to the clipboard * CanPasteFromClipboard ()-check whether graffiti data exists in the clipboard * PasteFromClipboard (Point position) -paste the graffiti from the clipboard to the specified position, and return the Rect area * MoveSelected (Point translation) of the graffiti to the specified offset, and move the selected graffiti, the returned result is the Rect area of the moved graffiti * DeleteSelected ()- Delete the selected graffiti and return the Rect area * AddStroke (InkStroke stroke) of the graffiti to be deleted-draw the specified InkStroke object * AddStrokes (IEnumerable <InkStroke> strokes) on the graffiti board) -Draw the specified InkStroke object set ** InkStroke-graffiti object on the graffiti Board (this is a graffiti object, that is, move the graffiti after the mouse is pressed and then lift it up) * BoundingRect-obtain the Rect region of the current InkStroke * DrawingAttributes-graffiti tip attribute (see InkCanvasDemo1.xaml. cs) * PointTransform-Matrix3x2 used to convert the InkStroke affine conversion matrix (Matrix3x2 provides some simple methods: CreateRotation AteScale, CreateSkew, CreateTranslation, etc.) * Selected-select * Clone ()-Clone a copy, return the cloned InkStroke object * GetInkPoints (), GetRenderingSegments () -Used to obtain the data of a bunch of beiser curves that make up InkStroke. *** Note: There are wet and dry data in InkCanvas) * The so-called "wet" refers to the graffiti drawn before the mouse is lifted. * The so-called "dry" refers to the graffiti drawn before the mouse is lifted, graffiti that are actually displayed on InkCanvas (you can move the mouse up to customize wet and then dry it to InkCanvas) * how do you customize the processing between wet and dry? The InkSynchronizer object needs to be obtained through the ActivateCustomDrying () method of InkPresenter. The specific example will be followed by the introduction of Win2D */using Windows. foundation; using Windows. UI; using Windows. UI. core; using Windows. UI. input. inking; using Windows. UI. xaml; using Windows. UI. xaml. controls; using Windows. UI. xaml. media; using Windows. UI. xaml. shapes; using System. linq; using System. collections. generic; using System; namespace Windows10.Controls. mediaControl {public sealed partial class InkCanvasDemo2: Page {// right-click the track (used to select graffiti) private Polyline _ polyline; // The Rect region of the selected graffiti private Rect _ rect; public InkCanvasDemo2 () {this. initializeComponent (); inkCanvas. inkPresenter. inputDeviceTypes = CoreInputDeviceTypes. mouse | CoreInputDeviceTypes. pen | CoreInputDeviceTypes. touch; InkDrawingAttributes drawingAttributes = inkCanvas. inkPresenter. copyDefaultDrawingAttributes (); drawingAttributes. ignorePressure = true; drawingAttributes. color = Colors. red; drawingAttributes. size = new Size (4, 4); inkCanvas. inkPresenter. updatedefadradrawingattributes (drawingAttributes); // This setting is used to disable the graffiti function of the right mouse button, so as to enable the inkCanvas function of selecting graffiti by right mouse. inkPresenter. inputProcessingConfiguration. rightDragAction = InkInputRightDragAction. leaveUnprocessed; inkCanvas. inkPresenter. unprocessedInput. pointerPressed + = UnprocessedInput_PointerPressed; inkCanvas. inkPresenter. unprocessedInput. pointerMoved + = UnprocessedInput_PointerMoved; inkCanvas. inkPresenter. unprocessedInput. pointerReleased + = UnprocessedInput_PointerReleased; inkCanvas. inkPresenter. strokeInput. strokeStarted + = StrokeInput_StrokeStarted; inkCanvas. inkPresenter. strokesErased + = direction;} // right-click and press private void forward (InkUnprocessedInput sender, PointerEventArgs args) {// right-click track _ polyline = new Polyline () {Stroke = new SolidColorBrush (Colors. blue), StrokeThickness = 1, StrokeDashArray = new DoubleCollection () {5, 2},}; _ polyline. points. add (args. currentPoint. rawPosition); // right-click the trajectory selectionCanvas. children. add (_ polyline);} // right-click and move private void UnprocessedInput_PointerMoved (InkUnprocessedInput sender, PointerEventArgs args) in InkCanvas {// update right-click track _ polyline. points. add (args. currentPoint. rawPosition);} // right-click to raise private void UnprocessedInput_PointerReleased (InkUnprocessedInput sender, PointerEventArgs args) {// update right-click track _ polyline. points. add (args. currentPoint. rawPosition); // obtain the Rect region of the graffiti in the area circled by right-clicking _ rect = inkCanvas. inkPresenter. strokeContainer. selectWithPolyLine (_ polyline. points); DrawBoundingRect ();} // plot _ rect area (that is, the Rect area of the selected graffiti) private void DrawBoundingRect () {selectionCanvas. children. clear (); if (_ rect. width = 0) | (_ rect. height = 0) | _ rect. isEmpty) {return;} var rectangle = new Rectangle () {Stroke = new SolidColorBrush (Colors. blue), StrokeThickness = 1, StrokeDashArray = new DoubleCollection () {5, 2}, Width = _ rect. width, Height = _ rect. height}; Canvas. setLeft (rectangle, _ rect. x); Canvas. setTop (rectangle, _ rect. y); selectionCanvas. children. add (rectangle);} // private void StrokeInput_StrokeStarted (InkStrokeInput sender, PointerEventArgs args) {ClearSelection ();} // private void InkPresenter_StrokesErased (InkPresenter sender, InkStrokesErasedEventArgs args) {ClearSelection () ;}// clear the selected state of the graffiti and the selected box private void ClearSelection () {IReadOnlyList <InkStroke> strokes = inkCanvas. inkPresenter. strokeContainer. getStrokes (); foreach (var stroke in strokes) {stroke. selected = false;} ClearDrawnBoundingRect ();} // select the private void ClearDrawnBoundingRect () {if (selectionCanvas. children. any () {selectionCanvas. children. clear (); _ rect = Rect. empty ;}}// clear all graffiti private void clear_Click (object sender, RoutedEventArgs e) {ClearDrawnBoundingRect (); inkCanvas. inkPresenter. strokeContainer. clear () ;}// cut selected graffiti to the clipboard private void cut_Click (object sender, RoutedEventArgs e) {ClearDrawnBoundingRect (); inkCanvas. inkPresenter. strokeContainer. copySelectedToClipboard (); Rect rect = inkCanvas. inkPresenter. strokeContainer. deleteSelected ();} // copy the selected graffiti to the clipboard private void copy_Click (object sender, RoutedEventArgs e) {inkCanvas. inkPresenter. strokeContainer. copySelectedToClipboard ();} // paste the graffiti private void paste_Click (object sender, RoutedEventArgs e) {if (inkCanvas. inkPresenter. strokeContainer. canPasteFromClipboard () {Rect rect = inkCanvas. inkPresenter. strokeContainer. pasteFromClipboard (new Point (0, 0) ;}// move selected graffiti private void move_Click (object sender, RoutedEventArgs e) {Rect rect = inkCanvas. inkPresenter. strokeContainer. moveSelected (new Point (10, 10); _ rect = rect; DrawBoundingRect () ;}// clone all graffiti private void cloneAll_Click (object sender, RoutedEventArgs e) {Random random = new Random (); IReadOnlyList <InkStroke> oldStrokes = inkCanvas. inkPresenter. strokeContainer. getStrokes (); List <InkStroke> newStrokes = new List <InkStroke> (); foreach (InkStroke oldStroke in oldStrokes) {InkStroke newStroke = oldStroke. clone (); newStroke. selected = true; newStrokes. add (newStroke);} inkCanvas. inkPresenter. strokeContainer. addStrokes (newStrokes); inkCanvas. inkPresenter. strokeContainer. moveSelected (new Point (random. next (5, 30), random. next (5, 30); ClearSelection () ;}// select all graffiti private void selectAll_Click (object sender, RoutedEventArgs e) {Rect rect = inkCanvas. inkPresenter. strokeContainer. boundingRect; _ rect = rect; IReadOnlyList <InkStroke> strokes = inkCanvas. inkPresenter. strokeContainer. getStrokes (); foreach (var stroke in strokes) {stroke. selected = true;} DrawBoundingRect ();} // change the color of all graffiti private void changeColor_Click (object sender, RoutedEventArgs e) {Random random = new Random (); color color = Color. fromArgb (255, (byte) random. next (0,256), (byte) random. next (0,256), (byte) random. next (0,256); IReadOnlyList <InkStroke> strokes = inkCanvas. inkPresenter. strokeContainer. getStrokes (); foreach (var stroke in strokes) {InkDrawingAttributes drawingAttributes = stroke. drawingAttributes; drawingAttributes. color = color; stroke. drawingAttributes = drawingAttributes ;}}}}

OK
[Download source code]