Salvando imagens da sua aplicação Flex no computador do Usuário

TargetSnapshot é mais um componente desenvolvido pela DClick. Ele permite salvar uma imagem de qualquer componente da aplicação na máquina do usuário. Veja o exemplo:

Para ter acesso ao código fonte: Botão Direito -> View Source.

Do lado da interface de usuário componente adiciona um comportamento interessante para destacar o componente cuja imagem será salva: os componentes que não forem o alvo ficam em tons cinza enquanto apenas o componente alvo apresenta as cores reais. Este comportamento é adicionado à aplicação simplesmente informando:

1
2
3
4
5

<controls:TargetSnapshot
label="Capturar Imagem"
actionDescription="Salvar Imagem"
targets="{[myColulmnChartPanel, myPiePanel, myLabel, myDateChooser]}"
actionClick="actionClickHandler(event)"/>

Na propriedade targets você informa os candidatos a terem sua imagem salva no computador do usuário. Esta facilidade é a principal vantagem deste componente do lado do Flex. Porém, falta ainda a parte do o Back-End que será responsável por enviar a imagem para a máquina do usuário.

O handler actionClickHandler é o responsável por enviar os dados da imagem para o Back-End criar a imagem e retorná-la para o computador do usuário.

No nosso exemplo, que não usa DataService, isto é feito através de um post simples graças a classe auxiliar “UploadPostHelper” desenvolvida por Jonathan Marston que é responsável por pegar um ByteArray e gerar o PostData como pode ser visto na linha 06 do trecho abaixo.

1
2
3
4
5
6
7
8
9
10

01. private function createURLRequest(snapshotByteArray:ByteArray, imageName:String):URLRequest
02.{
03. var urlRequest:URLRequest = new URLRequest("http://localhost:7001/upload/ProcessFileUpload.jsp");
04. urlRequest.contentType = 'multipart/form-data; boundary=' + UploadPostHelper.getBoundary();
05. urlRequest.method = URLRequestMethod.POST;
06. urlRequest.data = UploadPostHelper.getPostData(imageName, snapshotByteArray, {});
07. urlRequest.requestHeaders.push(new URLRequestHeader('Cache-Control', 'no-cache'));
08.
09. return urlRequest;
10.}

Feito isso a parte Java fica fácil. No blog do Jonathan Marston você encontra um exemplo de como fazer a mesma coisa com PHP.

Para este post eu contei com meu amigo Henrique Marino que foi quem propôs e implementou a parte do Back-end e a integração com Flex deste exemplo.

7 comentários

Jonas em 9.nov.07 às 8:15 pm

Não esta aparecendo o swf, acho q deve ter dado erro no upload
Rodrigo P. Fraga em 10.nov.07 às 9:20 pm

É verdade, não está carregando o .swf…..

=)
Beck Novaes em 12.nov.07 às 8:25 am

Obrigado por nos avisar. Resolveremos o problema assim que possível.
Henrique em 1.abr.08 às 1:58 pm

Não consigo ver o SWF.
Henrique em 3.abr.08 às 7:41 pm

Você poderia fornecer o código Java também?

Salvando imagens da sua aplicação Flex no computador do Usuário

7 comentários

Trackbacks

Deixe Seu Comentário