单击拇指图像时打开原始图像

时间:2016-07-13 17:39:54

标签: image jsf primefaces graphicimage

使用<p:graphicImage>显示图像,如下所示。

<p:graphicImage value="#{imageBean.image}" width="80" height="60">
    <f:param name="id" value="1"/>
    <f:param name="width" value="80"/>
    <f:param name="height" value="60"/>
</p:graphicImage>

ImageBean如下所示。

@Named
@ApplicationScoped
public class ImageBean {

    @Inject
    private Service service;

    public ImageBean () {}

    public StreamedContent getImage() throws IOException {
        FacesContext context = FacesContext.getCurrentInstance();

        if (context.getCurrentPhaseId() == PhaseId.RENDER_RESPONSE) {
            return new DefaultStreamedContent();
        } else {
            Map<String, String> requestParameterMap = context.getExternalContext().getRequestParameterMap();
            String id = requestParameterMap.get("id");
            String widthParam = requestParameterMap.get("width");
            String heightParam = requestParameterMap.get("height");

            int width = Utils.isNumber(widthParam) ? Integer.parseInt(widthParam) : -1;
            int height = Utils.isNumber(heightParam) ? Integer.parseInt(heightParam) : -1;

            byte[] bytes = Utils.isNumber(id) ? service.findImageById(Long.parseLong(id), width, height) : null;
            return bytes == null ? null : new DefaultStreamedContent(new ByteArrayInputStream(bytes));
        }
    }
}

service.findImageById()方法返回根据给定的尺寸调整给定图像大小后获得的byte[]

根据给定的尺寸,这将在服务器端调整大小后显示拇指图像。

<p:graphicImage>动态生成图片网址,该网址将分配给生成的src代码的<img>。这看起来像下面这样。

/ContextPath/javax.faces.resource/dynamiccontent.properties.xhtml?ln=primefaces&amp;v=5.3&amp;pfdrid=aAPHlxcQ2lcqfvzacYoCC6iUxLU1VVFp&amp;pfdrt=sc&amp;id=9&amp;height=100&amp;width=100&amp;pfdrid_c=true

单击拇指图像是否可以在新选项卡中打开原始图像,以便它可以对应于HTML,如下所示?

<a href="show_original_image.php?id=1" target="_blank">
    <img src="show_thumb_image.php?id=1" width="80" height="60" style="border: 0px none;"/>
</a>

href <a>的价值是什么以及如何在JSF / PrimeFaces的上下文中动态分配给href

0 个答案:

没有答案