Detta fallstudie visar hur man använder PrintAdvancedDataGrid och en anpassad itemRenderer att skriva ut flera sidor med data och grafik, med hjälp av SWFloader komponent.
Slutresultatförhandsvisning
Låt oss ta en titt på det slutliga resultatet vi kommer att arbeta för - Nedan följer en 12-sidig PDF-utskrift från en Flex-applikation med hjälp av teknikerna i den här artikeln:
Demonstrerad i denna handledning:
Använda FlexPrintJob-klassen.
Använder sig av PrintAdvancedDataGrid.
Skapa en anpassad itemRenderer med en SWFLoader.
Skriva ut en rubrik och sidfot.
Filtrera a collectionView.
Skriva ut a Datanätet med höjd som överstiger 7500.
Några svårigheter med hänsyn till flexutskrift:
Ditt innehåll eller Datanätet rader måste alla vara synliga på scenen eller de kommer inte att skrivas ut.
Lägga till manuella sidbrytningar är svårt och uppnås genom att du ställer in Radhöjd för att matcha vad du vill visas på varje utskriven sida.
Flex-utskrift går haywire om din totala PrintAdvancedDataGrid innehållshöjd är större än cirka 7500 pixlar, vilket kräver en lösning av flera PrintAdvancedDataGrids.
Steg 1: Importera utskriftsklasserna
Börja med att importera de nödvändiga skrivarklasserna, såväl som din skrivare i Flex-projektet:
Steg 2: Skapa en vy för PrintAdvancedDataGrid och itemRenderer
Skapa en vy Stat för massutskrift. I mitt fall skapade jag ett tillstånd som heter printState.
* Alternativt kan du skapa en instans av din PrintAdvancedDataGrid och itemRenderer och lägg till dem på scenen via actionscript, men för ett bulkprojekt fann jag att det var för svårt att arbeta med, och när jag försökte skriva ut SWF-filer som är XML-drivna, behövde jag se till att mina SWF-filer var visar korrekt innan du skriver ut.
Steg 3: Lägg till din PrintAdvancedDataGrid
Om du behöver ett totalt utskriftsområde som är större än 7500 i höjd, behöver du en annan PrintAdvancedDataGrid för varje område
Steg 4: Ställ in din PrintAdvancedDataGrid alternativ
En sak som jag tyckte var viktigt var att ställa in alternativet
sizetoPage = "true"
Enligt PrintDataGrid Control-sidan från Adobe Flex 3 LiveDocs säkerställer egenskapen sizeToPage att PrintAdvancedDataGrid-kontrollen tar bort några synliga eller tomma rader och att ändra storlek för att bara inkludera rader i den aktuella vyn.
Steg 5: Lägg till din itemRenderer
Lägg till ett objektRenderer till din AdvancedDataGridColumn.
Steg 6: Skapa itemRenderer Komponent
I mitt fall ville jag göra flera saker med itemRenderer:
Lägg till en SWFLoader
lägg till en rubrik med sidtiteln
lägg till en sidfot med min webbadress
Lägg till mellanrum till toppen, botten och sidorna för korrekt utskrift
Eftersom min webbadress fungerade bättre som vertikal text fann jag det mycket bättre att använda en SWF för den här texten i stället för en textruta. Du kan vara kreativ med din itemRenderer, lägger till dataobjekt från din XML- eller datakälla samt logotyper, webbadresser etc. Här visas visningsobjekten från min kod till itemRenderer komponent, som också finns i src / com / reiman / PrintItemRenderer.mxml filen i hämtningspaketet för denna handledning:
Steg 7: Lägg till Basic ActionScript FlexPrintJob Kod till din main.mxml-fil
public function print (): void var printJob: FlexPrintJob = ny FlexPrintJob (); printJob.printAsBitmap = false; om (printJob.start ()) printJob.addObject (printGrid); PrintJob.send ();
Steg 8: Ställ in PrintJob Skal typ
Välj den PrintJob skala typ du vill använda (för att läsa om FlexPrintJob skala, kolla Flex LiveDocs-sidan här) och ställ in alternativet printAsBitmap alternativ. Jag ville att mina artiklar skulle skrivas ut som vektor, och i själva verket var den här inställningen nyckeln till min utskriftsutskrift korrekt.
printJob.printAsBitmap = false;
Steg 9: Lägg till kod för att exekvera före PrintJob
Lägg till några varningar eller åtgärder du vill utföra vid utskrift (t.ex. en varning för att berätta för användaren att slå på LANDSCAPE-utskrift). Till exempel:
Alert.show ("Ange dina skrivarinställningar till LANDSCAPE" + "\ n '+" eller din frågesport kommer INTE att skrivas ut korrekt! ")
Om du vill ställa in en Varna, det måste utföras innan din utskrift börjar. Vänligen kolla på koden i nedladdningen som associeras med denna handledning för printAlert () i main.mxml fil.
Steg 10: Ställ in din utskrift bredd och höjd variabler
Ställ in din före utskrift bredd och höjdvärden för PrintAdvancedDataGridbredd, och Radhöjd
var before_widdy = printColumn.width; var before_hiddy = printGrid.rowHeight; var widdy = printJob.pageWidth; var hiddy = printJob.pageHeight;
Steg 11: Ange de nya värdena
Ange de nya värdena för höjd, bredd, och Radhöjd att jämföra FlexPrintJob värden
Steg 12: Lägg till flera sidor Kod till FlexPrintJob
Lägg till din kod så att du kan lägga till flera sidor till PrintJob. Enligt Flex LiveDocs, detta nästa sida() checken ska säkerställa att ditt innehåll skrivs ut korrekt oavsett din AdvancedDataGrid höjd, trots att jag upptäckte att efter en höjd av cirka 7500 misslyckades inte utskriften korrekt.
medan (sant) printGrid.nextPage (); om (! printGrid.validNextPage) printJob.addObject (printGrid); ha sönder;
Steg 13: Valfritt Justera printGrid Höjd
Jag fann att jag fick färre utskriftsfel när jag lade till koden från steg 12:
medan (sant) printGrid.nextPage (); om (! printGrid.validNextPage) printGrid.height = printGrid.measuredHeight; printGrid.verticalScrollPolicy = "off"; printJob.addObject (printGrid); ha sönder;
Det här tycks ha att göra med Flex 3s problem eller bugg när det gäller utskriftsdatabaser med stor höjd, vilket är ett verkligt problem för att skriva ut saker som flera SWF-filer eller bilder eftersom din datagridhöjd faktiskt ska återspegla bildens totala höjd eller SWF skrivs ut!
Steg 14: Lägg till koden för att lägga till något annat till din PrintJob
Stäng din PrintJob, och utföra ytterligare funktioner som en Varna, och återställa printGrid och printColumn värderar tillbaka till vad de var före utskrift. Om du använder en vy för utskrift, där användaren kanske har en Utskriftscenter typ gränssnitt där de kan se vad de ska skriva ut, skulle det vara användbart. Om du väljer att lägga till PrintAdvancedDataGrid till scenen via actionscript, då skulle det vara onödigt, och i det här steget skulle du istället ta bort PrintAdvancedDataGrid från scenen.
Steg 16: Lägg till en annan PrintAdvancedDataGrid om ditt innehåll överstiger 7500 höjd
Steg 17: Kopiera din dataprovider och resultHandler
Mitt datasamtal såg ut så här ursprungligen:
Allt jag behövde göra var att lägga till en extra resultathanterare så att data för den andra PrintAdvancedDatagrid skulle vara separat:
Sedan lade jag till en ny resultathanterare:
privat funktion httpResult_handler2 (evt: ResultEvent): void if (evt.result.lessons.row) var resultAC: ArrayCollection = evt.result.lessons.row som ArrayCollection; för (var i: int = 0; i
Den här nya dataprovider för den andra PrintAdvancedDatagrid är inställd i min stripQuiz2 () filterfunktion.
Steg 18: Lägg till collectionView Variabler och ytterligare dataprovider
I mitt fall behövde jag lägga till 3 nya ListCollectionViews och ytterligare 1 dataprovider:
[Bindbar] privat var removeQuiz: ListCollectionView = ny ListCollectionView (); [Bindbar] privat var removeQuiz2: ListCollectionView = ny ListCollectionView (); [Bindable] private var itemsQuiz: ListCollectionView = ny ListCollectionView (); [Bindbar] privat var lessonsDataProvider2: ArrayCollection = new ArrayCollection ();
Steg 19: Lägg till filterFunction funktioner
För de två datagrundorna som jag ville skriva ut från behövde jag filter som skulle utföra följande funktioner:
Ta bort vissa typer av aktiviteter från min utskriftslista, eftersom vissa inte var nödvändiga
Avkorta data vid 12 poster, eftersom efter omfattande testning fann jag att det här var gränsen för att skriva ut fullständiga SWF-filer från datagrid
Ta bort de första 12 inmatningarna från ListCollectionView för 2: a PrintAdvancedDatagrid
Detta resulterade i skapandet av följande funktioner:
För en bättre titt på hela koden, ladda ner källfilerna som är associerade med den här handledningen och kolla på main.mxml fil.
Slutsats
Det här kanske inte är den mest eleganta lösningen för bulkutskrift SWF från Flex, men det är en lösning som jag hittade på ett tillförlitligt sätt med högkvalitativ produktion. Utskrift i Flex kan vara en riktig björn, men det betyder inte att du bör förbise de alternativ som är tillgängliga för dig, särskilt genom användning av PrintDatagrid och PrintAdvancedDatagrid. Tack så mycket för att du läste min handledning, och jag ser fram emot några frågor och kommentarer du kanske har.
Share
Accentsconagua
