[flexcoders] Printing images using PrintDataGrid

[langdonjared]

I am trying to print many images from my app.  I am taking snapshots of objects 
on the app, putting them into an ArrayCollection, and displaying them in a 
DataGrid.  So far so good.  When I assign the same ArrayCollection to a 
PrintDataGrid, weirdness ensues.  Not only do the images not appear in the 
PrintDataGrid, they don't even appear anymore in the DataGrid.  Here's the code:

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml";
        layout="vertical"
        verticalAlign="left"
        backgroundColor="white"
>

    <mx:Script>
        <![CDATA[
                import mx.collections.ArrayCollection;
            import mx.graphics.ImageSnapshot;
                        import mx.controls.Image;
                        import mx.printing.FlexPrintJob;

                        private function doInit():void {
                                for (var i:int = 0; i<5; i++) {
                        var oBM:Bitmap = new 
Bitmap(ImageSnapshot.captureBitmapData(btn));
                        oData.addItem({image:oBM});
                                }
                        }
                        
                        private function doPrint():void {
                                oPDG.dataProvider = oData;
                        }
                        
            private function takeSnapshot(source:IBitmapDrawable):void {
                var oBM:Bitmap = new 
Bitmap(ImageSnapshot.captureBitmapData(source));
                oData.addItem({image:oBM});
            }

            [Bindable]
            private var oData:ArrayCollection = new ArrayCollection(); 
            
        ]]>
    </mx:Script>
 
    <mx:ApplicationControlBar dock="true">
        <mx:Button label="Initialize oData" click="doInit();" />
        <mx:Button label="Assign oData to PrintDataGrid" click="doPrint();" />
    </mx:ApplicationControlBar>

    <mx:HBox>
        <!-- Take a snapshot of this -->
                <mx:Button id="btn" label="snapshot me!" />

                <mx:PrintDataGrid variableRowHeight="true" id="oPDG" 
width="100%" >
                        <mx:columns>
                                <mx:DataGridColumn width="200" 
headerText="Stuff" >
                                                <mx:itemRenderer>
                                                        <mx:Component>
                                                                <mx:Image 
source="{data.image}" />
                                                        </mx:Component>
                                                </mx:itemRenderer>
                                        </mx:DataGridColumn>
                        </mx:columns>
                </mx:PrintDataGrid>

        <mx:DataGrid variableRowHeight="true" minHeight="0" 
dataProvider="{oData}" >
                <mx:columns>
                        <mx:DataGridColumn width="200" headerText="Stuff" >
                                        <mx:itemRenderer>
                                                <mx:Component>
                                                        <mx:Image 
source="{data.image}" />
                                                </mx:Component>
                                        </mx:itemRenderer>
                                </mx:DataGridColumn>

                </mx:columns>
        </mx:DataGrid>
    </mx:HBox>

</mx:Application>

Run the application.  Click Initialize oData to fill up the oData object (my 
data provider, which is an ArrayCollection) with snapshots of the button 
labelled "snapshot me!".  The images dutifully appear in the DataGrid to the 
right.  Now click "Assign oData to PrintDataGrid" and see what happens!  

Obviously this application is not of much use as it is.  I tried to remove 
everything that's distracting from the actual problem.

Anyone know what's going wrong here?  Any suggestions on how to print images 
using a PrintDataGrid?  Many thanks.

Jared