bonus630

`Desenvolvimento em php, c#, javascript, android...`


Categorias



qrcode Tutorial - Criar extensão para photoshop, redimensionador de imagens, javascriptVisualize esta página no seu Smartphone com este QRcode


CSS válido!


Desenvolvimento em php, c#, javascript, android. Aplicações web com php e javascript, aplicações desktop com c#, e mobile android. Integração de sistemas web e local.

Criação de adicionais para aplicativos de terceiros com suporte, photoshop com javacript para criação de tarefas automatizadas entre outras funções, coreldraw com c# para automatizar,calcular, e integrar com web e outros sistemas.


Geospeleo Estudos Espeleológicos


Corel na Veia


Se você não é "poweruser", utilize um antivírus n


Visual Studio CorelDraw Addon Template


Melhor Hospedagem Grátis
Web hosting



> > >

Criar extensão para photoshop, redimensionador de imagens, javascript

Autor: | Categoria: Javascript


Bom neste tutorial vamos ver como criar nossa primeira extensão para o photoshop utilizando javascript, extensões em geral são ótimas para a realização de tarefas repetitivas e cálculos avançados. Nesta que demostrarei neste artigo, será uma simples extensão que redimensiona imagens, somente para nosso primeiro aprendizado, ela terá uma pequena janela onde definimos a largura máxima da imagem, e a altura máxima, a extensão calculara a proporção para não distorcer a imagem e não exceder os valores máximos definidos, onde todas imagens landscape e portrait e as quadradas serão processadas ao mesmo tempo, após a definição dos tamanhos máximos e a seleção das imagens nenhuma interação com o usuário será necessária.

Vou utilizar o Photoshop cs6, e o Adobe ExtendScript para programar, outros editores de textos podem ser utilizados porém utilizando o ExtendScript é muito mais fácil o debug da extensão.

Abra o photoshop e sem seguida o ExtendScript


Crie um novo Documento javascript, e no dropbox abaixo selecione o photoshop, o ícone de corrente deve ficar verde, isso indica que seu ExtendScript está conectado com o photoshop, possibilitando o debug.


Passo Vamos para o Código


Vamos programar, um dos objetos mais importantes é o "app", ele contem uma serie de métodos e propriedades referentes aos documentos abertos no photoshop e entre outras. Por exemplo para você acessar o documento aberto em plano de frente do seu photoshop você utilizara app.activeDocument.

Primeiramente vamos construir nossa janela, onde serão digitados os valores da largura e altura, utilize a classe Window para esta tarefa. Esta possui os métodos add(), show() e close().O método add(), adiciona um componente a nossa janela, static text, edit text, radio button, button, panel, check box dentre outros, o método show() como o próprio nome diz exibi a janela, e o close() a fecha. Veja abaixo:



Clique em f5 para debugar seu código, ou clique no botão play, se seu código estiver correto o photoshop irá exibir a janela.

Sua janela deve estar mais ou menos assim:




Vamos criar uma função, vou chama-lá de "start", está vai setar os valores da largura e da altura máxima para uma variáveis, vai abrir uma janela de seleção da imagens, para que o usuário possa selecionar as imagens a trabalhar.


Vamos criar a função "processFile", está irá de fato redimensionar a imagem e fechar o arquivo para nosso photoshop não consumir muita memoria, essa função não tem nada de muito especial, somente redimensiona as imagens obedecendo suas proporções, somente a algumas considerações a se explicar.
"app.activeDocument" -> Recupera o documento em foco no photoshop, ou seja, o que está a frente de todos.
"app.activeDocument.path" -> Recupera o caminho do arquivo, será útil para salvarmos nossas futuras imagens.
"app.activeDocument.name" -> Recupera o nome do arquivo, mesmo caso que o anterior, usaremos para salvar a futura imagem.
"app.activeDocument.width.as("px")" -> Recupera a largura do arquivo em pixels, você pode recuperar em cm,inch entre outros.
"app.activeDocument.height.as("px")" -> Recupera a altura do arquivo em pixels, você pode recuperar em cm,inch entre outros.
"app.activeDocument.resizeImage()" -> Redimensiona a imagem passando três parâmetros, largura, altura e resolução.
"(new Folder("path")).create()" -> Cria um novo diretório no caminho passado no construtor.
"app.activeDocument.close()" -> Fecha o arquivo.


Agora por fim criaremos a função que irá salvar nosso imagem em arquivo, no script pronto para o download so temos a função que salva em jpg, como vocês podem observar, em nosso "processFile" temos um "switch" que pode conter todos os formatos de imagem, e para cada destes formatos é necessário uma função especifica pois cada formato de imagem diferente temos que preparar o arquivo de forma especifica. Temos que usar um objeto especifico para cada formato e passar os parâmetros, no caso do jpg usaremos "new JPEGSaveOptions()" , e passaremos a qualidade, o mate, o perfil de cores, esses parâmetros podem ser observados quando se manda salvar um arquivo normalmente no photoshop, e uma janela aparece pedindo para setamos os valores.Veja imagem abaixo:


Nossa função ficará assim:


Destacando no código "doc.saveAs(saveFile, saveOp, false, Extension.LOWERCASE); "

onde:

"doc" -> É nosso "app.activeDocument"
"saveFile" -> new File("path")
"saveOp" -> "new  JPEGSaveOptions()"
"false" -> Não exibirá janela de salvar como, isso significa que a imagem será salva diretamente, se for utilizado "true" aparecerá uma janela pedindo para salvar. 
Extension.LOWERCASE -> Deixa a extensão de nosso arquivo em caixa baixa.

Então como isso nosso script já funciona, se você não quiser abrir o dialogo que pede para selecionar as imagens, você pode abrir um dialogo que seleciona uma pasta, e depois recuperar todos os arquivos dentro dele, por exemplo:
var pasta = Folder.selectDialog ("Abri uma pasta");
var arquivos = pasta.getFiles("*.jpg");
for(i=0;i
    app.load(arquivos[i]);

Este código pegará todos os arquivos .jpg dentro da pasta selecionada na janela.

Em breve estarei trazendo as funções para salvar outros formatos de arquivos, entre outras coisas.


Demostração



Script Pronto




Voltar

C
o
m
e
n
t
a
r


Mostrar Comentários
Bonus630

/bonus630 /bonus630 /bonus630 /bonus630 email Linkedin /bonus630 bonus630@hotmail.com @bonus630 /bonus630
Todos os Direitos Reservados - Bonus630
Criado e desenvolvido por Reginaldo
Email:Bonus630@gmail.com

Mostrar Citações