!j development
Programming Article:
Building and implementing graphical user interfaces
for VST plugins with
Macromedia® Flash®.
by !jdev
©2003-2006 !j development division audio
This article is copyrighted. All rights reserved. Don't publish entirely
or parts without explicit permission.
We have seen the article 1 "Designing VST
plugins completely 'visual' with Borland C++Builder®" and
learned, how easy it can be to build VST plugins with C++Builder®.
In this article we will describe, how we can integrate a Flash movie as
a GUI for a VST plugin. We use C++Builder and our VSTComponents VCL extension
to design the base plugin and to integrate the Flash ActiveX interface
into our plugins window.
Introduction
Macromedia Flash is a very popular technology for displaying interactive content on websites. But can we also use Flash for advanced things, i.e. for GUIs inside VST plugins?
The answer seems to be yes, because Flash is basically an ActiveX plugin
(at least on the Windows platform®). ActiveX plugins can be hosted
by any Windows application and thus integrated seamlessly inside other
applications. Flash offers far more than only simple frame based loop
animations. Flash has its own inbuilt high level programming language,
which makes enormous complex application programming possible. Flash is
also an open standard and enables great new possibilities for interchangeable
user interfaces. Knobs, sliders, popups, list views and all thinkable
other UI controls can be easily created with Flash.
A VST plugin is basically nothing other than a complete application, only
the executable file format is limited to load by other processes or applications,
it merely cannot be executed directly by the user. The only thing to do,
is to integrate a window in our VST plugin, because the Flash ActiveX
control has to reside inside an application with an valid window handle.
If we design a VST plugin with C++Builder, this is normally not a problem.
We simply add a Form to the project. So we can include a Flash plugin
(movie) into a VST plugin without any problems. We now use a Flash movie
to control a VST plugin completely with Flash and vice versa.
The implementation as an ActiveX plugin adds some additional benefits
to the development. The Flash ActiveX provides an interface for direct
access from inside the hosting application (our plugin). Unlike on Microsoft®
Internet Explorer® we don't need any external scripting to interact
with the Flash plugin. We can access the interface directly from inside
the C++ code.
Additionally we need a version of the Flash designer application to program
the graphical user interface with Flash's inbuilt ActionScript© for
this project. We have to use the original Macromedia Flash for this, because
this is the only application, which implements the full set of ActionScript.
We export the so designed Flash movie finally as a usual *.swf file and
include it in our project.
Finally we synchronize our plugins code to the Flash movie step by step to make our plugin fully functional (automate able).
Step 1: Adding the Flash ActiveX interface to C++Builder as a
VCL component
At first we want to make the integration of the Flash ActiveX
plugin as easy as possible with C++Builder. Fortunately C++Builder supports
the direct import of ActiveX controls into the VCL as a component. This
process is completely automated, so the only thing we have to do, is to
select the desired ActiveX control and compile it to a VCL component.
This requires of course, that we have installed an actual Flash plugin
on our system.
After this, we have a new component in our C++Builder component palette.
We can drop it to the Form and edit the properties like with any other
C++Builder component or control.
Step 2: Synchronizing the Flash movie with our VST plugin
To send data from the Flash movie to our VST plugin we use the FSCommand.
This command will be sent by the ActionScript inside a movie. The interface
of the Flash ActiveX provides an corresponding event "OnFSCommand",
so we can very easy access this mechanism to receive commands from the
movie. Those commands are in string (wide string) format, so we can theoretically
send unlimited variables and messages with this feature to our plugin.
The only thing to do, is to write a little command parser inside the OnFSCommand
event closure.
If the user moves a knob, we will get informed by the parameter change
and call the SetParameterAutomated() function of our VST plugin component.
Whatever, the sending of commands back to a Flash movie from our plugin
is not as easy as one may expect. There is no such command, which sends
strings to the movie. We can only set/modify some previously defined variables
inside a Flash movie with the interface function "SetVariable()".
Here we have to use a trick to get the movie synchronized with our VST
plugin. This is absolutely necessary for automation of VST plugins. Fortunately
there are some possibilities by using ActionScript inside a Flash movie.
A Flash movie has a definable "frame rate", this means, we can define a continuous triggered clock event inside the movie, which checks for changes of some variables. Usually the frame rate lies between 12 and 48 ticks per second. So we can set some variables with the SetVariable() function and then check for a change inside the movie and the execute some code to update our movie with the actual data.
In this way we have the expected bidirectional connection, necessary
for a VST plugin. But we have to take some attention to this process,
because it is very easy to occupy most of the processors capacity by a
flash movie. This would be dangerous for our real time audio processing
tasks. So we have to code our ActionScript very careful.
If the Host sets some parameters, the Flash movie will be updated to reflect
the changes. The checking code inside the Flash movie has to be as fast
as possible.
There is an very basic example plugin provided for download to demonstrate the interaction between a VST plugin with flash GUI. The example uses an flash movie from the "demo" files of Flash MX. There is no useful functionality inside this example...