Edit Report in the Designer

This example shows how to edit a report template in the designer. For creating and showing the designer from code you will need to call the StiDesignerFx.initialize() static method. Call this method in the initialize event of the application:

<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
minWidth="1024" minHeight="768" backgroundColor="#e8e8e8"
initialize="onInitialize()" xmlns:viewer="stimulsoft.viewer.*">

...

private function onInitialize(): void
{
StiDesignerFx.initialize();

...
}


To edit a report in the designer you need to load a report file, for example assign it to the reportString variable. Then you need to create the StiReport object and load the report from this string a variable using the loadReportFromString() method. After these actions you can edit the report in the designer using the design() method:

private function onDesignReportClick(): void
{
// Create new report object
var report: StiReport = new StiReport();
// Load report from XML string
report.loadReportFromString(reportString);
// Design report in Designer
report.design();
}


Also you can show the report designer as a dialog window. Simply change the design() method to designDialog() method, all other actions are the same:

private function onDesignInDialogWindowClick(): void
{
// Create new report object
var report: StiReport = new StiReport();
// Load report from XML string
report.loadReportFromString(reportString);
// Design report in dialog window
report.designDialog();
}


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

Edit Report in the Designer