9

I was trying to display a panel where user can see a list of items category(displayed as images) and on clicking they can view products within the category(images will be displayed)

For displaying the item category, i used the ui:repeat nad the supporting bean calss Below is my xhtml code

<ui:repeat id="repeat" value="#{getData.images}" var="img" varStatus="loop">
<h:panelGroup>
<p:graphicImage id="img1" value="#{img}" alt="image not available" >
</p:graphicImage>
</h:panelGroup>
</ui:repeat>

And the Managed Bean Code parts

private ByteArrayOutputStream baos = new ByteArrayOutputStream();
private List<StreamedContent> imageList = new ArrayList<StreamedContent>();

public List<StreamedContent> getImages(){
  for (int i = 0; i < sdh.getNumOfImages(); i++) {
    imageID = imageIDArray.get(i);
    ImageService imgSer = new ImageService();
    imgList.add(imageID);
    imgSer.setData(imageID);
    baos = imgSer.getImage();
    try {
      imageList.add(new DefaultStreamedContent(new 
            ByteArrayInputStream(baos.toByteArray())));
    } catch (Exception ex) {
        ex.printStackTrace();
    }
  }
  imageNum = 0;
  return imageList;
}

public StreamedContent getData() {
    baos = imageList.get(imageNum);
    //imageList.add(baos);
    imageNum++;
    return new DefaultStreamedContent(new ByteArrayInputStream(baos.toByteArray()));
}

Now my problem if i don't uncomment the 'imageList.add(baos)' in 'getData', the images are not displayed. Now i really wants to know how the 'ui:repeat' works, since the 'imageList' contains the images and i can save the same if required in either of the method. If i specify a fixed number (ex:'imageList.get(0)') in the 'getData' method then the same image is show multiple times. Where as if i put the 'imageNum' without the 'imageList.add(baos)' it throw error 'Error in streaming dynamic resource'

I tired Bjorn Pollex's suggestion and made the necessary changes but now images don't appear

4

2 に答える 2

17

このままでは使えません<p:graphicImage>。のコレクションではなく、一意のイメージ識別子のコレクションを反復処理する必要がありStreamedContentます。次に、これらの一意の画像識別子を として渡す必要があります。これにより、ブラウザの正しい URL が生成されます<f:param>。<p:graphicImage>

<ui:repeat value="#{data.imageIds}" var="imageId">
    <p:graphicImage value="#{imageStreamer.image}">
        <f:param name="id" value="#{imageId}" />
    </p:graphicImage>
</ui:repeat>

マネージド#{data}Bean には次のものが必要です。

private List<Long> imageIds; // +getter

これ#{imageStreamer}は、基本的に次のような、別のアプリケーション スコープのマネージド Bean である必要があります。

@ManagedBean
@ApplicationScoped
public class ImageStreamer {

    @EJB
    private ImageService service;

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

        if (context.getCurrentPhaseId() == PhaseId.RENDER_RESPONSE) {
            // So, we're rendering the view. Return a stub StreamedContent so that it will generate right URL.
            return new DefaultStreamedContent();
        }
        else {
            // So, browser is requesting the image. Get ID value from actual request param.
            String id = context.getExternalContext().getRequestParameterMap().get("id");
            Image image = service.find(Long.valueOf(id));
            return new DefaultStreamedContent(new ByteArrayInputStream(image.getBytes()));
        }
    }

}
于 2012-06-08T14:53:17.473 に答える
0

間違った ui:repeat タグを使用しました。var 属性がありますが、これを p:graphicImage タグの value 属性で使用することはできません。使用例を参照してください。

       <ui:repeat value="#{yourBean.images}" var="img">
           <p:graphicImage value="/images/#{img}" />
        </ui:repeat>
于 2012-06-08T07:43:26.600 に答える