Create the Designer in Runtime

This example shows how to create the report designer from code in runtime. First you need to create the new designer object of the StiDesignerFx class. Also you can set necessary parameters of the designer object, for example its position. After creation you can add the designer visual object to the main container of the application using the addElement() method:

private var _designer: StiDesignerFx;
public function get designer(): StiDesignerFx
{
return _designer;
}
public function set designer(value: StiDesignerFx): void
{
_designer = value;
}

private function createDesignerFx(): void
{
// Create new DesignerFx
designer = new StiDesignerFx;
// Set DesignerFx location
designer.left = 0;
designer.top = 0;
designer.right = 0;
designer.bottom = 0;
// Add DesignerFx to Application
addElement(designer);
}


To use this instance of the report designer, you can access to the designer property:

private function onLoadComplete(event: Event): void
{
...

// Create new report object
var report: StiReport = new StiReport();
// Load report from XML string
report.loadReportFromString(reportString);
// Design report in DesignerFx
designer.report = report;
}


In the screenshot below you can see the result of the sample code.

Create the Designer in Runtime