Developing component with two ’html5smartimage’ widgets
Hi experts!
I would like to develop a component that renders some text and two images. I’m getting as a reference the ‘foundation/components/image’ component to render the images, using the ‘com.day.cq.wcm.foundation.Image’ class (see at [1]), like:
… Image image = new Image(resource); … <% image.draw(out); %> …
I can render my component with one image, and it works fine. But I don’t know how to add the second one.
For the first image, I’ve added, in the compoment dialog, a ‘cq:Widget’ of xtype=’html5smartimage’ (as the ‘foundation/components/image’). For the second image, I should add a second html5smartimage widget, but the properties of both widgets will collide.
I’ve tried to change the values of properties of the image (./imageCrop, ./filename, ./fileReference, etc.), adding a prefix (./imagenPrincipal/imageCrop, ./ imagenPrincipal/filename, ./ imagenPrincipal/fileReference, etc.). But then the image is not rendered, because the ./imagenPrincipal node in /content/… doesn’t contains the sling:resourceType node (that refers to the component, that inherits from ‘foundation/components/parbase’, that is the component that really renders the image, with the ‘img.GET.java’ class.
So, how can I include two html5smartimage widgets in my component and use them to render both images with ‘com.day.cq.wcm.foundation.Image’ class?
Thank you very much!!
[1] http://dev.day.com/docs/en/cq/current/javadoc/com/day/cq/wcm/foundation/Image.html