Flash Components Sample

With ASP.NET Turbine 7 you can include components from other Flash movies and you can customize them at your own will. These examples demonstrate the basic concepts about placing components and how easy it is to inject external data to them.

These demos use standard components included with the Flash MX editor.

Placing a Component

This example shows how to include a component located in a swf file.

To accomplish the same results directly from the scripting interface, we could write (component1.aspx):

// include the component definition file
Turbine.Include("flistboxsymbol.swf");

// place the component
Turbine.Create("<place component='ListBox' pos='10,10' instance='lst'>");

// now generate the movie to the web browser
Turbine.GenerateFlash();

And the final result is:

Passing Parameters to Components

This example shows how to pass parameters to a component. Turbine automatically assumes defaults for any parameters that you don't define. On this particular example, we are going to pass some values to the component in the labels argument:

To accomplish the same results directly from the scripting interface, one could write (component2.aspx):

// include the component definition file
Turbine.Include("flistboxsymbol.swf");

// place the component and pass a value to the labels argument
Turbine.Create("<place component='ListBox' pos='10,10' instance='lst'>
<param name='labels' value=\"['first', 'second', 'one more']\"/>
</place>");

// now generate the movie to the web browser
Turbine.GenerateFlash();

And the final result is:

Injecting Data to Components

There are components that can accept data sources, for example DataProvider sources. For these components, Turbine supports a mechanism called data injection which makes it very easy to pass data to them, without any scripting effort.
This particular example shows how to inject data to a common ListBox component:

To accomplish the same results directly from the scripting interface, one could write (component3.aspx):

// include the component definition file
Turbine.Include("flistboxsymbol.swf");

// place the component and pass a value to the labels argument
Turbine.Create("<place component='ListBox' pos='10,10' instance='lst'/>");

// read a DataSet from XML
Turbine.LoadDataSet("dataset.txt", "data", "row", "value");

// pass the data to the component
Turbine.InjectData("data", "lst");

// now generate the movie to the web browser
Turbine.GenerateFlash();

The contents of the integrated XML file dataset.txt are:

<row>
  <value>orange</value>
</row>
<row>
  <value>apple</value>
</row>
<row>
  <value>banana</value>
</row>
<row>
  <value>mango</value>
</row>
<row>
  <value>strawberry</value>
</row>
  <row>
<value>grape</value>
  </row>
<row>
  <value>pear</value>
</row>
<row>
  <value>blueberry</value>
</row>

And the final result is:

Several Components Living Together

This final example shows how to include several components in one single movie, coming from different locations.

The script (component4.aspx) that loads the components and populates them with data is:

// include the component definition files
Turbine.Include("flistboxsymbol.swf");
Turbine.Include("checkbox.swf");
Turbine.Include("combobox.swf");
Turbine.Include("draggablepane.swf");
Turbine.Include("ticker.swf");

// read some data
Turbine.LoadDataSet("dataset.txt", "data", "row", "value");

// place a Listbox
Turbine.Create("First instance of ListBox");
Turbine.Create("");

// place another Listbox
Turbine.Create("Second instance of ListBox");
Turbine.Create("");

// fill it with data
Turbine.InjectData("data", "lst_veg");

// place a CheckBox
Turbine.Create("Instance of CheckBox");
Turbine.Create("");

// place a ComboBox and inject some data
Turbine.Create("Instance of ComboBox");
Turbine.Create("");
Turbine.InjectData("data", "combo");

// place a Ticker
Turbine.Create("Instance of Ticker");
Turbine.Create("");
Turbine.LoadDataSet("dataset_ticker.txt",
"data_ticker", "row", "text, textColor, border, underline, bullet");
Turbine.InjectData("data_ticker", "tck");

// place a DraggablePane
Turbine.Create("<place component='DraggablePane' pos='290,30' size='240,118' alpha='70'><param name='Pane Title' value='A Custom Title'/></place>");

// now generate the movie to the web browser
Turbine.GenerateFlash();

And the final result is: