• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Possible to export KEYFRAMES as individual images?

Participant ,
Nov 30, 2022 Nov 30, 2022

Copy link to clipboard

Copied

In my timeline, I have frames that are sometimes on 2's, somtimes 4's, sometimes holding for dozens of frames. When I do "Export Movie" as PNG Sequence, it makes an image for every frame on 1's. For example, for the keyframe that is 4 frames long, it's exporting 4 identical images of that keyframe, rather than just 1 image for that keyframe. 

Is it possible so that the exported images reflect the keyframes, rather than every single 1 frame? 

Thank you.

TOPICS
How to , Import and export

Views

1.0K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Community Expert , Dec 02, 2022 Dec 02, 2022

Hi.

 

You just need to copy the code below, open up a text editor, paste the code and save it to a file ending in .jsfl.

 

Then you can:

- Double click on the file;

- Or drag and drop it over Animate's IDE;

- Or place it in the Commands folder to run it.

 

To run the code from the commands folder, place it in one of the following paths:

 

macOS:

/Users/<USER>/Library/Application Support/Adobe/<ANIMATE_VERSION>/<LANGUAGE>/Configuration/Commands

E.g.:

/Users/johndoe/Library/Application Support/Ado

...

Votes

Translate

Translate
Community Expert ,
Dec 01, 2022 Dec 01, 2022

Copy link to clipboard

Copied

that wouldn't make sense.  

 

if you want an image's duration to be one frame, make it a 1 frame image. or why make if more than 1frame?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Dec 01, 2022 Dec 01, 2022

Copy link to clipboard

Copied

You don't know what I'm using this for, and trust me, it makes sense.

I'm simply asking if this is possible.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 01, 2022 Dec 01, 2022

Copy link to clipboard

Copied

no, afaik it's not.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 01, 2022 Dec 01, 2022

Copy link to clipboard

Copied

Hi.

 

Save the code below in a .jsfl file and run it. I didn't test it throughly though.

 

The PNG settings are the same from File > Export > Export Image (Legacy)....

 

Export Keyframes as PNGs.jsfl

var dom = fl.getDocumentDOM();
var timeline = dom.getTimeline();
var layers = timeline.layers;
var baseLayer = 0; // change this number if the first layer is a folder or other type that possibly doesn't have frames
var frames = layers[baseLayer].frames;
var filePrefix = dom.name.replace(".fla", "") + "_"; // the prefix doesn't need to contain the FLA name
var zeros = 2; // 01, 001, 0002...
var folder;

function main()
{	
	if (!dom)
	{
		alert("Please open up a FLA first.");
		return;
	}
	
	folder = fl.browseForFolderURL("Choose an output directory.");

	if (!folder)
	{
		alert("No folder selected.");
		return;
	}

	var i;
	
	for (i = 0; i < frames.length; i++)
	{
		timeline.currentFrame = i;
		lookForKeyframes(i);
	}
}

function lookForKeyframes(frameIndex)
{
	var i, layer;
	
	for (i = 0; i < layers.length; i++)
	{
		layer = layers[i];
		
		if (layer.layerType === "folder")
			continue;
		
		var frame = layer.frames[frameIndex];

		if (frame.startFrame == frameIndex && !frame.isEmpty)
		{
			dom.exportPNG(folder + "/" + filePrefix + zeropad(frameIndex, zeros) + ".png", true, true);
			break;
		}
	}
}

function zeropad(number, length)
{
    var str = '' + number;
	
    while (str.length < length)
		str = '0' + str;
   
    return str;
}

main();

 

I hope it helps.

 

Regards,

JC

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Dec 01, 2022 Dec 01, 2022

Copy link to clipboard

Copied

Thank you.

How do I save the code in a .jsfl file? Sorry, I've never used code in Adobe Animate before.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 02, 2022 Dec 02, 2022

Copy link to clipboard

Copied

Hi.

 

You just need to copy the code below, open up a text editor, paste the code and save it to a file ending in .jsfl.

 

Then you can:

- Double click on the file;

- Or drag and drop it over Animate's IDE;

- Or place it in the Commands folder to run it.

 

To run the code from the commands folder, place it in one of the following paths:

 

macOS:

/Users/<USER>/Library/Application Support/Adobe/<ANIMATE_VERSION>/<LANGUAGE>/Configuration/Commands

E.g.:

/Users/johndoe/Library/Application Support/Adobe/Animate 2023/en_US/Configuration/Commands

 

Windows:

<BOOT_DEVICE>\Users\<USER>\AppData\Local\Adobe\Animate <ANIMATE_VERSION>\<LANGUAGE>\Configuration\Commands

E.g.:

C:\Users\johndoe\AppData\Local\Adobe\Animate 2021\en_US\Configuration\Commands

 

Then you can run the command in Animate by going to Commands > Your Command Name.

 

Export Keyframes as PNGs.jsfl. (the code has been updated in 12/02/2022)

var dom = fl.getDocumentDOM();
var timeline = dom.getTimeline();
var layers = timeline.layers;
var baseLayer = 0; // change this number if the first layer is a folder or other type that possibly doesn't have frames
var frames = layers[baseLayer].frames;
var filePrefix = dom.name.replace(".fla", "") + "_"; // the prefix doesn't need to contain the FLA name
var digits = 2; // 01, 001, 0002...
var folder;

function main()
{	
	if (!dom)
	{
		alert("Please open up a FLA first.");
		return;
	}
	
	folder = fl.browseForFolderURL("Choose an output directory.");

	if (!folder)
	{
		alert("No folder selected.");
		return;
	}

	var i;
	
	for (i = 0; i < frames.length; i++)
	{
		timeline.currentFrame = i;
		lookForKeyframes(i);
	}
}

function lookForKeyframes(frameIndex)
{
	var i, layer;
	
	for (i = 0; i < layers.length; i++)
	{
		layer = layers[i];
		
		if (layer.layerType === "folder")
			continue;
		
		var frame = layer.frames[frameIndex];
		
		if (!frame)
			continue;

		if (frame.startFrame == frameIndex && !frame.isEmpty)
		{
			dom.exportPNG(folder + "/" + filePrefix + zeropad((frameIndex + 1), digits) + ".png", true, true);
			break;
		}
	}
}

function zeropad(number, length)
{
    var str = '' + number;
	
    while (str.length < length)
		str = '0' + str;
   
    return str;
}

main();

 

JSFL file download:

https://bit.ly/3ER3YEC

 

There's one edge case that I found in which the code won't detect a change in the visual of the timeline. I'll update the code if I can think of a solution.

 

Please let us know if you have any further questions.

 

Regards,

JC

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Dec 02, 2022 Dec 02, 2022

Copy link to clipboard

Copied

Wow, this is exactly what I needed! It works.

Thank you so much for this!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 02, 2022 Dec 02, 2022

Copy link to clipboard

Copied

Excellent! You're welcome!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Nov 06, 2023 Nov 06, 2023

Copy link to clipboard

Copied

Is it possible to modify the code so that an animation is exported as a single composite .png image?

I am creating a VST skin using XML and it requires one png with the all of the frames stacked in line, so a bit like a filmstrip.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Contributor ,
Nov 10, 2023 Nov 10, 2023

Copy link to clipboard

Copied

LATEST

Can it be configured to only export keyframes that have a label?


____
2D vector animator since 2000 & PhD

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines