Spara bild från flash PDF Skriv ut Skicka sidan
2009-05-19 11:31

Flera gånger har tanken slagit mig att det vore bra om man kunde skapa filer från flash för användaren att antingen spara ner lokalt eller mot serverytan att senare använda. Detta går ju inte riktigt att göra i Flash som du säkert vet. Det går säkert att lösa med Air och det går att lösa med tredjepartsprogram om man kör en projektorfil, men inte på webben.

Just nu sitter jag i ett projekt där användaren sätter ihop en komposition av många bilder. Kompositionen ska sedan användas på flera olika sätt. Den ska kunna:

  • Skrivas ut
  • Sparas på servern som jpg och pdf för nedladdning
  • Skickas med e-post (i ett led där en bild först måste spara ner för att kunna skickas)

Nödvändiga klasser

I Flash har vi BitmapData som har många användningsområden, vi har också ByteArray för att optimera läsning, skrivning och arbete med binära data. Dessa två klasser är mycket användbara när man behöver skapa en bild. Men så behöver man några fler komponenter också. För att så mycket arbete som möjligt skall utföras av Flash så behöver man:

Thibault Imbert har skrivit om JPGEncoder klassen att istället för att använda array, använda Vector, vilket har snabbat upp processen upp till TRE GÅNGER. Shit, great job Thibault! Den nya klassen heter JPEGEncoder och laddas hem från länken ovan. OBS! Vector är nytt (en striktare typ av array) och kräver kompilering för flash player 10 och kommer alltså inte att funka om du sitter i Adobe Flash CS3.

Jag har använt mig av en WebService för .NET (skriven av Calle Mowday, http://doc.mowday.se) för att föra över bildens data till servern men det går att göra på många andra sätt.

import org.bytearray.images.JPEGEncoder;
import com.dynamicflash.util.Base64; 
var jpgSource:BitmapData = new BitmapData(min_bildkomposition.width, min_bildkomposition.height); 
jpgSource.draw(min_bildkomposition); 
var tEncoder:JPEGEncoder = new JPEGEncoder(85); 
var tData:ByteArray = tEncoder.encode(jpgSource); 
var tStr:String = Base64.encodeByteArray(tData);

Hur göra?

Nu har vi en sträng som innehåller all data som behövs för att skapa en jpg-bild och den är redo att skickas till servern.

import org.bytearray.images.JPEGEncoder; 
import com.dynamicflash.util.Base64; 
var jpgSource:BitmapData = new BitmapData(min_bildkomposition.width, min_bildkomposition.height); 
jpgSource.draw(min_bildkomposition); 
var tEncoder:JPEGEncoder = new JPEGEncoder(85); 
var tData:ByteArray = tEncoder.encode(jpgSource); 
var tStr:String = Base64.encodeByteArray(tData); 
var tHeader:URLRequestHeader = new URLRequestHeader("Content-type", "application/octet-stream"); 
var tServerPage:String = "min_server_app.aspx/php eller whatever..."; 
var tRequest:URLRequest = new URLRequest(tServerPage); 
tRequest.requestHeaders.push(tHeader); 
tRequest.method = URLRequestMethod.POST; 
tRequest.data = tData; 
navigateToURL(tRequest, "_blank"); 

Och på servern

Sedan kan vi ta emot det på servern. I php kan man lösa det så här (fast då behövs inte Base64 klassen):

if (isset($GLOBALS["HTTP_RAW_POST_DATA"])) 
{ 
 // get bytearray 
 $jpg = $GLOBALS["HTTP_RAW_POST_DATA"]; 
 // add headers for download dialog-box 
 header('Content-Type: image/jpeg'); 
 header("Content-Disposition: attachment; filename=minfinafil.jpg" echo $jpg; 
}

I.NET löste vi det genom att skicka en sträng (tStr) som var en Base64 kodad ByteArray till servern som i sin tur konverterar tillbaka och skapar jpg-filen:

protected override void OnLoad(EventArgs e) 
{ 
 base.OnLoad(e); 
 if (!string.IsNullOrEmpty(Request[“data”])) 
 { 
 byte[] jpg = Convert.FromBase64String(Request[“data”]); 
 Response.ContentType = “image / jpeg”; 
 Response.Headers.Add(“Content - Disposition”, “attachment; filename = minfinafil.jpg”); 
 Response.OutputStream.Write(jpg, 0, jpg.GetLength(0)); Response.End(); 
 } 
}

Vill man kan man ju också använda den nya klassen FileReference som finns i flash player 10 för att låta användaren spara bilden på sin dator utan att gå via servern, funkar klockrent:

private function save(e:MouseEvent):void
{
 var bmp:Bitmap = new Bild() as Bitmap;
 var bmd:BitmapData = bmp.bitmapData;
 var tJPGEncoder:JPEGEncoder = new JPEGEncoder(85);
 var tData:ByteArray = tJPGEncoder.encode(bmd);
 var t:FileReference = new FileReference();
 t.save(tData, "minfinafil.jpg");
}

import org.bytearray.images.JPEGEncoder;

Bedöm artikeln:
Skapad 2009-05-19 11:31 av Patric Jonsson

Visad 2360 gånger än så länge.

Senaste artiklarna av Patric Jonsson


Senast uppdaterad 2010-03-03 23:10

Lägg till kommentar


Medlemmar


Members Online: 0

Senaste registrerade

LisaRaichand : 22 april 2012 19:55pilu : 31 januari 2012 09:58Gostship99 : 07 januari 2012 19:37Director : 18 november 2011 05:44Dahlback : 17 november 2011 16:28mikwonwheels : 14 november 2011 13:20Kviddis : 04 oktober 2011 19:53buddha1966 : 25 september 2011 14:22idesign : 20 september 2011 08:45TxT : 05 september 2011 11:07ApelG : 05 september 2011 11:04
Partners
Adobe user group
fdt5-logo
TechSmith
Lynda user group
Apress user group
O´reilly user group
Peachpit user group
Friends Of Ed
Manning user group


Senaste blogginläggen

Av: Danel
-20.02.2012
Av: Patric Jonsson
-27.01.2012
Av: Patric Jonsson
- 3.01.2012
Av: Patric Jonsson
-29.11.2011
Av: Danel
-26.11.2011
Av: Patric Jonsson
-14.11.2011
Av: Patric Jonsson
- 8.11.2011
Av: Danel
- 7.11.2011
Av: Patric Jonsson
-27.09.2011

Senaste kommentarer

Senaste trådarna

Av Hallon
- 08/05/2012
Av goldensebbe
- 06/04/2012
Av Hallon
- 29/03/2012
Av buddha1966
- 06/03/2012
Av buddha1966
- 29/02/2012
Av Wide Circle
- 20/02/2012
Av zocstyle
- 15/02/2012
Av ufoalf30
- 05/01/2012
Av peterdavidsson
- 08/12/2011
Av JohnPaulie
- 03/12/2011
Av coffaldo
- 17/11/2011
Av buddha1966
- 05/11/2011
Av buddha1966
- 03/11/2011

Blogkalender

  • 2012 (3)
  • 2011 (37)
  • 2010 (85)
  • 2009 (18)
  • Vem är online

    Vi har 28 besökare online
    RSS
    Patric Jonsson - flashguru.se
    RocketTheme Joomla Templates