Crear de propiedades de símbolos editables mediante JavaScript
Al guardar un símbolo de componente, Fireworks guarda un archivo PNG en las siguientes carpetas predeterminadas:
(Windows XP) <usuario>\Datos de programa\Adobe\Fireworks CS4\Common Library\Custom Symbols
(Windows Vista) \Users\<usuario>\AppData\Roaming\Adobe\Fireworks CS4\Common Library\Custom Symbols
(Mac OS) <usuario>/Soporte de aplicación/Adobe/Fireworks CS4/Common Library/Custom Symbols
Para crear un símbolo de componente, se debe crear y guardar un archivo JavaScript con extensión .JSF en la misma ubicación y con el mismo nombre que el símbolo. Por ejemplo, miboton.grafico.png crearía un archivo JavaScript con el nombre miboton.jsf.
El panel de creación de scritps de símbolos permite a los usuarios que no son programadores asignar atributos de símbolo simples y crear el archivo JavaScript automáticamente. Para abrir este panel, seleccione la opción para crear scripts de símbolos en el menú Comandos.
Crear el archivo JavaScript
Para añadir parámetros editables al símbolo, es necesario definir dos funciones en el archivo JavaScript:
function setDefaultValues() –define los parámetros que se pueden editar y los valores predeterminados de esos parámetros.
function applyCurrentValues() –aplica al símbolo gráfico los valores especificados en el panel Propiedades de símbolo.
El siguiente es un ejemplo de archivo .JSF para crear un símbolo personalizado:
function setDefaultValues()
{
var currValues = new Array();
//to build symbol properties
currValues.push({name:"Selected", value:"true", type:"Boolean"});
Widget.elem.customData["currentValues"] = currValues;
}
function applyCurrentValues()
{
var currValues = Widget.elem.customData["currentValues"];
// Get symbol object name
var Check = Widget.GetObjectByName("Check");
Check.visible = currValues[0].value;
}
switch (Widget.opCode)
{
case 1: setDefaultValues(); break;
case 2: applyCurrentValues(); break;
default: break;
}
This sample JavaScript shows a component symbol that can change colors:
function setDefaultValues()
{
var currValues = new Array();
//Name is the Parameter name that will be displayed in the Symbol Properties Panel
//Value is the default Value that is displayed when Component symbol loads first time. In this
case, Blue will be the default color when the Component symbol is used.
//Color is the Type of Parameter that is displayed. Color will invoke the Color Popup box
in the Symbol Properties Panel.
currValues.push({name:"BG Color", value:"#003366", type:"Color"});
Widget.elem.customData["currentValues"] = currValues;
}
function applyCurrentValues()
{
var currValues = Widget.elem.customData["currentValues"];
//color_bg is the Layer name in the PNG that will change colors
var color_bg = Widget.GetObjectByName("color_bg");
color_bg.pathAttributes.fillColor = currValues[0].value;
}
switch (Widget.opCode)
{
case 1: setDefaultValues(); break;
case 2: applyCurrentValues(); break;
default: break;
}
Para comprender mejor la manera de utilizar el archivo .JSF para personalizar propiedades de símbolos, examine los componentes de ejemplo incluidos con el software.
PDF (adobe.com)
