Add component for the design to have been displayed

Stimulsoft Reports.JS discussion
Post Reply
wprmdev
Posts: 15
Joined: Fri Jun 07, 2019 6:52 pm

Add component for the design to have been displayed

Post by wprmdev »

Hello. I'm trying to insert a component into my report while editing it in Designer.

What I want to do is:

1 - Open the designer with a default template.
2 - User would click on a button my "add barcode"
3 - Add a previously configured barcode field on the screen. (That part is the problem)

If I create the field before the designer is rendered I can see the component there. But the same code has no effect if the design is already loaded.

Code I used for testing:

Code: Select all

	var designer = new Stimulsoft.Designer.StiDesigner(options, "StiDesigner", false);

	// Create a new report instance
	var report = new Stimulsoft.Report.StiReport();
	// Load report from url
	report.loadFile("./template.mrt");
	// Edit report template in the designer
	designer.report = report;
	
	designer.renderHtml('design-container');
	
	const page = report.pages.getByIndex(0);

     var myText = new Stimulsoft.Report.Components.StiText(new Stimulsoft.System.Drawing.Rectangle(-0.5, page.height, 0.5, 15));
     myText.text = "My sample text";
     myText.font = new Stimulsoft.System.Drawing.Font("Arial", 8, "Point", 2);
     myText.textOptions = new Stimulsoft.Base.Drawing.StiTextOptions();
     myText.textOptions.angle = 90;
     page.components.add(myText);
     
     // If you change that line to here it works. But it's not what I need.
    //  designer.renderHtml('design-container');
wprmdev
Posts: 15
Joined: Fri Jun 07, 2019 6:52 pm

Re: Add component for the design to have been displayed

Post by wprmdev »

Sample code. Text component is visible in preview but not in editor.
But if I pass the top -2 in the preview I am informed that the component is out of bounds and an option to correct appears. When accepting the correction, the text appears in the editor.
Attachments
sample.zip
(2.71 MiB) Downloaded 95 times
Max Shamanov
Posts: 768
Joined: Tue Sep 07, 2021 10:11 am

Re: Add component for the design to have been displayed

Post by Max Shamanov »

Hello,

We need some additional time to investigate the issue, we will let you know about the result.

Thank you.
Kirill Klimenkov

Re: Add component for the design to have been displayed

Post by Kirill Klimenkov »

Hello.

Please, move the renderHtml method to the very end of your createDesigner function

Code: Select all

var designer = new Stimulsoft.Designer.StiDesigner(options, "StiDesigner", false);

// Create a new report instance
var report = new Stimulsoft.Report.StiReport();
// Load report from url
report.loadFile("./template.mrt");
// Edit report template in the designer
window.designer = designer;
window.report = report;

const page = report.pages.getByIndex(0);

var myText = new Stimulsoft.Report.Components.StiText(new Stimulsoft.System.Drawing.Rectangle(5, 5, 10, 15));
myText.text = "My sample text";
myText.font = new Stimulsoft.System.Drawing.Font("Arial", 8, "Point", 2);
myText.top = 2;
myText.left = 2;
myText.height = 0.5;
myText.width = 5;
page.components.add(myText);       	

designer.report = report;
designer.renderHtml('design-container');
Thank you.
wprmdev
Posts: 15
Joined: Fri Jun 07, 2019 6:52 pm

Re: Add component for the design to have been displayed

Post by wprmdev »

Kirill Klimenkov wrote: Tue Jan 10, 2023 2:19 pm Hello.

Please, move the renderHtml method to the very end of your createDesigner function

Code: Select all

var designer = new Stimulsoft.Designer.StiDesigner(options, "StiDesigner", false);

// Create a new report instance
var report = new Stimulsoft.Report.StiReport();
// Load report from url
report.loadFile("./template.mrt");
// Edit report template in the designer
window.designer = designer;
window.report = report;

const page = report.pages.getByIndex(0);

var myText = new Stimulsoft.Report.Components.StiText(new Stimulsoft.System.Drawing.Rectangle(5, 5, 10, 15));
myText.text = "My sample text";
myText.font = new Stimulsoft.System.Drawing.Font("Arial", 8, "Point", 2);
myText.top = 2;
myText.left = 2;
myText.height = 0.5;
myText.width = 5;
page.components.add(myText);       	

designer.report = report;
designer.renderHtml('design-container');
Thank you.

Hello Kirill Klimenkov. I can't move to the end because as I explained in the first post the screen will display the button to add the component on the screen. (That is, after the designer has already been rendered). This code is just an example to simulate the problem. I will not add any components before the designer is rendered.

I believe that something is missing after adding the component. Like a sync function or something like that to tell the designer to update the UI.

All right, Max Shamanov. Thanks already for the help.
Kirill Klimenkov

Re: Add component for the design to have been displayed

Post by Kirill Klimenkov »

Hello.

Please, try to move only designer.report = report; line to the bottom. It should help.

Thank you.
wprmdev
Posts: 15
Joined: Fri Jun 07, 2019 6:52 pm

Re: Add component for the design to have been displayed

Post by wprmdev »

Changing the order of any line will not resolve the issue.

I will try to explain again.

I'm creating the designer an "Add component" button. From that point on, the designer is already rendered and visible to the user.

Now the user clicks on the "Add component" button. In the click event of the button I need to create a new preconfigured component and add it to the report page.

I can add the component and it is visible in the report preview. But in the designer it is not visible.

Preventing the user from using the component.

Obs.: The example I sent shows exactly this behavior but with a simpler code for the sample.

Thanks for the tips :3
Kirill Klimenkov

Re: Add component for the design to have been displayed

Post by Kirill Klimenkov »

Hello.

Now I see what you need. You'll need to reassign the report to the designer after adding the component to the page. Please, check the attachments.

Thank you.
Attachments
sample.zip
(2.61 MiB) Downloaded 90 times
wprmdev
Posts: 15
Joined: Fri Jun 07, 2019 6:52 pm

Re: Add component for the design to have been displayed

Post by wprmdev »

That's exactly it. Thanks a lot Kirill Klimenkov.
Lech Kulikowski
Posts: 6197
Joined: Tue Mar 20, 2018 5:34 am

Re: Add component for the design to have been displayed

Post by Lech Kulikowski »

Hello,

You are welcome.
Post Reply