c# - Capture complete page design into image, windows phone 8.1 -

i developing windows mobile app 8.1,

i'd convert complete design in page(wpf control) image. have implemented screenshot capture task using this

its capture viewing area not complete page if page design has scroll-able. if want convert complete page design scrollable design, how this?

please check below screen shot

this problem, var rendertargetbitmap = new rendertargetbitmap(); await rendertargetbitmap.renderasync(uielement);

its capture current viewing area instead of complete uielement content.

is possible capture complete uielement content?

you can use rendertargetbitmap class. create extension method takes uielement of want create image (in case page) , file generated image saved. method return true if successful:

public static async task<bool> savevisualelementtofile(this uielement element, storagefile file) {     try     {         var rendertargetbitmap = new rendertargetbitmap();         await rendertargetbitmap.renderasync(element);         var pixels = await rendertargetbitmap.getpixelsasync();          using (irandomaccessstream stream = await file.openasync(fileaccessmode.readwrite))         {             var encoder = await bitmapencoder.createasync(bitmapencoder.pngencoderid, stream);             byte[] bytes = pixels.toarray();             encoder.setpixeldata(                 bitmappixelformat.bgra8,                 bitmapalphamode.straight,                 (uint)rendertargetbitmap.pixelwidth,                 (uint)rendertargetbitmap.pixelheight,                 displayinformation.getforcurrentview().logicaldpi,                 displayinformation.getforcurrentview().logicaldpi,                 bytes);              await encoder.flushasync();         }          return true;     }     catch (exception)     {         return false;     } } 

you need make sure uielement in visual tree (rendered), otherwise method not work.

then can call method this:

storagefolder localfolder = applicationdata.current.temporaryfolder; storagefile file = await localfolder.createfileasync(sharesreenshotfilename, creationcollisionoption.replaceexisting); await view.savevisualelementtofile(file); 

edit:

your problem appears because listview virtualized , therefore not items rendered. can disable virtualization using stackpanel items panel of list view:

<listview>     <listview.itemsstackpanel>         <itemspaneltemplate>             <stackpanel orientation="vertical"/>         </itemspaneltemplate>     </listview.itemsstackpanel> </listview> 

another problem if passing container of listview (grid or whatever is), container bounds displayed in generated image, need pass listview reference savevisualelementtofile method.