1

Whilst using the InkCanvas in an app I'm currently developing I found after moving between pages that had InkCanvases on them the app would crash with a Xaml Parse Exception. It seemed random, however I created a simple app to get rid of as many variables that could be causing this. I added 2 pages to move between with multiple (10) InkCanvases on the second page. The app consistently crashes after moving back and forth between the pages 10 or more times. Below I have added my simple test pages.

Page 1:

<Page>
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Button Content="Navigate"
                Click="ButtonBase_OnClick"/>
    </Grid>
</Page>

Page 1 Code behind:

public sealed partial class MainPage : Page {
  private Frame rootFrame;
    public MainPage() {
        this.InitializeComponent();
        rootFrame = Window.Current.Content as Frame;
    }

  private void ButtonBase_OnClick(object sender, RoutedEventArgs e) {
    rootFrame.Navigate(typeof (PageTwo));
  }
}

Page 2:

<Page>
    <StackPanel>
        <TextBlock Text="Sign 1"/>
        <InkCanvas Width="100"
                   Height="100"/>
        <TextBlock Text="Sign 2"/>
        <InkCanvas Width="100"
                   Height="100"/>
        <!-- Another 8 InkCanvases -->
    </StackPanel>
</Page>

I checked the memory profiler to see if the InkCanvases or pages were being held onto in memory but from what I could see they weren't.

Has anyone else experienced this issue? Or is there any known workaround?

jsmyth886
  • 531
  • 7
  • 15

1 Answers1

1

Just set the NavigationCacheMode of pagetwo to Required or Enabled as follows:

 public Page2()
 {
     this.NavigationCacheMode = NavigationCacheMode.Required;
     this.InitializeComponent();       
 }

I have tested your code , navigate to pagetwo from pageoneand then navigate from pagetwo to pageone , after about thirteen rounds, the app crashes and throw the exception:

Cannot create instance of type 'Windows.UI.Xaml.Controls.InkCanvas'

So it seems the instance size of InkCanvas for the frame is exceeded. Every time you navigate you will create ten instances for the InkCanvas. So we set the NavigationCacheMode to require , it means

The page is cached and the cached instance is reused for every visit regardless of the cache size for the frame.

You also can set it to Enabled.It depends on your requirements. More details about instance cache, please see NavigationCacheMode

Sunteen Wu
  • 10,509
  • 1
  • 10
  • 21
  • Yes you are right in this simple app example I could set the NavigationCacheMode to Required to get around the problem. The simple app I created was only to recreate the issue and remove as many of the variables I had in the other app (MVVM, dynamically loading content, etc.) In the more complex app where I first seen this issue Page2 is a reusable page which has controls dynamically added to it and is used for getting answers from a set of questions kind of like a form or questionnaire. Because the content changes between forms caching is causing an issue with loading the new content. – jsmyth886 May 27 '16 at 10:10
  • Do you mean after setting this you still have issues? Do you have the detail error information of the exception such as I put above? – Sunteen Wu May 30 '16 at 07:14
  • In both simple app and complex app I get this: 'Cannot create instance of type 'Windows.UI.Xaml.Controls.InkCanvas' What I mean with the NavigationCacheMode is, it helps in the case of the simple app as the Pages are created manually in xaml. However in my other more complex app the Pages are created dynamically in code and the particular Page in question is not always going to be the same. Setting the NavigationCacheMode causes problems when the content for that Page has changed, as it does not reload the content it only shows the cached Page. – jsmyth886 May 30 '16 at 07:21
  • I am also hitting this issue. Like the OP I have a page that when loaded binds/creates multiple inkcanvas controls for different "markup" on an image. There could quite easily be 30+ inkcanvas controls. When navigating back and forward I hit the same exception. There are no further details in the callstack. I have tried Required, Enabled, Disabled, and all three end with the same exception. – Allan Smith Apr 26 '17 at 03:59
  • @Allan not sure if this will help you or not, but I was able to work around my issue by using a Canvas instead of the InkCanvas to draw a LineCollection. I have a converter that converts the output of my single InkCanvas to a LineCollection, then draw a Polyline using that collection. That means my original issue of the Form having 10+ InkCanvas' now has 10+ Canvas' that don't cause the app to crash. – jsmyth886 May 28 '17 at 10:53