corner imagecorner image
FeaturesPluginsDocs & SupportCommunityPartners

Web Service Passing Binary Data, pt 6: Creating the Swing Client

Note: The current release is NetBeans IDE 6.5. If you are using NetBeans IDE 6.5, see the latest version of this tutorial.

Download the sample

The goal of this exercise is to create a client for the web service you previously created and deployed, and then add a GUI interface to that client. The interface displays the images that the web service passes as binary data.

Tutorials In This Trail

Content on this page applies to NetBeans IDE 6.1
  1. Overview
  2. Creating the EJB Module
  3. Creating the Web Service
  4. Testing the Web Service
  5. Modifying the Schema and WSDL Files to Pass Binary Data
  6. => Creating the Swing Client
  7. Logging and Optimizing the Web Service

Creating the Swing Client

In the following procedure, you create a web application. Within this application, you create a client that consumes the web service you created and modified in previous tutorials. You then add a JFrame to the web application and design a GUI interface within it, using Swing components. Finally, you bind the Swing components to the web service client code.

To create the Swing client:

  1. Choose File > New Project (Ctrl-Shift-N). The New Project wizard appears. Select Java Application from the Java category. Click Next. The New Java Application wizard appears. Type FlowerClient in Project Name and click Finish. The IDE creates a new Java application project.
  2. Right-click the FlowerClient project node and choose New > Web Service Client from the context menu. The New Web Service Client wizard opens. Select the WSDL URL radio button and paste the URL of the WSDL file into that field. By default, the URL is http://localhost:8080/FlowerService/FlowerService?WSDL. Click Finish. The IDE downloads the WSDL file, adds client stubs for interacting with the web service, and adds nodes to the Projects window in the Java application project, as shown below.


    Projects view showing new web service client

  3. Right-click the FlowerClient node and select New > JFrame. Name the frame FlowerFrame.
  4. Add a JPanel to the FlowerFrame. Expand it to fill the entire FlowerFrame. Name the panel gardenFlowersPanel.
  5. Add the following Swing components to the gardenFlowersPanel, starting from the top of the panel. (For a tutorial on Swing components, see Designing a Swing GUI in NetBeans IDE):
    • Label. variable name: titleLabel, text: Garden Flowers, position: Centered at the top. You may want to bold the text and/or give it a larger font size.
    • ButtonGroup. variable name: buttonGroup1.
    • Add the following 4 Radio Buttons in a horizontal row beneath the titleLabel. In the properties of each button, set it as a member of buttonGroup1. Radio Buttons in buttonGroup1
      Variable Name Selected Text
      asterRadioButton true Aster
      honeysuckleRadioButton false Honeysuckle
      roseRadioButton false Rose
      sunflowerRadioButton false Sunflower
    • JScrollPane. variable name: mainScrollPane. position: Below the radio buttons, filling the horizontal space and about two-thirds of the remaining vertical space.
      • JPanel. variable name: mainPanel. layout: Border. position: Filling the mainScrollPane.
      • JButton. variable name: mainPictureButton. text: Waiting for picture... position: In mainPanel (Due to Border layout of panel, button will automatically fill entire space.)
    • JScrollPane. variable name: thumbnailScrollPane. position: Below the radio buttons, filling the horizontal space and all the remaining vertical space.
      • JPanel. variable name: thumbnailPanel. layout: Grid. position: Filling the thumbnailScrollPane. The Grid layout means that the four following buttons will all be of equal size and completely fill the thumbnailPanel. Buttons in the thumbnailPanel
        Variable Name Text
        asterButton Waiting...
        honeysuckleButton Waiting...
        roseButton Waiting
        sunflowerButton Waiting...

    At this point, the FlowerFrame looks as follows.
    Completed Flower Frame showing button texts instead of images

  6. In the Source Editor, initialize the FlowerFrame like this:
    public static final String[] FLOWERS = {"aster", "honeysuckle", "rose", "sunflower"};
    private Map<String, Image> flowers;
    
    public FlowerFrame(Map<String, Image> flowers) {
    
        this.flowers = flowers;
        for (String flower:FLOWERS) {
            flowers.put(flower,null);
        }
    
        initComponents();
    
        setTitle("Garden Flowers [waiting for picture]");
    
        ItemListener rbListener = new RBListener();
        asterRadiobutton.addItemListener(rbListener);
        honeysuckleRadiobutton.addItemListener(rbListener);
        roseRadiobutton.addItemListener(rbListener);
        sunflowerRadiobutton.addItemListener(rbListener);
    
        ActionListener bListener = new ButtonListener();
        asterButton.addActionListener(bListener);
        honeysuckleButton.addActionListener(bListener);
        roseButton.addActionListener(bListener);
        sunflowerButton.addActionListener(bListener);
    
                } 
  7. When a JRadioButton is clicked, we want to show a new image in the main button.
    private class RBListener implements ItemListener {
    
        public void itemStateChanged(ItemEvent e) {
            showFlower();
        }
    
    }
    
    void showFlower() {
        Image img = null;
        if (asterRadiobutton.isSelected()) {
            img = flowers.get("aster");
            if (img != null) {
                mainPictureButton.setIcon(new ImageIcon(img));
                setTitle("Garden Flowers [Aster]");
            }
        } else if (honeysuckleRadiobutton.isSelected()) {
            img = flowers.get("honeysuckle");
            if (img != null) {
                mainPictureButton.setIcon(new ImageIcon(img));
                setTitle("Garden Flowers [Honeysuckle]");
            }
    
        } else if (roseRadiobutton.isSelected()) {
            img = flowers.get("rose");
            if (img != null) {
                mainPictureButton.setIcon(new ImageIcon(img));
                setTitle("Garden Flowers [Rose]");
            }
        } else if (sunflowerRadiobutton.isSelected()) {
            img = flowers.get("sunflower");
            if (img != null) {
                mainPictureButton.setIcon(new ImageIcon(img));
                setTitle("Garden Flowers [Sunflower]");
            }
        }
        if (img == null) {
            mainPictureButton.setIcon(null);
            setTitle("Garden Flowers [waiting for picture]");
        } else mainPictureButton.setText("");
                }
  8. When a JButton is clicked, we select the related JRadioButton:
    private class ButtonListener implements ActionListener {
    
        public void actionPerformed(ActionEvent e) {
            if (e.getSource() == asterButton) asterRadiobutton.setSelected(true);
            else if (e.getSource() == honeysuckleButton) honeysuckleRadiobutton.setSelected(true);
            else if (e.getSource() == roseButton) roseRadiobutton.setSelected(true);
            else if (e.getSource() == sunflowerButton) sunflowerRadiobutton.setSelected(true);
        }
                }
  9. In the Main class, the setThumbnails method will be called, which is in the FlowerFrame.
    void setThumbnails(Map<String, Image> thumbs) {
        Image img = thumbs.get("aster");
        if (img != null) {
            asterButton.setIcon(new ImageIcon(img));
            asterButton.setText("");
        }
        img = thumbs.get("honeysuckle");
        if (img != null) {
            honeysuckleButton.setIcon(new ImageIcon(img));
            honeysuckleButton.setText("");
        }
        img = thumbs.get("rose");
        if (img != null) {
            roseButton.setIcon(new ImageIcon(img));
            roseButton.setText("");
        }
        img = thumbs.get("sunflower");
        if (img != null) {
            sunflowerButton.setIcon(new ImageIcon(img));
            sunflowerButton.setText("");
        }
                }
  10. Fix the imports in FlowerFrame.
  11. Fill out the Main.java class as follows.
    public class Main {
    
         private static int downloadedPictures;
    
         public static void main(String[] args) {
    
            final Map<String,Image> flowers = new HashMap<String,Image>(4);
            final Map<String,Image> thumbs = new HashMap<String,Image>(4);
    
            // Show the FlowerFrame.
            final FlowerFrame frame = new FlowerFrame(flowers);
            frame.setVisible(true);
    
            // The client connects to the service with this code.
            FlowerService_Service service = new FlowerService_Service();
            final FlowerService port = service.getFlowerServicePort();
    
            Runnable[] tasks = new Runnable[4];
    
            // The web service getFlower operation
            // is called 4 times, each in a separate thread.
            // When the operation finishes the picture is shown in
            // a specific button.
            for (int i=0; i<4;i++) {
                final int index = i;
                tasks[i] = new Runnable() {
                    public void run() {
                        try {
    
                            // Call the getFlower operation
                            // on the web service:
                            Image img = port.getFlower(FlowerFrame.FLOWERS[index]);
                            System.out.println("picture downloaded: "+FlowerFrame.FLOWERS[index]);
    
                            // Add strings to the hashmap:
                            flowers.put(FlowerFrame.FLOWERS[index],img);
    
                            // Call the showFlower operation
                            // on the FlowerFrame:
                            frame.showFlower();
    
                        } catch (IOException_Exception ex) {
                            ex.printStackTrace();
                        }
                        downloadedPictures++;
                    }
                };
                new Thread(tasks[i]).start();
            }
            // The web service getThumbnails operation is called
            // in a separate thread, just after the previous four threads finish.
            // When the images are downloaded, the thumbnails are shown at
            // the bottom of the frame.
            Runnable thumbsTask = new Runnable() {
                public void run() {
                    try {
                        while (downloadedPictures < 4) {
                            try {Thread.sleep(100);} catch (InterruptedException ex) {}
                        }
    
                        // Call the getThumbnails operation
                        // on the web service:
                        List<Image> images = port.getThumbnails();
                        System.out.println("thumbs downloaded");
    
                        if (images != null && images.size() == 4) {
                            for (int i=0;i<4;i++) {
                                thumbs.put(FlowerFrame.FLOWERS[i],images.get(i));
                            }
                            frame.setThumbnails(thumbs);
                        }
                    } catch (IOException_Exception ex) {
                        ex.printStackTrace();
                    }
                }
            };
            new Thread(thumbsTask).start();
        }
    
                }
  12. Fix the imports in Main.java.
  13. Remove the existing main method in the FlowerFrame class.

The web service is now complete, with code that interacts with the web service that delegates to the EJB module to exposes its images. Right-click the client and choose Run. The Swing application starts up and, after a moment, is filled with the images received from the web service.

Next Step:

Logging and Optimizing the Service

To send comments and suggestions, get support, and keep informed on the latest developments on the NetBeans IDE Java EE development features, join the mailing list.