1 / 32

F27SB2 Software Development 2

F27SB2 Software Development 2. Lecture 10: Java GUIs 7. Displaying images. how to display images in a GUI? BufferedImage from AWT low level representation as array of pixels image processing is complex Image from AWT displayable image platform independent. Displaying images. Icon

moses
Télécharger la présentation

F27SB2 Software Development 2

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. F27SB2 Software Development 2 Lecture 10: Java GUIs 7

  2. Displaying images • how to display images in a GUI? BufferedImage • from AWT • low level representation as array of pixels • image processing is complex Image • from AWT • displayable image • platform independent

  3. Displaying images Icon • interface • from Swing • object that can draw a graphic of specified width/height at a specific location setIcon(Icon i) • place Icon on JComponent

  4. Displaying images ImageIcon • implementation of Icon interface • uses an Image to draw an Icon ImageIcon(String filename) • constructs ImageIcon from image from a specified file • then set ImageIconon JComponent getImage() • returns Image fromImageIcon

  5. Display single image • specify file name via main • display in JLabel in JFrame import javax.swing.*; import java.awt.*; import java.awt.event.*; class Photo1 extends JFrame { JLabel l;

  6. Display single image Photo1() { setLayout(new GridLayout(1,1)); l = new JLabel("picture",JLabel.CENTER); l.setVisible(true); l.setOpaque(true); add(l); } void setPhoto(String s) { l.setIcon(new ImageIcon(s)); } }

  7. Display single image class TestPhoto1 { public static void main(String [] args) { Photo1 p = new Photo1(); p.setSize(400,420); p.setVisible(true); p.setTitle("Photo1"); p.addWindowListener (new WindowAdapter() { public void windowClosing(WindowEvent e) {System.exit(0);}}); p.setPhoto(args[0]); } }

  8. Display single image original image (EE5.jpg) display • original image not same size/shape as display • centre of image is displayed • no scaling/resizing

  9. Resizing image getScaledInstance (intwidth,intheight,inthints) • resizes Image to be width*height • hints • determine how scaling is performed • we’ll use Image.SCALE_SMOOTH • NB direct scaling to dimensions of JComponentmay distort image if not same shape

  10. Resizing image • want resized image to retain original dimensions • new image width/new image height = old image width/old image height • for given new image height: • new image width = new image height*old image width/old image height • for given new image width: • new image height = new image width*old image height/old image width

  11. Resizing image JLabel Image 1 lh i1h lw i1w • image width/image height < JLabel width/JLabel height • new image height = JLabel height • new image width = JLabel height* image width/ • image height

  12. Resizing image JLabel Image 2 i2h lh i2w lw • image width/image height > JLabel width/JLabel height • new image width = JLabelwidth • new image height = JLabelwidth*image height/ • image width

  13. Resizing image import javax.swing.*; import java.awt.*; import java.awt.event.*; class Photo2 extends JFrame { JLabel l; Photo2() { setLayout(new GridLayout(1,1)); l = new JLabel("picture",JLabel.CENTER); l.setVisible(true); l.setOpaque(true); add(l); }

  14. Resizing image void setPhoto(String s) { Image i1 = (new ImageIcon(s)).getImage(); intlw = l.getWidth(); intlh = l.getHeight(); intiw = i1.getWidth(this); intih = i1.getHeight(this); int w = lw; inth = lh; if(iw>lw){ w = lw; h = lh*ih/iw; } else if(ih>lh){ w = lw*iw/ih; h = lh; } Image i2 = i1.getScaledInstance(w,h,Image.SCALE_SMOOTH); l.setIcon(new ImageIcon(i2)); } }

  15. Resizing image class TestPhoto2 { public static void main(String [] args) { Photo2 p = new Photo2(); p.setSize(400,420); p.setVisible(true); p.setTitle("Photo2"); p.addWindowListener (new WindowAdapter() { public void windowClosing(WindowEvent e) {System.exit(0);}}); p.setPhoto(args[0]); } }

  16. Resizing image original image (EE5.jpg) display

  17. Photo Browser • choose directory • scroll through images which are .jpg or .JPG JLabel file name < photo > JFrame JButton

  18. Photo Browser ... class Browser extends JFrame implements ActionListener { JMenuBarjb; JMenu file; JMenuItemMNew,MOpen,MClose,MExit; JFileChooser files; JButtonleft,right; JLabel photo; JLabelfileName;

  19. Photo Browser • maintain array of File for contents of chosen directory File [] directory; • keep track of current File in directory intcurrent;

  20. Photo Browser Browser() { jb = new JMenuBar(); file = new JMenu("Picture"); MOpen = new JMenuItem("Open"); MOpen.addActionListener(this); file.add(MOpen); jb.add(file); setJMenuBar(jb); files = new JFileChooser();

  21. Photo Browser • need file chooser which will only select directories • change file chooser mode setFileSelectionMode(intmode) mode: • DIRECTORIES_ONLY • FILES_AND_DIERCTORIES • FILES_ONLY

  22. Photo Browser files.setFileSelectionMode (JFileChooser.DIRECTORIES_ONLY); Font f = new Font("Sans Serif",Font.BOLD,24); left = new JButton("<"); left.setFont(f); left.addActionListener(this); add(left,BorderLayout.WEST); photo = new JLabel(); add(photo,BorderLayout.CENTER);

  23. Photo Browser right = new JButton(">"); right.setFont(f); right.addActionListener(this); add(right,BorderLayout.EAST); fileName = new JLabel("",JLabel.CENTER); fileName.setFont (new Font("Sans Serif",Font.PLAIN,18)); add(fileName,BorderLayout.NORTH); }

  24. Photo Browser • directories may contain files of mixed type • check if file name ends with appropriate extension booleanendsWith(String s1,String s2) { int d = s1.length()-s2.length(); if(d<0)return false; for(int i = s2.length()-1;i>=0;i--) if(s1.charAt(i+d)!=s2.charAt(i)) return false; return true; } • built in String method endsWith(String s)

  25. Photo Browser • require name & path information from File String getName() • returns file name in directory String getPath() • returns file path from root directory

  26. Photo Browser booleancheckJPG(inti) { Image i1,i2; intph,pw,ih,iw; String name = directory[i].getName(); if(endsWith(name,".jpg") || endsWith(name,".JPG")) { String path = directory[i].getPath(); i1 = (new ImageIcon(path)).getImage(); ph = photo.getHeight(); pw = photo.getWidth(); ih = i1.getHeight(this); iw = i1.getWidth(this); int w = pw; int h = ph;

  27. Photo Browser if(iw>ih) { w = pw; h = ph*ih/iw; } else if(ih>iw) { w = pw*iw/ih; h = ph; } i2 = i1.getScaledInstance (w,h,Image.SCALE_SMOOTH); photo.setIcon(new ImageIcon(i2)); current = i; fileName.setText(name); return true; } return false; }

  28. Photo Browser • need list of directory contents from chooser selection File [] listFiles() • returns array of File from chooser • can then check each in turn to see if appropriate file type

  29. Photo Browser public void doOpen() { int response = files.showOpenDialog(this); if(response==JFileChooser.APPROVE_OPTION) { File f = files.getSelectedFile(); directory = f.listFiles(); for(inti=0;i<directory.length;i++) if(checkJPG(i)) return; } }

  30. Photo Browser public void doRight() { for(int i=current+1;i<directory.length;i++) if(checkJPG(i)) return; } public void doLeft() { for(int i=current-1;i>=0;i--) if(checkJPG(i)) return; }

  31. Photo Browser public void actionPerformed(ActionEvent e) { if(e.getSource()==MOpen) doOpen(); else if(e.getSource()==left) doLeft(); else if(e.getSource()==right) doRight(); } } class TestBrowser{...}

  32. Photo Browser

More Related