從WPF開始，就有個InkCanvas控件，封裝了數字墨跡處理相關的功能，Silverlight到Win 8 App，再到UWP應用，都有這個控件，所以，老周說了3688遍，凡是.net基礎扎實者，必懂WPF，凡是WPF基礎扎實者，必懂UWP。這叫一脈相承。

現在你明白為什么每次SDK發布后，老周不用學習就可以直接拿來用的原因了吧，因為老周認真學習過WPF唄，無他，如此而已。

Windows 10 一周年更新后，SDK也隨即更新，預覽版畢竟是未定型的，所以，在預覽版階段，老周并不打算寫什么，現在已正式推送了，因此，可以寫些什么了。

周年更新的其中一個玩意兒就是Windows Ink，這個工具內置在系統，方便涂鴉。

?

同時，Ink相關的功能也整合到 SDK 中，而且已經做好了封裝，直接拿來就能用，功能齊全。不信？咱們試試。

新建UWP項目，然后項目模板會創建一個主頁——MainPage.xaml，然后你輸入以下XAML即可。

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"><Grid.RowDefinitions><RowDefinition Height="auto"/><RowDefinition/></Grid.RowDefinitions><InkToolbar Name="ink_bar" TargetInkCanvas="{x:Bind ink_cvs}"/><InkCanvas Name="ink_cvs" Grid.Row="1" /></Grid>

很簡單，InkCanvas就不用多介紹了，它是一個面板，特點是你可以在它上面涂抹，就像大街上那些妖怪那樣，把化妝品往臉上亂涂，涂得人不像人，雞不像雞。

InkToolBar呢是一個現成的工具欄，你可以在上面選擇涂鴉的工具，比如圓珠筆、鉛筆、橡皮擦、尺子等，老周記得，這些都是老周上幼兒園時的必備套裝。唉，你想想，咱們那個時候，有個P手機電腦玩的，上學前玩泥人，上學后玩紙人，上課時玩橡皮擦，下課后玩粉筆擦。每次聽到羅大佑的《童年》，都別有一番滋味，童年時光多么美好，一轉眼，滄海已變成桑田，桑田又變成滄海，世事恒無常，且活且珍惜。

只要你聲明一個InkToolBar對象，無需寫任何代碼，它就能用了。哦，別忘了關鍵一點，那就是，你得讓InkToolBar找到InkCanvas實例，如此，這兩位Ink君才能協同工作，InkToolBar是郎才，InkCanvas是女貌，正所謂：水愛花姣美，花愛水清明。

要讓兩位Ink君走到一起，需要一個媒介——對了，InkToolBar有個TargetInkCanvas屬性，它用來指定相應的InkCanvas對象，記住了，這個屬性一定要賦值，不然找不到伴，InkToolBar會殉情的，鴛鴦怎能失伴飛呢，是吧。

?

看到沒，就是這么TMD簡單，一個涂鴉程序就完成，別看只聲明了兩個控件，現在它完全可以工作了。當然，別急著運行，因為我們還需要指定InkCanvas面板支持哪些操作，如鼠標、觸控筆、手觸等。好，切換到代碼視圖，在頁面類的構造函數中加入以下代碼：

public MainPage(){this.InitializeComponent();this.ink_cvs.InkPresenter.InputDeviceTypes = Windows.UI.Core.CoreInputDeviceTypes.Mouse | Windows.UI.Core.CoreInputDeviceTypes.Pen | Windows.UI.Core.CoreInputDeviceTypes.Touch;}

InputDeviceTypes屬性指定墨跡面板支持哪些設備操作，這里我就干脆鼠、筆、指全用上。

注意，這些代碼一定要寫在InitializeComponent方法調用之后，別犯那些低級錯誤，因為InitializeComponent方法調用后，XAML定義的UI才完成初始化，不然，控件實例都是null，你訪問個屁。

?

好了，現在OK了，運行一下吧。

?

是不是很是簡單呢？那么，如果我只希望顯示鉛筆、橡皮擦兩個按鈕，而不需要其他按鈕，那怎么做呢？沒事，很簡單，來，動手干一干。

首先，把InkToolBar的InitialControls屬性改為None。

<InkToolbar Name="ink_bar" TargetInkCanvas="{x:Bind ink_cvs}" InitialControls="None"/>

然后，在InkToolBar元素下面手動定義各個按鈕。

<InkToolbar Name="ink_bar" TargetInkCanvas="{x:Bind ink_cvs}" InitialControls="None"><InkToolbarPencilButton/><InkToolbarEraserButton/></InkToolbar>

?

再次運行一下，看看效果。

?

好，現在簡潔了不少。

InkToolBar還提供了 custom button，你可以自定義涂鴉按鈕，以擴展其功能。比如，我添加一個按鈕。

<InkToolbar Name="ink_bar" TargetInkCanvas="{x:Bind ink_cvs}" InitialControls="None">……<InkToolbarCustomToolButton Click="OnClick"><SymbolIcon Symbol="Folder" ToolTipService.ToolTip="sample" /></InkToolbarCustomToolButton></InkToolbar>

得到以下視圖。

?

好了，關于InkToolBar，就聊到這里吧。

示例代碼下載地址:http://files.cnblogs.com/files/tcjiaan/inktoolbarSample.zip

轉載于:https://www.cnblogs.com/kesteler/p/5754924.html

總結

以上是生活随笔為你收集整理的【Win 10 应用开发】InkToolBar——涂鸦如此简单的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。