How to print images in Custom QWeb reports in Odoo?

Question

I would like to display images which are uploaded by users in my custom Qweb reports.

Which is the best way to do that?

Answer 1

For someone who lands here from Google... For dynamic images from the database, one can use

<img t-attf-src="data:image/*;base64,{{o.image_field_name}}"/>

...where o.image_field_name is a dynamic field from the database/model. I prefer the <img/> tag over a <span/> for images.

To show a static image, use plain HTML.

<img src="path/to/image/file" alt="Alternate Text"/>

Note: alternate text attribute in an image does not add value in PDF reports. They don't show up when the image is missing, as in HTML.

Answer 2

If you want to show an image from the database you can just use the image widget like this:

<span t-field="o.image_field_name" t-field-options='{"widget": "image"}'/>

And if you want to show an image stored as a file:

<img t-att-src="'/module_name/static/src/img/image_name.png'" />

Note: respect the order and the type of the quotes

Answer 3

Sometimes you need to call a function from QWeb and get image. This code help me to read proper image field and print it with QWeb.

    <t t-foreach="get_image(id)" t-as="image_browse">
         <span t-field="image_browse.image" t-field-options='{"widget": "image"}'/> 
</t>

image_browse is a browse of id that send by get_image(id)

Answer 4

<tr t-foreach="o.pack_operation_ids" t-as="pack_operation">
    <td>
      <span t-field="pack_operation.product_id.image_small" t-field-options='{"widget": "image"}'/>
    </td>
</tr>

• QWeb has an iteration directive foreach which take an expression returning the collection to iterate on, and a second parameter t-as providing the name to use for the "current item" of the iteration:
• In <span> I access Image of product_id using pack.operation
• You can select size of image like: image_small and image_medium