なんとなくちまちま。JSFLを勉強していたりします。で、Flash上で描いた線や塗りを、lineStyle(…)、beginGradientFill(…)の形式で出力するJSFLをつくってみました。特にグラデーションのパラメータはスクリプトで書くのが面倒なのがつくってみた訳です。
何かしらのシェイプを選択した状態で下記のJSFLを実行すると、こんな感じで出力されます。
lineStyle( 0, 0x000000, 1, false, "normal", "round", "round" ); beginGradientFill( "radial", [0xffffff,0x15aef7,0x000000], [1,1,0.8], [0,126,255], new Matrix(0.0251312255859375,0.0249786376953125,-0.0249176025390625,0.02508544921875,-21.049,-21.249), "reflect", "rgb", -0.49 );
一応、選択したシェイプに線があれば線の、塗りがあれば塗りのスクリプトを出力します。
留意する部分は、グラデーション塗りのMatrixで、出力されるMatrixは選択したシェイプの位置に依存するということ。Matrixにはグラデーションの位置や回転などの情報が入っていますが、基準点がシェイプが描かれているステージ、またはシンボルの基準点になります。つまり同じようなグラデーションをスクリプトで塗るには、座標的に同じ位置に塗らないといけないということです。
以下JSFLのスクリプトです。
/**
*
* out draw style
* author nutsu
* version 0.1
*
*/
//------------------------------------------------------------------------------------
var as2 = false;
startBatch();
//------------------------------------------------------------------------------------
function startBatch()
{
fl.outputPanel.clear();
//line stroke
var stroke = fl.getDocumentDOM().getCustomStroke("selection");
if( stroke.thickness )
outLineStyleCode(stroke);
//fill
var fill = fl.getDocumentDOM().getCustomFill("selection");
if( fill.style )
outFillStyleCode(fill);
}
//------------------------------------------------------------------------------------LINE
/**
* out line style
*/
function outLineStyleCode( stroke )
{
//thickness (0.05 is thin)
var thickness = ( stroke.thickness<0.1 ) ? 0 : stroke.thickness;
//color and alpha (#RRGGBBAA)
var colorstyle = parseColorStyle(stroke.color);
//pixelHinting
var pixelHinting = stroke.strokeHinting;
//scaleMode ( "normal"|"horizontal"|"vertical"|"none" )
var scaleMode = "\"" + stroke.scaleType + "\"";
//caps ( "none"|"round"|"square" )
var caps = "\"" + stroke.capType + "\"";
//joints ( "miter"|"round"|"bevel" )
var joints ="\"" + stroke.joinType + "\"";
//miterLimit
var miterLimit = stroke.miterLimit;
//out
var outcode = "lineStyle( ";
outcode += thickness + ", ";
outcode += colorstyle.color + ", ";
outcode += colorstyle.alpha + ", ";
outcode += pixelHinting + ", ";
outcode += scaleMode + ", ";
outcode += caps + ", ";
outcode += joints;
outcode += ( stroke.joinType=="miter" ) ? ", " + miterLimit : "";
outcode += " );"
fl.trace(outcode);
if( stroke.shapeFill.style=="linearGradient" || stroke.shapeFill.style=="radialGradient" )
outGradientCode( "lineGradientStyle", stroke.shapeFill );
}
//------------------------------------------------------------------------------------FILL
/**
* out fill style
*/
function outFillStyleCode( fill )
{
//style ("solid"|"linearGradient"|"radialGradient"|"noFill")
if( fill.style=="solid" )
{
//beginFill(color, alpha )
//color and alpha (#RRGGBBAA)
var colorstyle = parseColorStyle(fill.color);
//out
var outcode = "beginFill( ";
outcode += colorstyle.color + ", ";
outcode += colorstyle.alpha;
outcode += " );"
fl.trace(outcode);
}
else if( fill.style!="noFill" )
{
outGradientCode( "beginGradientFill", fill );
}
}
//------------------------------------------------------------------------------------OUT GRADIENT
/**
* out gradient
* funcName(type, colors, alphas, ratios, matrix, spreadMethod, interpolationMethod, focalPointRatio)
*/
function outGradientCode( funcName, fill )
{
//type
var gradientType = "\"" + convertGradientType( fill.style ) + "\"";
//colors and alphas
var colorstyles = parseColorArrayStyle(fill.colorArray);
//ratios
var ratios = "[" + fill.posArray + "]";
//matrix
var matrix = convertMatrix( fill.matrix );
//spreadMethod
var spreadMethod = "\"" + convertSpreadMethod(fill.overflow) + "\"";
//interpolationMethod
var interpolationMethod = "\"" + convertInterpolationMethod(fill.linearRGB) + "\"";
//out
var outcode = funcName + "( ";
outcode += gradientType + ", ";
outcode += colorstyles.colors + ", ";
outcode += colorstyles.alphas + ", ";
outcode += ratios + ", ";
outcode += matrix + ", ";
outcode += spreadMethod + ", ";
outcode += interpolationMethod;
outcode += ( fill.style=="radialGradient" ) ? ", " + convertFocalPointRatio(fill.focalPoint) : "";
outcode += " );"
fl.trace(outcode);
}
//------------------------------------------------------------------------------------PARSE COLOR
/**
* parse color
* @param color string "#RRGGBBAA" or "#RRGGBB"
* @return {color:color,alpha:alpha}
*/
function parseColorStyle( colorstr )
{
var color = colorstr.substring(1);
var alpha = 1.0;
if( color.length==8 )
{
alpha = Math.round((Number("0x" + color.substring(6))/0xFF)*100)/100;
color = color.substring(0,6);
}
color = "0x" + color;
if( as2 )
alpha = Math.round( alpha*100 );
return {color:color,alpha:alpha};
}
/**
* parse color array
* @param colors
* @return {colors:[],alphas:[]}
*/
function parseColorArrayStyle( cols )
{
var colors = [];
var alphas = [];
for( var i=0; i<cols.length ; i++ )
{
var colorstyle = parseColorStyle(cols[i]);
colors.push( colorstyle.color );
alphas.push( colorstyle.alpha );
}
return {colors:"["+colors+"]",alphas:"["+alphas+"]"};
}
//------------------------------------------------------------------------------------CONVERT TYPE
/**
* convert gradient type
* @param "linearGradient"|"radialGradient"
* @return "linear" or "radial" or "none"
*/
function convertGradientType( styleName )
{
if( styleName=="linearGradient" )
return "linear";
else if( styleName=="radialGradient" )
return "radial";
else
return "none";
}
/**
* convert spread method
* @param "extend","reflect","repeat"
* @return "pad", "reflect","repeat"
*/
function convertSpreadMethod( overflow )
{
overflow = overflow.toLowerCase();
if( overflow=="extend" )
return "pad";
else
return overflow;
}
/**
* convert interpolation method
* @param linearRGB:Boolean
* @return "linearRGB", "rgb"
*/
function convertInterpolationMethod( linearRGB )
{
return (linearRGB) ? "linearRGB" : "rgb";
}
/**
* convert focal point ratio
* @param -255 to 255
* @return -1 to 1
*/
function convertFocalPointRatio( focalPoint )
{
return Math.round((focalPoint/0xFF)*100)/100;
}
/**
* convert matrix
* @param matrix object
* @return "new Matrix(..)"
*/
function convertMatrix( mtx )
{
return "new Matrix(" +mtx.a+ "," +mtx.b+ "," +mtx.c+ "," +mtx.d+ "," +mtx.tx+ "," +mtx.ty+ ")" ;
}
印象として何気にあんまり使わない気がしますが、ないよりいいかなぁぐらいです。
ちなみに、Bitmap系のドローには対応しておりません…。