11 Replies Latest reply on Oct 8, 2010 7:23 AM by rudhirdeshkar

    Datagrid getting truncated during printing

    rudhirdeshkar

      Hi All,

       

      I have a panel which contains the following items :-

       

      1. A Header Label

      2. A time slider

      3. A combo box

      4. A view stack which has a chart at index 0 and a data grid at index 1

      5. Some buttons

       

      For the datagrid(which is inside a VBox,whose height is 100% and verticalScrollPolicy is "on"), I have set the following attributes:-

      1.variableRowHeight = true

      2.rowCount = "{gridDataProvider.length}"

      3.verticalScrollPolicy = "off"

      4. wordWrap = true

      5. dataProvider = "{gridDataProvider}"

      6. updateComplete = "onUpdateComplete()"

       

      The function onUpdateComplete is:-

       

      private function onUpdateComplete() : void
                  {

                     var  newHeight : Number;
                     
                      if ( this.gridDataProvider )   
                      {
                          this.dataGrid.headerHeight=50;
                          newHeight = dataGrid.measureHeightOfItems(0, this.gridDataProvider .length) + this.dataGrid.headerHeight ;
                          this.dataGrid.height = newHeight;
                          this.dataGrid.validateNow();
                      } 
                  }

       

       

      While printing, I am having a printVBox which contains all these components and its height = dataGrid.height + some buffer height for accomodating the height of other components in the panel.

       

      I am able to print all the components, both before and after the datagrid, but the content of the datagrid is getting truncated, many rows are not printed.

       

      Please help. Thanks in advance !!

       

      Regards,

      Rudhir

        • 1. Re: Datagrid getting truncated during printing
          BhaskerChari Level 4

          Hi Rudhir,

           

          I think If I am right you are having a scroll bar for your datagrid and the rows which are not visible cannot be printed, only the visible portion of your rows gets printed. Flex will not print all the rows of your DataGrid when you print, it prints as exactly it appears on your UI.

           

          So in order to print all your DataGrid rows without truncation you need to specift the full height of the DataGrid without scroll bar when you are sending the printing Container to the printer and again you need to restore back to its original size with scroll after it is printed.

           

          Hope you understand my point. Let me know if you have any doubts.

           

           

           

          Thanks,

          Bhasker Chari

          • 2. Re: Datagrid getting truncated during printing
            rudhirdeshkar Level 1

            Hi Bhasker,

             

            You are probably correct. But how should I calculate the height full height of the data grid without scrollbar while sending it to the print Container?

             

            Kindly provide some light on how this can be done?

             

            Any other solution(s) will also be helpful. I am badly stuck up with this issue.

             

            Thanks and Regards,

            Rudhir

            • 3. Re: Datagrid getting truncated during printing
              BhaskerChari Level 4

              Hi Rudhir,

               

              You should do something like below:

               

              private function doPrint(event:Event):void
                 {
                  var printJob:FlexPrintJob = new FlexPrintJob();
                  if(printJob.start() != true) return;

                  try
                              {
                   var originalDGHeight:int = dataGridId.height;
                   //Increasing the height of the desired component to be printed without scroll.

                   //Here Check  which one is giving you total height dataGridId.measuredMinHeight or dataGridId.measuredHeight
                   dataGridId.height = dataGridId.measuredMinHeight;

                   //dataGridId.height = dataGridId.measuredHeight;
                   dataGridId.verticalScrollPolicy = "off";
                       
                   //Adding the resized Component to our FlexPrintjob and then sending the print request
                   printJob.addObject(printVBox,FlexPrintJobScaleType.MATCH_WIDTH);    
                   printJob.send();
                  
                   //Resizing the component back to normal size
                   dataGridId.height = originalDGHeight;
                   dataGridId.verticalScrollPolicy = "auto";    
                  }
                  catch(error:Error)
                              {
                               trace("Error : " + error.message);
                              }
                 }

               

               

               

              Thanks,

              Bhasker

              • 4. Re: Datagrid getting truncated during printing
                rudhirdeshkar Level 1

                Hi Bhasker,

                 

                Thanks a lot for responding quickly .

                I tried out the approach. But still I am not getting the full data grid in printing.

                 

                Is this the onUpdateComplete method, which is causing the problem? Or

                Is it the parent Vbox which contains the data grid which is casuing the problem?

                 

                Can you suggest for some alternative approach(es)?

                 

                Thanks,

                Rudhir

                • 5. Re: Datagrid getting truncated during printing
                  BhaskerChari Level 4

                  Hi Rudhir,

                   

                  Tell me onething actually you are having a scroll for your DataGrid or not. By seeing the code in your first post in updateComplete method you are giving the height of the DataGrid to be the height of the total items or rows. So by doing this you shouldn't get any scroll for your DataGrid.

                   

                  Can you show me the screenshot of the UI screen and also the print that you have taken...??

                   

                  Thanks,

                  Bhasker

                  • 6. Re: Datagrid getting truncated during printing
                    rudhirdeshkar Level 1

                    Hi Bhasker,

                     

                    The code is like :-

                     

                    <mx:VBox id="dataVBox"  width="100%" height="100%"
                                      paddingLeft="20" paddingRight="10" paddingTop="15" verticalGap="0">

                     

                                   <mx:DataGrid id="dataGrid" dataProvider="{arrCol}"
                                             width="100%" rowCount="{arrCol.length}"
                                             paddingLeft="0" paddingRight="0"  paddingTop="0" paddingBottom="0"
                                             fontSize="12" wordWrap="true" variableRowHeight="true" verticalScrollPolicy="off"
                                             >

                                             <mx:columns>
                                                  <mx:Array>
                                                           <mx:DataGridColumn dataField="product"
                                                               width="40" textAlign="left"
                                                               headerWordWrap="true" wordWrap="true"
                                                               headerText="Poduct}" sortable="true"/>
                                                           <mx:DataGridColumn dataField="cost"
                                                               width="30" textAlign="right"
                                                               headerWordWrap="true"  headerText="Cost"
                                                               sortable="false"/>

                                                  </mx:Array>

                                                </mx:columns>

                              </mx:DataGrid>

                     

                    </mx:VBox>

                     

                    Now, on the creationComplete of the application, I have called a function creationComplete = "onCreationComplete()" :-

                     

                    private function onCreationComplete():void

                    {

                         dataGrid.addEventListener(FlexEvent.UPDATE_COMPLETE, onUpdateComplete);

                    }

                     

                    The function onUpdateComplete is defined as :-

                     

                    private function onUpdateComplete(flEv:FlexEvent):void

                    {

                         var newHeight: Number ;

                         if ( this.arrCol)   
                                    {
                                        this.dataGrid.headerHeight=50;
                                        newHeight = dataGrid.measureHeightOfItems(0, this.arrCol.length) + this.dataGrid.headerHeight;
                                        this.dataGrid.height = newHeight;
                                        this.dataGrid.validateNow();
                                    }

                    }

                     

                    I am not getting any scroll in the datagrid, I am getting a scroll in the VBox "dataVBox". On print, the whole data grid is still not getting printed.

                     

                    Kindly provide some approach.

                     

                    Thanks,

                    Rudhir

                    • 7. Re: Datagrid getting truncated during printing
                      BhaskerChari Level 4

                      Hi Rudhir,

                       

                      I want you to post the snapshot of your Flex app UI and also the snapshot of your Print.

                       

                      Thanks,

                      Bhasker

                      • 8. Re: Datagrid getting truncated during printing
                        rudhirdeshkar Level 1

                        I can't supply the snap shot. Client constraints..

                        Please look into the code!!

                         

                        Hope you can provide some help from the code itself...

                        • 9. Re: Datagrid getting truncated during printing
                          UbuntuPenguin Level 4

                          If you are printing a datagrid , you should use the PrintDataGrid class.

                           

                          Here is a link demonstrating the goodness.

                          http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/mx/printing/PrintDataGr id.html

                          • 10. Re: Datagrid getting truncated during printing
                            rudhirdeshkar Level 1

                            Hi Bhasker,

                             

                            I observed something. When the datagrid's height is upto 1300, it is printing the whole thing, but when its 1800, its getting truncated.

                            Why is this behaviour?

                             

                            Thanks,

                            Rudhir

                            • 11. Re: Datagrid getting truncated during printing
                              rudhirdeshkar Level 1

                              Hi All,

                               

                              Eureka Eureka!!

                              I have finally found a solution to the problem.

                              All we need to do is, before adding the containerVBox to printJob, we have to set variableRowHeight="false" and the container Vbox's verticalScrollPolicy="off" and then send for printing. After this, we again need to set  variableRowHeight="false" and verticalScrollPloicy="auto" to retain original view. The printVBox height will be : printVBox.height = dataGrid.height .

                               

                              Its working fine now. Thanks Bhasker for providing with good pointers .

                               

                              Regards,

                              Rudhir