GridBagLayout not aligning images properly

Question

Initially I have a deck Image and a text "Deck" just below the image which looks fine

public class GuiTut extends JPanel { 
   private GridBagConstraints c = new GridBagConstraints();
   private JLabel deckLabel = new JLabel();

   public GuiTut() {
        setLayout(new GridBagLayout());  

        try {
            deck = ImageIO.read(new File("resources/images/deck.jpg"));  
        } catch (Exception e) {}   

        c.gridx = 0;
        c.gridy = 0;
        JLabel deckPic = new JLabel(new ImageIcon(deck));    
        add(deckPic, c);

        deckLabel.setText("Deck");
        c.gridx = 0;
        c.gridy = 1;
        add(deckLabel, c);
}

But after I add my gridLayout panel, my whole GUI design has been messed up. As you can see my deck image is not aligned properly with the first row of my gridLayout and my text "deck" has been separated by a few wide space.

public class GuiTut extends JPanel { 
   private GridBagConstraints c = new GridBagConstraints();
   private JLabel deckLabel = new JLabel();
   private JPanel gridLayoutPanel = new JPanel(new GridLayout(2, 0));
   private JLabel[] label = new JLabel[14];

   public GuiTut() {
        setLayout(new GridBagLayout());  

        try {
            card = ImageIO.read(new File("resources/images/card.jpg"));  
        } catch (Exception e) {} 

        for(int i = 0; i < 14; i++) {   
            label[i] = new JLabel(new ImageIcon(card);
            gridLayoutPanel.add(label[i]);
        }

        try {
            deck = ImageIO.read(new File("resources/images/deck.jpg"));  
        } catch (Exception e) {}   

        c.gridx = 0;
        c.gridy = 0;
        JLabel deckPic = new JLabel(new ImageIcon(deck));    
        add(deckPic, c);

        deckLabel.setText("Deck");
        c.gridx = 0;
        c.gridy = 1;
        add(deckLabel, c);

        c.gridx = 1;
        c.gridy = 0;
        add(gridLayoutPanel, c);
}

What I want is the deck image to be align with the first row of the gridLayout and the text "deck" just right below the deck image but I can't seem to get it.

Answer 1

HotLinked images

1. For the deck label, you can just the set the text of the label and set the vertical/horizontal text poistions

   JLabel label = new JLabel(new ImageIcon(new URL(DECK_URL)));
   label.setText("DECK");
   label.setHorizontalTextPosition(JLabel.CENTER);
   label.setVerticalTextPosition(JLabel.BOTTOM);
   

2. For the deck positioning problem, you can use a different layout manager like BorderLayout for outer panel, and a default flow layout for the deck panel. The cards will still be GridLayout. It's usually helpful to nest panels when you need to

Example

import java.awt.BorderLayout;
import java.awt.GridLayout;
import java.net.URL;

import javax.swing.ImageIcon;
import javax.swing.JLabel;
import javax.swing.JOptionPane;
import javax.swing.JPanel;
import javax.swing.SwingUtilities;

public class GuiTest {

    private static final String DECK_URL = "http://i.stack.imgur.com/xNffR.png";
    private static final String CARD_URL = "http://i.stack.imgur.com/uVS1D.png";

    private static JPanel createDeckPanel() {
        JPanel panel = new JPanel();
        try {
            JLabel label = new JLabel(new ImageIcon(new URL(DECK_URL)));
            label.setText("DECK");
            label.setHorizontalTextPosition(JLabel.CENTER);
            label.setVerticalTextPosition(JLabel.BOTTOM);
            panel.add(label);
        } catch (Exception ex) {
            ex.printStackTrace();
        }
        return panel;
    }

    private static JPanel createCenterPanel(int rows, int cols) {
        JPanel panel = new JPanel(new GridLayout(rows, cols));
        for (int i = 0; i < rows*cols; i++) {
            try {
                panel.add(new JLabel(new ImageIcon(new URL(CARD_URL))));
            } catch (Exception ex) {
                ex.printStackTrace();
            }   
        }
        return panel;
    }

    public static void main(String[] args) {
        SwingUtilities.invokeLater(new Runnable(){
            public void run() {
                JPanel panel = new JPanel(new BorderLayout());
                panel.add(createDeckPanel(), BorderLayout.LINE_START);
                panel.add(createCenterPanel(2, 6));
                JOptionPane.showMessageDialog(null, panel);
            }
        });
    }
}