locked
WebView.CapturePreviewToStreamAsync raises exception if WebView isn't visible

    Question

  • I need to be able to display a thumbnail for a user-provided URL. To that end, I've been experimenting with CapturePreviewToStreamAsync but I've very quickly realised that if the WebView isn't visible, an exception gets raised.

    I've taken the WebView sample (http://code.msdn.microsoft.com/windowsapps/XAML-WebView-control-sample-58ad63f7) and, in Scenario8_CaptureBitmap.xaml.cs, added:

                webView8.NavigationCompleted += webView8_NavigationCompleted;

    to OnNavigatedTo, just before calling webView8.Navigate, and create webView8_NavigationCompleted so that it is a complete copy of bookmarkBtn_Click. This changes the functionality so that the bookmark is created automatically, without needing to press a button, which is the functionality I've been trying to accomplish in my own code.

    Now, if I then edit Scenario8_CaptureBitmap.xaml so that the visibility of webView8 is set to Collapsed, the code breaks with an exception on CapturePreviewToStreamAsync, as my own code is.

    If I change the visibility back to Visible and the Opacity to 0, the code works but it then requires the control to be hooked into the visual tree, which isn't really what I want to do.

    Any suggestions on how I can overcome this? Is it by design or is it a bug?

    Sunday, May 11, 2014 10:52 AM

All replies

  • That's what I would expect. It is the same requirements as for RenderTargetBitmap. See the RenderTargetBitmap Remarks for more information.

    I'll request this be clarified in the CapturePreviewToStreamAsync docs as well.

    --Rob

    Sunday, May 11, 2014 3:17 PM
    Owner
  • Thanks for the confirmation that the behaviour is expected, although not having it raise an exception would be nice!

    I'm still trying to figure out a way to solve my problem, though, as a result of that confirmation. If the WebView control has to be in the Visual Tree and cannot be collapsed, I suppose one (dirty) solution would be to (a) make it invisible and (b) put it to the back of the stack so that any user interaction doesn't interfere with it. My main concern would be trying to position the control so that it doesn't cause scroll bars to appear because it has made the visual area larger that the user might expect.

    All very hacky and nasty, though :-(

    --Philip

    Sunday, May 11, 2014 4:07 PM
  • It will depend on how your visual tree is laid out, but generally there is a root level grid that you can add it to. If you don't put it inside a ScrollViewer then it won't cause scroll bars.

    It doesn't need to be visible to the user: you can place it behind your other elements so it isn't visible or out of the visible screen boundaries.

    --Rob

    Monday, May 12, 2014 4:31 PM
    Owner
  • I'm still struggling to get the behaviour that I'm looking for.

    For example, with this URL:

    https://onedrive.live.com/embed?cid=42B71883C19FDDAE&resid=42B71883C19FDDAE%214603&authkey=AKifb-V8bph9Deg

    when the NavigationCompleted event fires, I call CapturePreviewToStreamAsync but all I get is a grey rectangle. I guess there must be some script running that actually downloads the image and that takes a while to execute.

    Furthermore, I'd ideally like to capture a thumbnail that represents a scaled version of an arbitrary web page but the problem is that the WebView control either explicitly requires a width and height to be set, or the parent container (e.g. a grid cell) needs to have that explicitly set. The problem I've got here is that I'm trying to display the WebView within a HubSection so I'm struggling to figure out basically how to maximise the size of the control.

    Thanks.

    Philip

    Sunday, May 18, 2014 11:01 AM
  • Yes, you'll need to wait for the WebView to finish loading. I believe the NavigationCompleted event should be late enough.

    Since you're not displaying the WebView you can put it in any container you want and you can set its size however you like.

    --Rob

    Friday, May 23, 2014 2:51 AM
    Owner
  • Hi Rob

    With the OneDrive URL I've provided, NavigationCompleted is *not* late enough. I haven't got the skills to drill into what is happening behind the scenes but I suspect there is a script running that actually downloads the image that is then displayed, which is why the CapturePreview call results in a blank image.

    I do understand that I can set its size however I like but the problem is that I don't know what size the web page is going to be. Ideally I'd like the WebView to scale the web page to fit the size I've specified but that doesn't seem to be possible. It is all quite frustrating since my expectations would be an experience similar to using IE, e.g. being able to zoom in and out, stuff like that. The control doesn't even seem to produce scrollbars if they are required.

    Philip

    Saturday, May 24, 2014 7:59 AM