How to display images from local storage in Vaadin 7?

sorry with my bad english

I am a new user of the Vaadin Framework
I use vaadin 7 (continuing the ongoing project)

“The goal, when clicking the list tree displays the image in component 2”


I have made 3 components

  1. component tree
  2. component displays the document image
  3. document information components

component 1


import com.vaadin.event.ItemClickEvent;
import com.vaadin.server.FileResource;
import com.vaadin.server.VaadinService;
import com.vaadin.ui.*;

public class DocumentTreeView extends VerticalLayout {
    // A menu tree
    Tree docCtgList = new Tree();

    public DocumentTreeView(){

        // An item with hierarchy
        docCtgList.addItem("Category Documents");

        docCtgList.setChildrenAllowed("SPAJ", false);
        docCtgList.setChildrenAllowed("SPAK", false);

        docCtgList.setParent("SPAJ", "Dokumen Penutupan Polis");
        docCtgList.setParent("SPAK", "Dokumen Penutupan Polis");

        docCtgList.expandItem("Dokumen Penutupan Polis");


        docCtgList.addItemClickListener( new ItemClickEvent.ItemClickListener() {
            public void itemClick(ItemClickEvent event) {

                // Pick only left mouse clicks
                if (event.getButton() == ItemClickEvent.BUTTON_LEFT)
          "Left Click",
                    // Find the application directory
                    String basepath = VaadinService.getCurrent()

                    // Image as a file resource
                                    FileResource resource = new FileResource(new File (basepath +

                    // Show the image in the application
                                    Image image = new Image("Image from file", resource);

                    // Let the user view the file in browser or download it
                                    Link link = new Link("Link to the image file", resource);