Results 1 to 16 of 16
Like Tree1Likes
  • 1 Post By Fubarable

Thread: PNG pictures

  1. #1
    nhmllr's Avatar
    nhmllr is offline Member
    Join Date
    Aug 2011
    Posts
    51
    Rep Power
    0

    Default PNG pictures

    I've looked through so many articles on how to display PNG's in Jpanels but I just don't understand them. They are too abstract for me and I don't understand what code goes where or why.

    Here is a hypothetical class of a Jpanel that is black.

    Java Code:
    public class BlackPanel extends JPanel
    {	
    //CONSTRUCOTR
    	public GridBox() 
    	{
    		setBackground(Color.BLACK);
    	}
    }
    Now, let's say that I have a file called "black.png" on my harddrive, and I want to display that. What would the code look like then?

    I've heard that I might need to import the png into my project if I want to distribute it, such that it's not just somewhere in my harddrive and would not be on someone else's harddrive.

    I am using eclipse. How would I do that?

    Thanks

  2. #2
    Fubarable's Avatar
    Fubarable is offline Moderator
    Join Date
    Jun 2008
    Posts
    19,316
    Blog Entries
    1
    Rep Power
    26

    Default Re: PNG pictures

    Quote Originally Posted by nhmllr View Post
    I've looked through so many articles on how to display PNG's in Jpanels but I just don't understand them. They are too abstract for me and I don't understand what code goes where or why.
    It would be much easier to help if you could be more specific -- just what don't you understand? Have you looked at this example?:

    BackgroundImageOnJPanel

  3. #3
    nhmllr's Avatar
    nhmllr is offline Member
    Join Date
    Aug 2011
    Posts
    51
    Rep Power
    0

    Default Re: PNG pictures

    Quote Originally Posted by Fubarable View Post
    It would be much easier to help if you could be more specific -- just what don't you understand? Have you looked at this example?:

    BackgroundImageOnJPanel
    Yes, I've seen that. The most confusing part for me is "what the heck is 'Graphics'?"

    When it comes time for me to call the paintComponent(Graphics) method, what goes into the parenthesis?

  4. #4
    Fubarable's Avatar
    Fubarable is offline Moderator
    Join Date
    Jun 2008
    Posts
    19,316
    Blog Entries
    1
    Rep Power
    26

    Default Re: PNG pictures

    Quote Originally Posted by nhmllr View Post
    Yes, I've seen that. The most confusing part for me is "what the heck is 'Graphics'?"

    When it comes time for me to call the paintComponent(Graphics) method, what goes into the parenthesis?
    I think of Graphics almost as a pen that I draw with. It is given to me by Java, by the JVM, and I use it to draw my images with. Note that we almost never call the paintComponent method ourselves, so we never have to worry about passing in a Graphics object and again leave that all up to Java.

  5. #5
    nhmllr's Avatar
    nhmllr is offline Member
    Join Date
    Aug 2011
    Posts
    51
    Rep Power
    0

    Default Re: PNG pictures

    Wait- after a few hours I figured out how to do it.
    It turned out that there's a slightly easier way
    Anyone who reads this later should watch this:
    Java GUI Lesson 8 | Using Images - YouTube
    I found the video instruction helpful

    Thanks for your help! (not sarcastic)

  6. #6
    Fubarable's Avatar
    Fubarable is offline Moderator
    Join Date
    Jun 2008
    Posts
    19,316
    Blog Entries
    1
    Rep Power
    26

    Default Re: PNG pictures

    There are some significant problems with the video tutorial that you've linked to:

    • He's creating a new ImageIcon object within paintComponent -- not a good idea since this can potentially slow the image rendering down, and it creates new objects needlessly. You only have to create the image once in the constructor, not each time the paintComponent draws the component.
    • In his ImageIcon constructor he's actually having Java read in an image file, and this will slow image rendering even more. Never, ever do this.
    • You're much better off reading in a BufferedImage into your class in its constructor using ImageIO.read(...).
    • And then just rendering the image in paintComponent.
    DarrylBurke likes this.

  7. #7
    nhmllr's Avatar
    nhmllr is offline Member
    Join Date
    Aug 2011
    Posts
    51
    Rep Power
    0

    Default Re: PNG pictures

    Quote Originally Posted by Fubarable View Post
    There are some significant problems with the video tutorial that you've linked to:

    • He's creating a new ImageIcon object within paintComponent -- not a good idea since this can potentially slow the image rendering down, and it creates new objects needlessly. You only have to create the image once in the constructor, not each time the paintComponent draws the component.
    • In his ImageIcon constructor he's actually having Java read in an image file, and this will slow image rendering even more. Never, ever do this.
    • You're much better off reading in a BufferedImage into your class in its constructor using ImageIO.read(...).
    • And then just rendering the image in paintComponent.
    Please understand that I have no idea what I'm doing. I just spent 4 hours trying to get some pngs to display on a screen.
    I've looked into the "BufferedImages" thing before and did not get it.

    If I do understand it I will post how I learned. But for today I am tired and will call it quits. Sometime later this week I will revisit it and see if I can wrap my head around this.
    Thanks :)

  8. #8
    nhmllr's Avatar
    nhmllr is offline Member
    Join Date
    Aug 2011
    Posts
    51
    Rep Power
    0

    Default Re: PNG pictures

    I'm trying the buffered Image thing. Looking onto the problem with fresh eyes makes it seem less daunting. Here's the class that previously had the old way of showing pictures (with some extraneous stuff omitted from this post):

    Java Code:
    import java.awt.*;
    import javax.swing.ImageIcon;
    import javax.swing.JPanel;
    import java.awt.Dimension;
    
    public class GridBoxClass extends JPanel
    {	
    	Image image;
    //CONSTRUCOTR
    	public GridBoxClass() 
    	{
    		setPreferredSize(new Dimension(50,50));
    		try
    	    {
    	      image = javax.imageio.ImageIO.read(new java.net.URL(getClass().getResource("normalFloor.png"), "normalFloor.png"));
    	    }
    	    catch (Exception e) { /*handled in paintComponent()*/ }
    	    repaint();
    	}
    	
    	@Override
    	protected void paintComponent(Graphics g)
    	  {
    	    super.paintComponent(g); 
    	    if (image != null)
    	      g.drawImage(image, 0,0,this.getWidth(),this.getHeight(),this);
    	    else {System.out.println(":(");} //LOOK HERE
    	  }
    }
    It prints out a bunch of ":(" in the console. Why is there no value assigned to the image? "normalFloor.png" is imported into the project. Should I import it differently?

    Thanks

  9. #9
    Fubarable's Avatar
    Fubarable is offline Moderator
    Join Date
    Jun 2008
    Posts
    19,316
    Blog Entries
    1
    Rep Power
    26

    Default Re: PNG pictures

    Perhaps Java can't find the image file: where is the "normalFloor.png" file located in relation to your class files?

  10. #10
    nhmllr's Avatar
    nhmllr is offline Member
    Join Date
    Aug 2011
    Posts
    51
    Rep Power
    0

    Default Re: PNG pictures

    PNG pictures-capture1.png

    There's a little picture. I'm using eclipse

  11. #11
    Fubarable's Avatar
    Fubarable is offline Moderator
    Join Date
    Jun 2008
    Posts
    19,316
    Blog Entries
    1
    Rep Power
    26

    Default Re: PNG pictures

    Yikes!!!!:

    Java Code:
    catch (Exception e) { /*handled in paintComponent()*/ }
    Your exception is most definitely **not** handled in paintComponent! You'd better print out the stack trace to get an idea of what you're doing wrong.

  12. #12
    Fubarable's Avatar
    Fubarable is offline Moderator
    Join Date
    Jun 2008
    Posts
    19,316
    Blog Entries
    1
    Rep Power
    26

    Default Re: PNG pictures

    Attachment 1797Next, please show me an image of your src folder in your Eclipse Package Explorer. What package is the GridBoxClass located in?

    I would create an images folder somewhere in the src folder and add your image to it. I would then make sure my resource path was relative to the location of my class files (which is the same relative location as the java files in Eclipse). For instance, this works for me:

    Java Code:
    package yr11.m09.c;
    
    import java.awt.*;
    import java.awt.image.*;
    import java.net.URL;
    
    import javax.swing.*;
    
    public class GridBoxClass extends JPanel {
       private static final String IMG_RESOURCE_PATH = "images/img001.jpg";;
       BufferedImage image;
    
       public GridBoxClass() {
          try {
             URL imgUrl = getClass().getResource(IMG_RESOURCE_PATH);
             System.out.println(imgUrl);
             image = javax.imageio.ImageIO.read(getClass()
                   .getResource(IMG_RESOURCE_PATH));
          } catch (Exception e) { 
             e.printStackTrace();
          }
       }
       
       @Override
       public Dimension getPreferredSize() {
          if (image != null) {
             return new Dimension(image.getWidth(), image.getHeight());
          } else {
             return super.getPreferredSize();
          }
       }
    
       @Override
       protected void paintComponent(Graphics g) {
          super.paintComponent(g);
          if (image != null) {
             g.drawImage(image, 0, 0, this.getWidth(), this.getHeight(), this);
          } 
       }
       
       public static void main(String[] args) {
          JOptionPane.showMessageDialog(null, new GridBoxClass());
       }
    }
    Note the forum software is messing up my image path it should not be "http://www.java-forums.org/images/img001.jpg";
    but rather

    "images / img001.jpg";

    without the spaces
    PNG pictures-gridboxclasspic.jpg
    Last edited by Fubarable; 09-20-2011 at 04:55 AM.

  13. #13
    nhmllr's Avatar
    nhmllr is offline Member
    Join Date
    Aug 2011
    Posts
    51
    Rep Power
    0

    Default Re: PNG pictures

    Thanks for your help! I got it to work this way.

    I was curious, though. I have a 132 11x11 grid of "GridBoxClass" made in "GameGridClass."
    It would see silly for all 132 instances of GridBoxClass to call on the same images. Seems like a waste of RAM.
    I was curious- is there a way to store the images in GameGridClass and make a method to paint them in the GridBoxClasses?

    Thanks

  14. #14
    Fubarable's Avatar
    Fubarable is offline Moderator
    Join Date
    Jun 2008
    Posts
    19,316
    Blog Entries
    1
    Rep Power
    26

    Default Re: PNG pictures

    Consider creating a one ImageIcon for each unique image, and then using an 11 x 11 grid of JLabels where you set the label's icon to whichever ImageIcon is appropriate. JLabel has a setIcon(ImageIcon icon) method that works well for this.

  15. #15
    nhmllr's Avatar
    nhmllr is offline Member
    Join Date
    Aug 2011
    Posts
    51
    Rep Power
    0

    Default Re: PNG pictures

    Okay, so I had a lot of other work to do and wasn't able to tackle this problem again. I wanted to see if I could make minesweeper (and It looks like I can) but I ran into the exact same problem that I had with this project. I'm trying to take your "setIcon()" advice but I can't seem to get it to work.

    Here's a simplified version of my GridBoxClass (and it has the proper imports)

    Java Code:
    public class GridBoxClass extends JButton
    {
    //INITIALIZATIONS
    	private final ImageIcon mineImg = new ImageIcon("mine.png");
    	
    //CONSTRUCOTR
    	public GridBoxClass()
    	{
    		setPreferredSize(new Dimension(25,25));
    		setIcon(mineImg);
    	}
    }
    And here's what the project looks like.
    PNG pictures-minesweeperforforums.png
    All I want if for the button to display mine.png
    I've tried changing "mine.png" to "src/mine.png" but nothing changed
    Let's see if I can conquer this problem once and for all
    Thanks

  16. #16
    Fubarable's Avatar
    Fubarable is offline Moderator
    Join Date
    Jun 2008
    Posts
    19,316
    Blog Entries
    1
    Rep Power
    26

Similar Threads

  1. Replies: 22
    Last Post: 07-25-2012, 09:51 PM
  2. 3D pictures
    By mine0926 in forum Advanced Java
    Replies: 8
    Last Post: 10-27-2010, 01:43 AM
  3. pictures
    By chalo in forum New To Java
    Replies: 2
    Last Post: 12-13-2008, 12:26 PM
  4. pictures
    By f_the_cook in forum AWT / Swing
    Replies: 5
    Last Post: 10-29-2008, 06:11 AM
  5. pictures...
    By whosadork in forum New To Java
    Replies: 1
    Last Post: 10-20-2008, 02:18 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •