0

I paired an InkCanvas control with an InkTookbar control inside a button flyout as follows...

<Button>
   <Button.Flyout>
      <Flyout>
         <Grid Height="300">
            <Grid.RowDefinitions>
               <RowDefinition Height="Auto" />
               <RowDefinition Height="*" />
            </Grid.RowDefinitions>
           <InkToolbar x:Name="inkToolbar"
                               Grid.Row="0"
                               TargetInkCanvas="{x:Bind inkCanvas}" />
           <InkCanvas x:Name="inkCanvas"
                              Grid.Row="1"/>
         </Grid>
      </Flyout>
   </Button.Flyout>
</Button>

I found that the InkCanvas control does not respond to mouse input.

I tried a couple of things:

  1. Binding the OverlayInputPassThroughElement property of the Flyout to the InkCanvas. Then I realized, this makes no sense since the InkCanvas is not underneath the flyout's overlay.

  2. Setting the AllowFocusOnInteraction property of InkCanvas to True, but this had no effect.

How can InkCanvas become responsive inside a Flyout?

  • I cannot reproduce the problem with the code you provide. It works correctly on my side. Could you please share us a repro sample on using OneDeriver of GitHub? – YanGu Oct 08 '20 at 08:33
  • Has your problem been solved? If it is not solved, please feel free to contact us. – YanGu Oct 22 '20 at 05:48

1 Answers1

0

For Incanvas to reponce to your mouse input you have to set input device

inkCanvas.InkPresenter.InputDeviceTypes = Windows.UI.Core.CoreInputDeviceTypes.Mouse | Windows.UI.Core.CoreInputDeviceTypes.Pen | Windows.UI.Core.CoreInputDeviceTypes.Touch;
Abhishek Sharma
  • 104
  • 1
  • 7
  • I did but InkCanvas still does not work inside a flyout. It works fine outside a flyout. – M Psyllakis Oct 08 '20 at 05:17
  • i set this line in constructor from backend and its working fine on my side you can check this sample that i created and tested https://github.com/AbhiSharma9350/InkCanvasInFlyout – Abhishek Sharma Oct 09 '20 at 08:51