How to place JButton in custom location in JPanel?

Question

I cant seem to set a custom position of a button to JPanel. It always adds the button at the top left, and continues right. I also have a background image in place, which makes matters a bit more difficult. The Frame looks like this: imageshack.com/a/img838/3240/ez6l.png My code is:

private JFrame mainframe =  new JFrame();

public void main()
    {
    mainframe.setLocation(400, 150);
    mainframe.setDefaultCloseOperation(JFrame.DO_NOTHING_ON_CLOSE);
    mainframe.setVisible(true);
    mainframe.setSize(800, 600);
    JPanel menupanel2 = new JPanel();
    JPanel MusicPanel = new JPanel();
    mainframe.setResizable(false);
    mainframe.setContentPane(new JLabel(new ImageIcon("src/res/LED0.png")));
    mainframe.setLayout(new FlowLayout());
    menupanel2.setBackground(Color.black);
    JButton PlayButton = new JButton("Play");
    PlayButton.setBackground(Color.green);
    JButton highscores = new JButton("Highscores");
    highscores.setBackground(Color.MAGENTA);
    JButton CustomButton = new JButton("Custom Shapes");
    CustomButton.setBackground(Color.orange);
    JButton HelpButton = new JButton("Help");
    HelpButton.setBackground(Color.red);
    JButton AboutButton = new JButton("About");
    AboutButton.setBackground(Color.yellow);
    final JButton MusicButton = new JButton("music");
    MusicButton.setPreferredSize(new Dimension(50, 50));
    CustomButton.setPreferredSize(new Dimension(140, 40));
    PlayButton.setPreferredSize(new Dimension(140, 40));
    HelpButton.setPreferredSize(new Dimension(140, 40));
    AboutButton.setPreferredSize(new Dimension(140, 40));
    highscores.setPreferredSize(new Dimension(140, 40));
    mainframe.add(menupanel2, BorderLayout.NORTH);
    mainframe.add(MusicPanel, BorderLayout.SOUTH);
    menupanel2.add(PlayButton, BorderLayout.NORTH);
    menupanel2.add(CustomButton, BorderLayout.NORTH);
    menupanel2.add(HelpButton, BorderLayout.NORTH);
    menupanel2.add(highscores, BorderLayout.NORTH);
    menupanel2.add(AboutButton, BorderLayout.NORTH);
    MusicPanel.add(MusicButton, BorderLayout.SOUTH);

I want to add the button "MusicButton " to the bottom right corner / middle/ or left. If there is a customized way in which you can order JButtons in JPanel, please share. Thanks

Answer 1

Don't start throwing tomatoes if I'm wrong, but....

your mainframe layout is the FlowLayout

mainframe.setLayout(new FlowLayout());

You're specifying that your MusicPanel be set to a BorderLayout position on a JFrame that is set for the FlowLayout.

mainframe.add(MusicPanel, BorderLayout.SOUTH);

By doing this, you can't really predict what your GUI is going to look like when it compiles.This could be the source of your issue.

Also, on a side note, the compass references are no longer the preferred method of setting locations in a BorderLayout. http://docs.oracle.com/javase/tutorial/uiswing/layout/border.html

---

I would try setting your JFrame's layout to BorderLayout, set your MusicPanel to the PAGE_END (SOUTH) position of the JFrame. Then, use the GridBag layout on your MusicPanel and position your JButton to the LAST_LINE_END position.

Let me know how that works out!

Answer 2

I think you should do some research on layout in java. It's a good habit to make the frame.setVisible(true); at the last of your code. Here is my solution, Hope it can help you.

import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.GridLayout;
import java.awt.Image;
import java.io.File;
import java.io.IOException;

import javax.imageio.ImageIO;
import javax.swing.Box;
import javax.swing.BoxLayout;
import javax.swing.ImageIcon;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.border.EmptyBorder;



public class LayoutDemo {
    public static void main(String[] args) {
        LayoutDemo gridLayoutDemo = new LayoutDemo();
        try {
            gridLayoutDemo.createUI();
        } catch (IOException e) {
            // TODO Auto-generated catch block
            System.out.println("File read exception");
            e.printStackTrace();
        }
    }

    public void createUI() throws IOException{
        JFrame frame = new JFrame("Grid Layout");
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.setResizable(false);
        JPanel mainPanel = new MainPanel("background.png");

        mainPanel.setLayout(new BoxLayout(mainPanel, BoxLayout.Y_AXIS));
        frame.add(mainPanel,BorderLayout.CENTER);
        JPanel topPanel = new JPanel();
        topPanel.setOpaque(false);
        mainPanel.add(topPanel);        
        mainPanel.add(Box.createVerticalStrut(500));        
        BottomPanel bottomPanel = new BottomPanel();
        mainPanel.add(bottomPanel); 

        frame.setSize(820, 620);
        frame.setLocationRelativeTo(null);
        frame.setVisible(true);
    }

    @SuppressWarnings("serial")
    class MainPanel extends JPanel{
        private Image background;

        public MainPanel(String fileName) throws IOException{
            background = ImageIO.read(new File(fileName));
        }

        protected void paintComponent(Graphics g) {
            super.paintComponent(g);
            g.drawImage(background, 0, 0, this);
        }
    }

    @SuppressWarnings("serial")
    class BottomPanel extends JPanel{
        public BottomPanel(){
            LeftPanel leftPanel = new LeftPanel();
            leftPanel.setOpaque(false);
            leftPanel.setBorder(new EmptyBorder(0, 0, 0, 0));
            RightPanel rightPanel = new RightPanel();
            rightPanel.setBorder(new EmptyBorder(0, 0 , 0, 0));
            rightPanel.setOpaque(false);
            add(leftPanel,BorderLayout.WEST);
            add(rightPanel,BorderLayout.EAST);

            setOpaque(false);
        }
    }

    @SuppressWarnings("serial")
    class LeftPanel extends JPanel{
        public LeftPanel(){
            setLayout(new GridLayout(1,5,5,10));
            setBorder(new EmptyBorder(0, 5, 0, 55));
            setOpaque(false);
            JButton playButton = new JButton("Play");
            playButton.setBackground(Color.green);
            playButton.setPreferredSize(new Dimension(140, 40));
            add(playButton);

            JButton shapesButton = new JButton("Custom Shapes");
            shapesButton.setBackground(Color.orange);
            add(shapesButton);

            JButton helpButton = new JButton("Help");
            helpButton.setBackground(Color.red);
            add(helpButton);

            JButton scoresButton = new JButton("HighScores");
            scoresButton.setBackground(new Color(120,81,169));
            add(scoresButton);

            JButton aboutButton = new JButton("About");
            aboutButton.setBackground(Color.yellow);
            add(aboutButton);
        }

    }

    @SuppressWarnings("serial")
    class RightPanel extends JPanel{
        public RightPanel(){
            setBorder(new EmptyBorder(0, 0, 0, 0));
            JButton button = new JButton(new ImageIcon("buttonIcon.png"));
            button.setBorder(new EmptyBorder(0, 0, 0, 0));;
            add(button,BorderLayout.CENTER);
        }
    }
}

Here is the operation effect.

Answer 3

This MCVE uses standard JSE layouts, insets and borders to create the GUI seen above. The trick to the white space in the GUI is commented in the source code as // 1 which can be explained by the simple (but longer) instruction // Adjust numbers as required.

Drag it wider and taller to see that:

• The extra width of the UI is divided up between each button roughly equally. The 'black' button sticks to the RHS of the UI.
• The extra height is shown between the top row of buttons and the bottom button.

---

import java.awt.*;
import java.awt.image.BufferedImage;
import javax.swing.*;
import javax.swing.border.EmptyBorder;

public class ShapeShape {

    // the GUI as seen by the user (without frame)
    JPanel ui = new JPanel(new BorderLayout());

    public static final String[] ACTIONS = {
        "Play", "Custom Shapes", "Help", "High Scores", "About"
    };

    public static final Color[] COLORS = {
        Color.GREEN,Color.ORANGE,Color.RED,Color.MAGENTA,Color.YELLOW
    };

    ShapeShape() {
        initUI();
    }

    public void initUI() {
        ui.setBorder(new EmptyBorder(20, 30, 20, 30)); // 1

        JPanel menuPanel = new JPanel(new GridLayout(1, 0, 10, 10)); // 1
        ui.add(menuPanel, BorderLayout.PAGE_START); 
        Insets insets = new Insets(10, 20, 10, 20); // 1
        for (int ii=0; ii<ACTIONS.length; ii++) {
            JButton b = new JButton(ACTIONS[ii]);
            b.setMargin(insets);
            Font f = b.getFont();
            b.setFont(f.deriveFont(f.getSize()*1.4f)); // 1
            b.setBackground(COLORS[ii]);
            menuPanel.add(b);
        }

        Image img = new BufferedImage(60,60, BufferedImage.TYPE_INT_RGB);
        JPanel exitPanel = new JPanel(new FlowLayout(SwingConstants.RIGHT));
        exitPanel.setBorder(new EmptyBorder(15, 0, 0, 15)); // 1
        JButton b = new JButton(new ImageIcon(img));
        exitPanel.add(b);
        ui.add(exitPanel, BorderLayout.PAGE_END);
    }

    public final JComponent getUI() {
        return ui;
    }

    public static void main(String[] args) {
        Runnable r = new Runnable() {

            @Override
            public void run() {

                ShapeShape o = new ShapeShape();

                JFrame f = new JFrame("Demo");
                f.add(o.getUI());
                // Ensures JVM closes after frame(s) closed and
                // all non-daemon threads are finished
                f.setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
                // See http://stackoverflow.com/a/7143398/418556 for demo.
                f.setLocationByPlatform(true);

                // ensures the frame is the minimum size it needs to be
                // in order display the components within it
                f.pack();
                // should be done last, to avoid flickering, moving,
                // resizing artifacts.
                f.setVisible(true);
            }
        };
        // Swing GUIs should be created and updated on the EDT
        // http://docs.oracle.com/javase/tutorial/uiswing/concurrency
        SwingUtilities.invokeLater(r);
    }
}