Multiple Images Upload and Read In Memory in ADF

Today I would like to explain Multiple images load  and read at a time.
Adf is providing multiple images load at once using input file component only.
It shows the uploaded file in a table format u can remove there also. Awesome feature by ADF
And also it shows the loading status of the images.

For this one most imp porperty is maximumFiles have to be set based on your req.
If you want uplaod any no of files then have to set maximumFiles = -1.

Here My jspx page code:

 <af:commandButton text="Upload Images/ Preview" id="cb1" actionListener="#{viewScope.MultipleImagesUploadBean.loadImages}" />
        <af:inputFile id="if1"  maximumFiles="-1" value="#{viewScope.MultipleImagesUploadBean.uploadFiles}"/>
        <af:forEach items="#{viewScope.MultipleImagesUploadBean.fileNameList}" var="row">
        <af:image source="/images/#{row}" id="i1"
                    partialTriggers="cb1" inlineStyle="width:100px; height:100.0px;"/>
        <af:spacer width="20"/>
        </af:forEach>

Java Code:

    public void loadImages(ActionEvent actionEvent) {
        List<UploadedFile> list = getUploadFiles();
        fileNameList = new ArrayList<String>();
        if(list != null){
            for(int i = 0; i< list.size(); i++){
                System.out.println(list.get(i).getFilename());
                fileNameList.add(list.get(i).getFilename());
                FacesContext fctx = FacesContext.getCurrentInstance();
                ServletContext setvltctx =
                    (ServletContext)fctx.getExternalContext().getContext();
                String imageDirPath = setvltctx.getRealPath("/");
                try {
                    BufferedImage input = ImageIO.read(uploadFiles.get(i).getInputStream());
                    File OutputFile = new File(imageDirPath + "/images/" + fileNameList.get(i));
                    ImageIO.write(input, "PNG", OutputFile);
                } catch (IOException e) {
                    e.printStackTrace();
                }
            }
        }
    }

    private List<UploadedFile> uploadFiles;
    private List<String> fileNameList;

    public void setUploadFiles(List<UploadedFile> uploadFiles) {
        this.uploadFiles = uploadFiles;
    }
    public List<UploadedFile> getUploadFiles() {
        return uploadFiles;
    }
    public List<String> getFileNameList() {
        return fileNameList;
    }

















 

Upload and Read Image In Memory in ADF

Some times we have requirement when ever user uplaod an image immediately he wants see the preview. So for this requirements  No need any servet class. Here I am Sharing code and process.

JSPX Code:

<af:panelGroupLayout id="pgl1">
          <af:inputFile label="Upload Image" id="if1" autoSubmit="true"
                              valueChangeListener="#{viewScope.MyBean.imageChangeEventInMemory}"/>
          <af:image source="/images/#{viewScope.MyBean.fileName}" id="i1"
                    partialTriggers="if1" inlineStyle="width:100px; height:100.0px;"/>
    </af:panelGroupLayout>

Managed Bean Code:

    public void imageChangeEventInMemory(ValueChangeEvent ve){
        UploadedFile myfile = (UploadedFile)ve.getNewValue();
        fileName = myfile.getFilename();
        FacesContext fctx = FacesContext.getCurrentInstance();
        ServletContext setvltctx =
            (ServletContext)fctx.getExternalContext().getContext();
        String imageDirPath = setvltctx.getRealPath("/");
        try {
            BufferedImage input = ImageIO.read(myfile.getInputStream());
            File OutputFile = new File(imageDirPath + "/images/" + fileName);
            ImageIO.write(input, "PNG", OutputFile);
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

private String fileName;

    public void setFileName(String fileName) {
        this.fileName = fileName;
    }
    public String getFileName() {
        return fileName;
    }


Note:
  You have to create images folder inside web contect folder, just creat empty folder.