Developing multiple Creative Suite extensions
Requirements
Prerequisite knowledge
Experience with developing Creative Suite extensions and working within Creative Suite Extension Builder 1.5.
Required Adobe products (retail)
- At least one Creative Suite 5 (or later) product
User level
All
Required products
- Flash Builder (Download trial)
- CS Extension Builder 1.5 (Download trial)
- Extension Manager
When developing extensions for the Creative Suite there may be times when one panel cannot provide all the functionality that you would like to deliver. When this has occurred you may have developed a number of extensions and informed the user to install each individually or created additional windows within your panel to accommodate the different features. An alternative is to deliver a bundle that contains more than one extension. This tutorial will guide you through the steps of creating a Creative Suite extension bundle that contains a suite of extensions that can be installed by the user in one go.
Getting Started
In CS Extension Builder, create a new Project by choosing File > New > Adobe Creative Suite Extension Builder > Creative Suite Extension Project. Call the project MainExtension. Click Next. In the Configure Target Host Applications section select the product and version of the CS you want to target. For this tutorial we will use Adobe Illustrator CS5.5.
Click Finish. We now have our first extension project. We will use this as our main extension project.
MainExtension
The focus of this tutorial is to deliver multiple extensions in one bundle. Therefore we are not going to focus too much time with the content of the extensions. Edit the Actionscript class MainExtensionIllustrator.as and within the run function, add the following snippet of code:
var app:Application = Illustrator.app;
// create a new document
var document:Document = app.documents.add();
var text:TextFrame = document.textFrames.add();
text.contents = "Hello World!";
// text scale
var textArtRange:TextRange = text.textRange;
var characterCount:int = textArtRange.characters.length;
for (var j:int = 0; j < characterCount; j++)
{
var textCharacter:TextRange = textArtRange.characters.index(j);
textCharacter.characterAttributes.size = 28;
}
text.selected = true;
Now run the extension by selecting the project in the Package Explorer and choose Run > Run As > Adobe Illustrator Extension. In Adobe Illustrator when you click the Run AI code button you should see the following:
AdditionalExtension
The next step is to create another extension which can be included in our extension bundle.
- Create a new Creative Suite Extension Project.
- Call this extension AdditionalExtension.
- During the Configure Target Host Applications section use the same settings as the MainExtension project.
- Click Finish.
This additional extension will work with the TextFrame that we have created in MainExtension . Add the following code to the run function of AdditionalExtensionIllustrator .
AdditionalExtensionIllustrator.
var app:Application = Illustrator.app;
// get the current selection
var selection:Object = app.selection;
if (selection is Array)
selection = selection[0];
if (selection is TextRange || selection is TextFrame)
{
var textArtRange:TextRange = selection.textRange;
// retrieve the number of characters selected
var characterCount:int = textArtRange.characters.length;
for (var j:int = 0; j < characterCount; j++)
{
var textCharacter:TextRange = textArtRange.characters.index(j);
if ((j & 1) == 0)
{
// if the character number is odd, enlarge the font size.
textCharacter.characterAttributes.size = 48;
}
}
}
Creating a Multiple Extension Bundle
We currently have two extensions that work with Text Frames in Adobe Illustrator. We have tested the functionality and at the moment their behaviour is separate. However when running the additional extension we require that a Text Frame is already created and selected in the active Document. As the main extension creates a Text Frame as part of its run method it would be beneficial if we could trigger the loading of the additional extension once the run function is complete. With this additional step it then seems logical to combine the extensions so they can be delivered as an extension bundle.
Invoking an Extension
Edit the AdditionalExtension.mxml file and add a creationComplete event listener:
<mx:Application xmlns:mx=http://www.adobe.com/2006/mxml creationComplete="init()">
In the script section add the init() event handler:
private function init():void
{
CSXSInterface.getInstance().addEventListener(
com.adobe.csxs.events.InvokeEvent.INVOKE, extensionInvoked);
Within the init function we have added a CSXS event listener for InvokeEvent. This event will be dispatched when another flash panel attempts to start this extension. Add the extensionInvoked function so that it will bypass the button click and call the run function in AdditionalExtensionIllustrator.as
AdditionalExtensionIllustrator.as
private function extensionInvoked(
event:com.adobe.csxs.events.InvokeEvent):void
{
AdditionalExtensionIllustrator.run();
}
We now need to trigger the loading of the additional extension. Edit MainExtensionIllustrator.as and add the following snippet to the end of the run function:
CSXSInterface.getInstance().requestOpenExtension("com.example.additionalextension.extension1");
To find out the Extension ID, with your Creative Suite Extension project selected, right-click and choose CS Extension Builder > Bundle Manifest Editor. Select the Extension tab and as we only have one extension in our project, you will see the Extension ID listed in the General Information section.
Run the AdditionalExtension project and then use Attach As to include the updated version of the MainExtension project. When you click Run AI code, the Text Frame will be created and the additional extension loaded.
Adding an additional bundle
The previous step combined the two extensions into a workflow that created and then modified a Text Frame within Adobe Illustrator. Now we will modify the MainExtension project so it includes the AdditionalExtension project.
- Open the Bundle Manifest Editor for the MainExtension project and navigate to the Extensions tab.
- In the configuration section, click Add…
- If you expand the drop down you will see that we now have two extensions:
- With extension2 selected go to the different sections (General Information, Resources, Lifecycle, User Interface) and update the information.
- Include a Menu Name for the panel.
- Under Resources, in the SWF Path section select Project from the drop down.
- Select the AdditionalExtension project and the corresponding main MXML file.
- Save and close the Bundle Manifest Editor.
- Edit the
MainExtensionIllustrator.asfile and modify the name of the Extension ID so it reflects the newly added extension2 above:
CSXSInterface.getInstance().requestOpenExtension("com.example.mainextension.extension2");
When you now run the MainExtension project in Adobe Illustrator both panels will be updated. If you run the extension using Attach mode, both extensions will be loaded in the point product.
Exporting a multiple extension bundle
In the last section we combined our two Creative Suite extension projects into a multiple extension bundle. The next step is to export the extension bundle.
Please note that the previous sections should have been adequate steps to combine the multiple extensions bundle so that they are ready for exporting. However with the current release of CS Extension Builder 1.5 there is a known issue that prevents the .swf from the additional project being included in the exported bundle. To rectify this issue, open the Bundle Manifest Editor for the MainExtension and within the Extension tab select to modify extension2. In the Resources section change the SWF Path from Project to Path. Change the path to point to the AdditionalExtension.swf which is located in the MainExtension debug folder.
- Save and close the Bundle Manifest Editor.
- With the MainExtension project selected choose File > Export > Adobe Creative Suite Extension Builder > Creative Suite Extension.
- Enter the required fields.
- Click Finish.
You can now install the generated .zxp using Adobe Extension Manager CS5.5. Once installed in Extension Manager you will only have one extension listed. Open Adobe Illustrator and you will see both extensions listed in the Window > Extensions menu.
Where to go from here
- Extension Builder Forum
- CS SDK Forum
This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License
More Like This
- Adobe Creative Suite image conversion utility
- So you want to sell your Creative Suite extensions?
- Handling XMP Metadata with Creative Suite Extension Builder
- Skinning Creative Suite extensions
- Debugging Workflows in Creative Suite Extension Builder
- Overview of Adobe Creative Suite Extensibility
- Introducing CS Extension Builder 1.5
- Developing extensions for multiple versions of the Creative Suite
- Developing hybrid extensions with Creative Suite Extension Builder
