WPF中InkCanvas基本操作方法的示例分析

这篇文章将为大家详细讲解有关WPF中InkCanvas基本操作方法的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。

WPF的InkCanvas就是一个画板,可以在上面随意涂鸦,每写上一笔,InkCanvas的Strokes集合里就新增一个涂鸦对象,下面的代码演示了基本的操作。

效果图

xaml代码



































后台代码

usingMicrosoft.Win32;
usingSystem;
usingSystem.Collections.Generic;
usingSystem.IO;
usingSystem.Linq;
usingSystem.Text;
usingSystem.Threading.Tasks;
usingSystem.Windows;
usingSystem.Windows.Controls;
usingSystem.Windows.Data;
usingSystem.Windows.Documents;
usingSystem.Windows.Ink;
usingSystem.Windows.Input;
usingSystem.Windows.Media;
usingSystem.Windows.Media.Imaging;
usingSystem.Windows.Navigation;
usingSystem.Windows.Shapes;

namespaceWPF_InkCanvas
{
///
///MainWindow.xaml的交互逻辑
///
publicpartialclassMainWindow:Window
{
ViewModelviewModel;
publicMainWindow()
{
InitializeComponent();

DrawingAttributesdrawingAttributes=newDrawingAttributes
{
Color=Colors.Red,
Width=2,
Height=2,
StylusTip=StylusTip.Rectangle,
FitToCurve=true,
IsHighlighter=false,
IgnorePressure=true,

};
inkCanvasMeasure.DefaultDrawingAttributes=drawingAttributes;

viewModel=newViewModel
{
MeaInfo="测试······",
};

DataContext=viewModel;
}

privatevoidInkCanvasMeasure_MouseDown(objectsender,MouseButtonEventArgse)
{

}

privatevoidInkCanvasMeasure_MouseMove(objectsender,MouseEventArgse)
{

}

privatevoidOpenFile_Click(objectsender,RoutedEventArgse)
{
OpenFileDialogopenDialog=newOpenFileDialog
{
Filter="ImageFiles(*.jpg)|*.jpg|ImageFiles(*.png)|*.png|ImageFiles(*.bmp)|*.bmp",
Title="OpenImageFile"
};
if(openDialog.ShowDialog()==true)
{
BitmapImageimage=newBitmapImage();
image.BeginInit();
image.UriSource=newUri(openDialog.FileName,UriKind.RelativeOrAbsolute);
image.EndInit();
imgMeasure.Source=image;
}
}

privatevoidRadioButton_Click(objectsender,RoutedEventArgse)
{
if((senderasRadioButton).Content.ToString()=="绘制墨迹")
{
inkCanvasMeasure.EditingMode=InkCanvasEditingMode.Ink;
}

elseif((senderasRadioButton).Content.ToString()=="按点擦除")
{
inkCanvasMeasure.EditingMode=InkCanvasEditingMode.EraseByPoint;
}

elseif((senderasRadioButton).Content.ToString()=="按线擦除")
{
inkCanvasMeasure.EditingMode=InkCanvasEditingMode.EraseByStroke;
}

elseif((senderasRadioButton).Content.ToString()=="选中墨迹")
{
inkCanvasMeasure.EditingMode=InkCanvasEditingMode.Select;
}

elseif((senderasRadioButton).Content.ToString()=="停止操作")
{
inkCanvasMeasure.EditingMode=InkCanvasEditingMode.None;
}
}

privatevoidSaveInkCanvas_Click(objectsender,RoutedEventArgse)
{
FileStreamfileStream=newFileStream("inkCanvas.isf",FileMode.Create,FileAccess.ReadWrite);
inkCanvasMeasure.Strokes.Save(fileStream);
fileStream.Close();
}

privatevoidLoadInkCanvas_Click(objectsender,RoutedEventArgse)
{
FileStreamfileStream=newFileStream("inkCanvas.isf",FileMode.Open,FileAccess.Read);
inkCanvasMeasure.Strokes=newStrokeCollection(fileStream);
fileStream.Close();
}

privatevoidCopyInkCanvas_Click(objectsender,RoutedEventArgse)
{
inkCanvasMeasure.CopySelection();
}
privatevoidPasteInkCanvas_Click(objectsender,RoutedEventArgse)
{
inkCanvasMeasure.Paste();
}
}
}

ViewModel.cs代码

usingSystem;
usingSystem.Collections.Generic;
usingSystem.ComponentModel;
usingSystem.Linq;
usingSystem.Text;
usingSystem.Threading.Tasks;

namespaceWPF_InkCanvas
{
classViewModel:INotifyPropertyChanged
{
publiceventPropertyChangedEventHandlerPropertyChanged;

protectedvirtualvoidOnPropertyChanged(stringpropertyName=null)
{
if(PropertyChanged!=null)
PropertyChanged.Invoke(this,newPropertyChangedEventArgs(propertyName));
}

privatestringmeaInfo;
publicstringMeaInfo
{
get=>meaInfo;
set
{
meaInfo=value;
OnPropertyChanged("MeaInfo");
}
}
}
}

补充说明:将Image和InkCanvas放到一个Grid里,并且将InkCanvas的长宽绑定到Image,这样Image和InkCanvas的位置就是对应的,方便我后续在InkCanvas上提取Image的感兴趣区域;InkCanvas里加了一个Label可以实现类似图片上添加文字说明的功能,要设置Label的IsHitTestVisible="False",不然点击事件就没办法触发了。

关于“WPF中InkCanvas基本操作方法的示例分析”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,使各位可以学到更多知识,如果觉得文章不错,请把它分享出去让更多的人看到。

发布于 2021-05-30 14:08:33
分享
海报
185
上一篇:如何使用canvas保存网页为pdf文件支持跨域 下一篇:canvas线条属性的示例分析
目录

    忘记密码?

    图形验证码