Currently, I have successfully implemented a graphical solution using jsf2.2 primefaces 6.0 to allow users to view, download, and print pictures through the galleria component of primefaces.
However, I am facing an issue with positioning the print commandButton
on the right for optimal user experience.
Desired outcome:
https://i.sstatic.net/fc0E2.png
Below is the XHTML code snippet:
<p:dialog header="Documents numérisés" widgetVar="diag" modal="true"
dynamic="true" showEffect="fade" hideEffect="fade" resizable="true"
position="center" id="diagImages" onShow="download()">
<p:outputPanel id="gal" style="text-align:center;">
<p:galleria value="#{demandeBean.demandeSelectionnee.images}"
panelWidth="500" panelHeight="313" showCaption="false"
autoPlay="false" var="image">
<p:graphicImage id="image"
value="http://localhost:18080/openCars/images/#{image}"
width="500" height="313" />
</p:galleria>
</p:outputPanel>
<p:commandButton value="Print" type="button" icon="ui-icon-print"
style="display:block;margin-bottom: 20px">
<p:printer target="image" />
</p:commandButton>
</p:dialog>