Results 1 to 8 of 8
  1. #1
    DionnV is offline Member
    Join Date
    Oct 2011
    Posts
    6
    Rep Power
    0

    Default CardLayout and Background image

    Hey there,

    Currently I'm trying to make a GUI using a CardLayout. My problem is; the background picture just fails at anyway I try.
    I've already tryed to add images like this:
    Java Code:
     BufferedImage image = null;
     image = ImageIO.read(new File("path to background"));
    firstCard.add(image);
    image.setBounds(0, 0, 1280, 1024);
    secondCard.add(image, hold);
    image.setBounds(0, 0, 1280, 1024);
    ...
    which made me have my background pic at the very last card.

    I also tryed to override the
    Java Code:
    public void paint(Graphics g){}
    which made me have a pic at the very first card and at the very last card. The image is also placed over my JLabels, which means I can't see them too.

    I could have added the whole code to my comment but it's quite long. If anyone is interested in the whole code, just message me for my e-mail.

    Tnx in advance.

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

  3. #3
    camickr is offline Senior Member
    Join Date
    Jul 2009
    Posts
    1,226
    Rep Power
    6

    Default Re: CardLayout and Background image

    A CardLayout does NOT show multiple panels at the same time. So you can't have a panel with components display over top of a panel with an image.

    Check out Background Panel « Java Tips Weblog for a couple of solutions. Or you can check out: How to Use Layered Panes (The Java™ Tutorials > Creating a GUI With JFC/Swing > Using Swing Components)

  4. #4
    DionnV is offline Member
    Join Date
    Oct 2011
    Posts
    6
    Rep Power
    0

    Default Re: CardLayout and Background image

    Okay, I'll post most of my code here.

    It has to be a GUI for a project and I'm Dutch so that will explain the button/constructor names.

    Java Code:
    public class GUIproj3 extends JFrame implements ActionListener, MouseListener {
    /*some code*/
        private final CardLayout gui = new CardLayout();
        private JPanel center = new JPanel();
        private Frame frame = new Frame();
       /* a lot of labels and buttons */
    
    private JPanel firstCard = new JPanel();
        private JPanel secondCard = new JPanel();
        private JPanel thirdCard = new JPanel();
        private JPanel fourthCard = new JPanel();
        private JPanel fifthCard = new JPanel();
        private JPanel sixthCard = new JPanel();
        private JPanel seventhCard = new JPanel();
        private JPanel currentCard = new JPanel();
    
    static final String hold = new String("hold");
        static final String firstc = new String("Welkomstscherm");
        static final String secondc = new String("Pinpasinvoer en check");
        static final String thirdc = new String("Pincode invoeren");
        static final String fourthc = new String("Saldo checken/opvragen");
        static final String fifthc = new String("Saldo kiezen");
        static final String sixthc = new String("Saldo opnemen");
        static final String seventhc = new String("Afsluitscherm");
    
    public GUIproj3() {
    
    
            try {
                frame.add(center);
    BufferedImage image = null;
                image = ImageIO.read(new File("path to file (which is correct)"));
                //image = new JLabel(new ImageIcon(img));
                //image.setIcon(img);
    
                currentCard = firstCard;
                firstCard.setLayout(null);
                firstCard.add(image, hold);
                image.setBounds(0, 0, 1280, 1024);
    
                secondCard.setLayout(null);
                pininvoer.setFont(labelfont);
                secondCard.add(pininvoer);
                pininvoer.setBounds(450, 100, 412, 440);
                pininvoer.setForeground(Color.GREEN.darker());
                secondCard.add(invoeren);
                invoeren.setBounds(525, 400, 250, 100);
                invoeren.setForeground(Color.GREEN.darker());
                secondCard.add(image, hold);
                image.setBounds(0, 0, 1280, 1024);
    
                thirdCard.setLayout(null);
                thirdCard.add(voerin);
                voerin.setFont(labelfont);
                voerin.setForeground(Color.GREEN.darker());
                voerin.setBounds(190, 12, 850, 150);
                thirdCard.add(one);
                one.setBounds(190, 112, 250, 150);
                thirdCard.add(two);
                two.setBounds(490, 112, 250, 150);
                thirdCard.add(three);
                three.setBounds(790, 112, 250, 150);
                thirdCard.add(four);
                four.setBounds(190, 312, 250, 150);
                thirdCard.add(five);
                five.setBounds(490, 312, 250, 150);
                thirdCard.add(six);
                six.setBounds(790, 312, 250, 150);
                thirdCard.add(seven);
                seven.setBounds(190, 512, 250, 150);
                thirdCard.add(eight);
                eight.setBounds(490, 512, 250, 150);
                thirdCard.add(nine);
                nine.setBounds(790, 512, 250, 150);
                thirdCard.add(del);
                del.setBounds(190, 712, 250, 150);
                thirdCard.add(zero);
                zero.setBounds(490, 712, 250, 150);
                thirdCard.add(ok);
                ok.setBounds(790, 712, 250, 150);
                thirdCard.add(pin);
                pin.setBounds(490, 862, 250, 50);
                pin.setEditable(false);
                pin.setFont(new Font("Serif", Font.ITALIC, 64));
                pin.setLineWrap(true);
                pin.setWrapStyleWord(true);
                thirdCard.add(image, hold);
                image.setBounds(0, 0, 1280, 1024);
    
                fourthCard.setLayout(null);
                fourthCard.add(opvragen);
                opvragen.setBounds(165, 312, 300, 200);
                fourthCard.add(saldotext);
                saldotext.setBounds(515, 412, 200, 50);
                fourthCard.add(opnemen);
                opnemen.setBounds(815, 312, 300, 200);
                saldotext.setEditable(false);
                saldotext.setFont(new Font("Verdana", Font.BOLD, 15));
                fourthCard.add(image, hold);
                image.setBounds(0, 0, 1280, 1024);
    
                fifthCard.setLayout(null);
                fifthCard.add(twintig);
                twintig.setBounds(165, 250, 250, 150);
                fifthCard.add(vijftig);
                vijftig.setBounds(165, 450, 250, 150);
                fifthCard.add(honderd);
                honderd.setBounds(815, 250, 250, 150);
                fifthCard.add(tweehonderd);
                tweehonderd.setBounds(815, 450, 250, 150);
                fifthCard.add(anders);
                anders.setBounds(490, 650, 250, 150);
                fifthCard.add(image);
                image.setBounds(0, 0, 1280, 1024);
    
                sixthCard.setLayout(null);
                sixthCard.add(bon);
                sixthCard.add(ja);
                sixthCard.add(nee);
                bon.setBounds(450, 100, 300, 100);
                bon.setFont(labelfont);
                bon.setForeground(Color.GREEN.darker());
                ja.setBounds(265, 312, 250, 150);
                nee.setBounds(715, 312, 250, 150);
                sixthCard.add(image);
                image.setBounds(0, 0, 1280, 1024);
    
                seventhCard.setLayout(null);
                transactie.setFont(labelfont);
                transactie.setBounds(450, 0, 600, 1024);
                transactie.setForeground(Color.GREEN.darker());
                seventhCard.add(transactie);
                seventhCard.add(image);
                image.setBounds(0, 0, 1280, 1024);
    
                //Set layout
                center.setLayout(gui);
    
                //Add panels to the frame
                add("Center", center);
    
    
                //Add cards to the panel
                center.add(firstCard, firstc);
                center.add(secondCard, secondc);
                center.add(thirdCard, thirdc);
                center.add(fourthCard, fourthc);
                center.add(fifthCard, fifthc);
                center.add(sixthCard, sixthc);
                center.add(seventhCard, seventhc);
    
                setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                setTitle("Plakbank pinnen");
                setSize(1280, 1024);
                setLocation(0, 0);
                setVisible(true);
                toFront();
    
                firstCard.addMouseListener(this);
                invoeren.addActionListener(this);
                verlaten.addActionListener(this);
                one.addActionListener(this);
                two.addActionListener(this);
                three.addActionListener(this);
                four.addActionListener(this);
                five.addActionListener(this);
                six.addActionListener(this);
                seven.addActionListener(this);
                eight.addActionListener(this);
                nine.addActionListener(this);
                zero.addActionListener(this);
                del.addActionListener(this);
                ok.addActionListener(this);
                opnemen.addActionListener(this);
                opvragen.addActionListener(this);
                twintig.addActionListener(this);
                vijftig.addActionListener(this);
                honderd.addActionListener(this);
                tweehonderd.addActionListener(this);
                anders.addActionListener(this);
                ja.addActionListener(this);
                nee.addActionListener(this);
            } catch (Exception e) {
                System.out.println(e);
            }
        }
    
    /* here's some actionPerformed code which could cause any problems*/
    
    public void actionPerformed(ActionEvent e) {
            try {
                BufferedImage img = ImageIO.read(new File("path to file"));
                JLabel image = new JLabel(new ImageIcon(img));
                image.setIcon(img);
                if (e.getSource() == invoeren) {
                    if (check()) {
                        gui.next(center);
                        currentCard = thirdCard;
                    } else {
                        secondCard.remove(pininvoer);
                        secondCard.add(error);
                        error.setFont(labelfont);
                        error.setBounds(250, 100, 812, 840);
                        error.setForeground(Color.GREEN.darker());
                        this.repaint();
                    }
                }
    }
    /* alot unimportant code */
    /* something I also tryed, but also failed */
    
    @Override
        public void paint(Graphics g) {
            super.paint(g);
            g.drawImage(image, 0, 0, frame);
        }
    }
    Well I guess that's about it. There is more code, so if you can't find any problems in here I'll print my whole programme in a next comment.
    As you can see, I also tryed something with static final Strings. Didn't work either.

    I hope you can help me with this. Tired of being stuck by now lol.

  5. #5
    DionnV is offline Member
    Join Date
    Oct 2011
    Posts
    6
    Rep Power
    0

    Default Re: CardLayout and Background image

    Quote Originally Posted by camickr View Post
    A CardLayout does NOT show multiple panels at the same time. So you can't have a panel with components display over top of a panel with an image.

    Check out Background Panel « Java Tips Weblog for a couple of solutions. Or you can check out: How to Use Layered Panes (The Java™ Tutorials > Creating a GUI With JFC/Swing > Using Swing Components)
    OK, so that means adding a frame/panel with the background picture wouldn't help.

    That still leaves me with the question why it won't show my background picture when I add the picture to every single "card".

  6. #6
    DarrylBurke's Avatar
    DarrylBurke is offline Member
    Join Date
    Sep 2008
    Location
    Madgaon, Goa, India
    Posts
    11,189
    Rep Power
    19

    Default Re: CardLayout and Background image

    Quote Originally Posted by camickr View Post
    A CardLayout does NOT show multiple panels at the same time. So you can't have a panel with components display over top of a panel with an image.
    How about if the panels added to the card layout are setOpaque(false)?
    Java Code:
    import java.awt.*;
    import java.awt.event.ActionEvent;
    import java.awt.event.ActionListener;
    import javax.swing.*;
    
    public class TransparentCards {
    
      public static void main(String[] args) throws Exception {
        SwingUtilities.invokeLater(new Runnable() {
    
          @Override
          public void run() {
            new TransparentCards().makeUI();
          }
        });
      }
    
      public void makeUI() {
        final CardLayout layout = new CardLayout();
        final JPanel cards = new JPanel(layout) {
    
          @Override
          protected void paintComponent(Graphics g) {
            super.paintComponent(g);
            g.setColor(Color.red);
            for (int i = 0; i < getWidth(); i += 50) {
              for (int j = 0; j < getHeight(); j += 50) {
                g.fillRect(i, j, 10, 10);
              }
            }
          }
        };
        for (int i = 0; i < 4; i++) {
          JPanel card = new JPanel();
          card.add(new JLabel("Label " + i));
          card.add(new JButton("Button " + i));
          card.setOpaque(false);
          cards.add(card, "card" + i);
    
        }
        new Timer(1000, new ActionListener() {
    
          int cardNo;
    
          @Override
          public void actionPerformed(ActionEvent e) {
            layout.show(cards, "card" + (cardNo++) % 4);
          }
        }).start();
        JFrame frame = new JFrame();
        frame.add(cards);
    
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.setSize(400, 400);
        frame.setLocationRelativeTo(null);
        frame.setVisible(true);
      }
    }
    db
    If you're forever cleaning cobwebs, it's time to get rid of the spiders.

  7. #7
    camickr is offline Senior Member
    Join Date
    Jul 2009
    Posts
    1,226
    Rep Power
    6

    Default Re: CardLayout and Background image

    Based on the posters original code I though he was just trying to have a CardLayout with two cards, one for the image and the other for the components.

    My comment was about having one card with an image and another card with components. That won't work because the CardLayout only makes one card visible at a time.

  8. #8
    Grkn is offline Member
    Join Date
    Oct 2011
    Posts
    65
    Rep Power
    0

    Default Re: CardLayout and Background image

    you wrote paint override method but I do not really understand that which compnents paint method it is?

    swing uses paintComponent method. Also you have to write setBackgroundImage() method for each card.

    when you press the one card label, paintComponent() method is triggered
    Container calls for paint method of card that you have pressed, and draws appropriate component

    For more information pattern you can look for MVC (model-view-controller)
    paintComponent(Graphics g){
    //this method calls for each component that is needed (Swing Components Only)
    }

    Just implement paintComponent method for each card and you can add additional drawings //The rest is handled by container

Similar Threads

  1. use image for background
    By tony_stark in forum AWT / Swing
    Replies: 1
    Last Post: 05-31-2011, 08:20 PM
  2. Swing : Background image
    By Java Unknown in forum New To Java
    Replies: 1
    Last Post: 02-24-2011, 09:52 AM
  3. [Help] W/ background image
    By gundum584 in forum New To Java
    Replies: 9
    Last Post: 01-10-2011, 05:48 AM
  4. Background image
    By leiferouis in forum New To Java
    Replies: 9
    Last Post: 03-08-2009, 05:49 PM
  5. Image as background
    By Java.child in forum AWT / Swing
    Replies: 2
    Last Post: 10-02-2008, 11:37 PM

Posting Permissions

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