nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Fit image to container AND page break issue

miaou_

Hi everybody, 
I am currently facing to an issue about fitting an image into the parent container. 
 
It's not easy for me to clearly explain the problem, so I have linked to this message 2 rptDesign samples and their output PDF results. 
 
I try to create a birt document composed of 3 parts : 
 
<ul class='bbc'><li>header : information retrieve from a database.</li><li>image : The image (tiff, png or jpg) comes from a database. I bypass this process here by embedding the image sample into the report.</li><li>footer : hard-coded label + current date.</li></ul>
 
 
As you may see, when the image is wide/high, the pdf ouput is split in 3 pages whereas I am trying to keep a single-page document. 
I have played a lot with page break attribute, but I didn't obtain any result. 
 
Has somebody any idea/tip ? 
 
P.S.: I apologise for my poor english skill, I am just a little French guy :rolleyes: 
P.S.: I also posted the message on the eclipse/forum (<a class='bbc_url' href='http://www.eclipse.org/forums/index.php/mv/msg/212498/682191/#msg_682191'>http://www.eclipse.org/forums/index.php/mv/msg/212498/682191/#msg_682191</a>), sorry for those who have saw the message twice 
 
Best regards, 
Nicolas

Find more posts tagged with

Comments

mwilliams

If I set a height and width to the image so that it fits inside the page size and allows the text to also fit, it all fits onto a single page.

miaou_

Thanks mwilliams for your answer.
But this does not fit my needs (unless I am mistaken ;-)),
as into the real application (the one in production), embedded pictures are dynamic, extracted from a blob database column.
In that case, I can't anticipate and fix image width and height.

But, as I know how to programmatically get image dimension,
maybe you know how to modify image component properties using a script or something else ?

Once again, thank you for your help.
Nicolas.

mwilliams

So, if the image is smaller than the area you've allotted for it, you don't want to resize the image, just when the image is larger than the allotted space? Is this correct? If this were the case, you could size the image only if it's larger than your allowable space.

krahe

The problem is that the "Fit to container" attribute only causes BIRT to consider the horizontal size of the container when determining how much it should resize an image, rather than both dimensions, which would be preferable. So if resizing the image to fit the horizontal dimension of the container leaves its height small enough to fit into the vertical size that has been allotted, then you're okay. If resizing causes the height of the image to exceed the vertical size of the container, however, then the image gets truncated. I am running into the same problem. In my case I think I can work around it by making all my containers square and instructing users to make sure they don't use images (logos in my case) that are taller than they are wide.

mwilliams

I see what you're saying. I've tried a few things to do this within script, but was unsuccessful. I think you'll have to grab your image data and decode it to know the height info. This seems like something that should be taken care of with the fit to container setting, though, so please log a bug for this at www.birt-exchange.org/org/resources/bug-reporting/ Thanks!