[DEPRECATED]

Thank you for your interest in the InkToolbar control. We aredeprecating this extension in favor of the XAML InkToolbar control that was released as a part the Windows 10 Anniversary update. The new InkToolbar sports new tools, like pencil and ruler, multi-language support, better extensibility story, better performance, and an updated UI. Resources that you might find useful:

1. MSDN documentation
2. Design guidance
3. InkToolbar in Custom Dry Mode
4. Sample app

______________________________________________________________________________________

Most inking apps will need a UI to control inking properties, such as color and thickness, and interaction modes, such as inking or erasing. We have packaged the inking UI that is used in theMicrosoft Edge browser’s Web Notes feature into to this experimental control. With the InkToolbar and the new InkCanvas control in Windows 10 you can build a basic inking UI in seconds!

The InkToolbar can be positioned like any standard control, and it can for example be floating on top of your inking surface:

Or placed within a toolbar or appbar:

The InkToolbar control provides three buttons by default: Pen, Highlighter, and Eraser. If you need additional buttons you can use the InkToolbarButton control and place them next to the InkToolbar.

Requirements

• Windows 10 Insider Preview – Build 10047 or newer
• Visual Studio Community 2015 RC

Both can be found here: https://dev.windows.com/en-us/windows-10-developer-preview-tools

Known issues

• The InkToolbar controls will not show up in the Visual Studio toolbox. This is because Visual Studio 2015 RC does not have full support for Universal App controls yet. The instructions below show how to work around this by adding the appropriate references manually.
• There is currently a bug making the visual designer not show the actual control (it just shows a square with a red circle)

Install instructions

1. Install the InkToolbar Control VSIX from this site
2. Create your Windows Universal project (or open an existing one)
3. In your project, right-click “References”, select “Add reference…”
4. Under “Windows Universal” in the left-hand navigation, select “Extensions”, then make sure the "InkToolbar Control" is checked.
   
   
   
   
5. Make sure “Solution Platforms” option is set to something different than AnyCPU (for example x86)
   
    

Usage

There are two main ways to use the InkToolbar control:

1. Bind the InkToolbar to an InkCanvas control
   This is the simplest way to integrate the InkToolbar in your app. I can all be done through XAML and there is no need for any code to handle user interactions. The InkToolbar will automatically set the appropriate properties on the bound InkCanvas.
2. Handle InkToolbar events manually
   This requires code to handle the InkToolbar changes as the user interacts with it, but gives you more flexibility.To do this make sure you are handling the ToolChanged , DrawingAttributesChanged, EraserModeChanged, and ClearAllClick events.
   Some examples of when this is useful:
   1. If you are using something else than the InkCanvas control for your ink rendering
   2. If you have multiple InkCanvases you want to control with a single InkToolbar
   3. If your InkCanvas is not running on the same UI thread as the InkToolbar

Basic sample: Bind the InkToolbar to an InkCanvas control

1. Include the Microsoft.Labs.InkToolbarControl namespace
2. Create a InkCanvas
3. Create a InkToolbar and bind it to your InkCanvas

<Page    x:Class="InkSample.MainPage"    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"    xmlns:local="using:InkSample "    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"    xmlns:inkTools="using:Microsoft.Labs.InkToolbarControl"    mc:Ignorable="d" Loaded="Page_Loaded">     <Grid Background="#FFFFFADF">        <InkCanvas Name="myCanvas"></InkCanvas>        <inkTools:InkToolbar TargetInkCanvas="{x:Bind myCanvas}" PenColor="#FFE61021" VerticalAlignment="Top" HorizontalAlignment="Right"></inkTools:InkToolbar>    </Grid></Page>

<Page     x:Class="InkSample.MainPage"     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"     xmlns:local="using:InkSample "     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"     xmlns:inkTools="using:Microsoft.Labs.InkToolbarControl"     mc:Ignorable="d" Loaded="Page_Loaded">       <Grid Background="#FFFFFADF">         <InkCanvas Name="myCanvas"></InkCanvas>         <inkTools:InkToolbar TargetInkCanvas="{x:Bind myCanvas}" PenColor="#FFE61021" VerticalAlignment="Top" HorizontalAlignment="Right"></inkTools:InkToolbar>     </Grid> </Page>