(Java) There are white borders around all my buttons - java

In java, My buttons are surrounded by white, thick borders that only appear when I have a image in a jlabel for the background.
Example:
The problem here is that white borders go around all of my buttons, making it look terrible. The intended use was for the buttons to just go over the image, like this image:
Here is my code:
public class Gui extends JFrame {
private JTextField TextField;
private JButton Hi, Bye, Exit;
private JPanel Panel, Panel1, Panel2;
private JLabel label;
public Gui() {
super("My Program");
TextField = new JTextField("");
TextField.setEditable(false);
Hi = new JButton("Hi");
Bye = new JButton("Bye");
Exit = new JButton("Exit");
Actions a = new Actions();
Hi.addActionListener(a);
Bye.addActionListener(a);
Exit.addActionListener(a);
Dimension tfd = new Dimension(780, 25);
Dimension bd = new Dimension (75, 25);
Dimension lpd = new Dimension (800, 600);
TextField.setPreferredSize(tfd);
Hi.setPreferredSize(bd);
Bye.setPreferredSize(bd);
Exit.setPreferredSize(tfd);
ImageIcon image = new ImageIcon("C:/Users/Dakota/Desktop/Coding/Coding/img/Background.png");
label = new JLabel(image);
Panel = new JPanel();
this.setContentPane(label);
this.add(Panel);
this.setLayout(new FlowLayout());
Panel.add(TextField);
Panel1 = new JPanel();
this.add(Panel1);
Panel1.add(Hi);
Panel1.add(Bye);
Panel2 = new JPanel();
this.add(Panel2);
Panel2.add(Exit);
}

Your problem appears that you're adding JPanels to your GUI and not changing the opaque property. This property is by default true, meaning that the JPanel will paint a background that visually covers up anything below it, but if you set it to false by calling myPanel.setOpaque(false);, then any components below the JPanel will show through. This is true for most any Swing component, although is not quite straight-forward for component components such as JScrollPanes, and JTextComponents.

Related

How can I resize the height of a JPanel?

//Attributes
//Stats GUI components
JLabel hp = new JLabel();
JLabel hpPoints = new JLabel("TEST");
JLabel chakra = new JLabel();
JLabel chakraPoints = new JLabel("TEST");
JLabel ryo = new JLabel();
JLabel ryoPoints = new JLabel("TEST");
//Output & Input GUI components
JTextField input = new JTextField();
JTextArea output = new JTextArea(1000, 300);
JPanel statsPanel = new JPanel();
JPanel outputPanel = new JPanel();
JPanel inputPanel = new JPanel();
//Constructor
public Terminal() {
setTitle("Shinobi Shinso");
setSize(1000, 600);
//setResizable(false);
setLocation(400, 100);
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
Container panneau = getContentPane();
panneau.setLayout(new GridLayout(0, 1));
statsPanel.setLayout(new GridLayout(1, 3));
//Output & input
//Add outputPanel to the panneau
panneau.add(outputPanel);
//Add output to outputPanel
outputPanel.add(output);
//Add input to outputPanel
outputPanel.add(input);
input.setColumns(98);
output.setRows(15);
output.setEditable(false);
output.setBackground(Color.BLACK);
output.setForeground(Color.WHITE);
//Add stats panel
panneau.add(statsPanel);
//Statistics
//Health
hp.setIcon(new ImageIcon(new ImageIcon("D:\\eclipse-workspace\\Shinobi Shinso\\images\\scroll-hp.png").getImage().
getScaledInstance(300, 150, Image.SCALE_DEFAULT)));
hp.setHorizontalAlignment(JLabel.CENTER);
statsPanel.add(hp);
hpPoints.setBounds(100, 25, 100, 100);
hp.add(hpPoints);
setVisible(true);
}
Here's how it appears :
I tried to use a JScrollPanel and a lot of obscure coding witchcraft to no avail. I can't seem to find a way to reduce the height of the JPanel containing the pictures.
I deleted 2 of the scrolls in the picture, but I don't think that it will change anything.
I can't seem to find a way to reduce the height of the JPanel containing the pictures.
Don't use a GridLayout as the parent layout manager. The GridLayout makes all components the same size.
I would suggest you don't change the layout manager of the content pane. Leave it as the default BorderLayout.
Then use:
panneau.add(outputPanel, BorderLayout.CENTER);
panneau.add(statsPanel, BorderLayout.PAGE_END);
Also, your creation of the JTextArea is incorrect:
JTextArea output = new JTextArea(1000, 300);
The parameters are for rows/columns, not width/height.
So you should use something like:
JTextArea output = new JTextArea(15, 40);
and a text area is usually added to a JScrollPane so scrollbars can appear when needed.
Read the Swing tutorial for Swing basics. There are section on:
Layout managers
How to Use Text Areas
that should help.

How to set position to JComponent in BoxLayout?

I want to use 2 JPanel as panel and panel_1.
I want to add image automatically to panel using JLabel
and also add JButton to panel_1.
How can I resize button according to the image which is above the button?
public class Testing extends JFrame {
public Testing() {
this.setSize(590, 327);
this.setTitle("JFrame");
getContentPane().setLayout(null);
JPanel panel = new JPanel();
panel.setBounds(118, 136, 321, 89);
getContentPane().add(panel);
panel.setLayout(new BoxLayout(panel, BoxLayout.X_AXIS));
JLabel lblImage = new JLabel("image for button1");
panel.add(lblImage);
JLabel lblImage_1 = new JLabel("image for button2");
panel.add(lblImage_1);
JLabel lblImage_2 = new JLabel("image for button3");
panel.add(lblImage_2);
JPanel panel_1 = new JPanel();
panel_1.setBounds(118, 30, 321, 77);
getContentPane().add(panel_1);
panel_1.setLayout(new BoxLayout(panel_1, BoxLayout.X_AXIS));
JButton btnNewButton = new JButton("New button 1");
panel_1.add(btnNewButton);
JButton btnNewButton_1 = new JButton("New button 2");
panel_1.add(btnNewButton_1);
JButton btnNewButton_2 = new JButton("New button 3");
panel_1.add(btnNewButton_2);
}
public static void main(String[] args) throws Exception {
Testing frame = new Testing();
frame.setVisible(true);
frame.setDefaultCloseOperation(WindowConstants.DISPOSE_ON_CLOSE);
}
}
If your goal is to have the button above the image, and have the button's width expand with the image, then:
Get rid of your use of null layouts and .setBounds(...) (this is just good general advice)
Put the JLabel with the image into a JPanel that uses BorderLayout with the JLabel in the BorderLayout.CENTER position
Put the button above the JLabel in the same JPanel using the BorderLayout.PAGE_START position.
Then put that JPanel wherever it is needed in the GUI, nesting JPanels, each using their own layout manager.
The BorderLayout will allow the center component to fill that position, and will expand the PAGE_START and PAGE_END positions to fill the width necessary. If the top and bottom components are wider, then this will also expand the width of the container.

How do I use nested panels in my GUI application?

I created a drawing application that lets a user choose pen colors but I have having trouble with the layout. I created multiple panels but when I run it, all the buttons are still in one panel. Is there a way to fix this?
public class DrawingGUI extends JPanel {
private JRadioButton penColor1, penColor2, penColor3, randomPenColor, eraser;
private JButton clearButton;
private static Color defaultColor = Color.BLACK;
private static boolean isRandomSelected = false;
private final static int DIAMETER = 12;
protected static boolean canDraw;
private ArrayList<PointTracker> points;
public DrawingGUI() {
setBackground(Color.WHITE);
points = new ArrayList<PointTracker>();
JPanel drawPanel = new JPanel();
JLabel instructions = new JLabel("Enter your information:");
JPanel instructionsPanel = new JPanel();
instructionsPanel.add(instructions);
drawPanel.add(instructionsPanel);
JPanel colorPanel1 = new JPanel();
penColor1 = new JRadioButton("Red");
drawPanel.add(penColor1);
penColor1.addActionListener(new ToolListener());
drawPanel.add(colorPanel1);
JPanel colorPanel2 = new JPanel();
penColor2 = new JRadioButton("Blue");
drawPanel.add(penColor2);
penColor2.addActionListener(new ToolListener());
drawPanel.add(colorPanel2);
JPanel colorPanel3 = new JPanel();
penColor3 = new JRadioButton("Yellow");
drawPanel.add(penColor3);
penColor3.addActionListener(new ToolListener());
drawPanel.add(colorPanel3);...(So on)
all the buttons are still in one panel
Why is that a problem. That is what I would expect to happen.
Why are you creating a separate panel for each button? The whole point of using panel is to logically group components.
So I would expect you should have something like:
JPanel buttonsPanel = new JPanel();
buttonsPanel.add( button1 );
buttonsPanel.add( button2 );
buttonsPanel.add( button3 );
JPanel drawPanel = new JPanel();
drawPanel.add( component1 );
drawPanel.add( component2 );
frame.add(drawPanel, BorderLayout.PAGE_START);
frame.add(buttonsPanel, BorderLayout.PAGE_END);
Above is a simple example of "nesting" two panels on a frame. Each of the panel can use a different layout manager as required.
For a working example of this approach you can check out Custom Painting Approaches. Both code examples show how you can "nest" a drawing panel and a buttons panel in a frame.

How to exactly make JComponents background transparent?

There are two things that I am trying to figure out. First thing, I want to figure out how to make a Jcomponent background transparent. When placing a JPanel into another JPanel that has a color set as the background, the JPanel that is set within the other JPanel has a white background that I can't seem to get rid of. I tried using the firstpanel.setOpache function and repaint but it doesn't do anything.
And second, I noticed that putting a JPanel within another JPanel thats within another JPanel compresses it size. The images below will show what I am trying to describe. I want to know what to do to avoid compressing the JPanel size and still able to put it within two levels of other JPanels . The code below is what I am practicing with.
import javax.swing.*;
import java.awt.*;
public class LearningFrame extends JFrame {
private JLabel userLabel;
private LearningFrame(){
JPanel backGroundPanel = new JPanel();
JPanel mainPanel = new JPanel();
JPanel firstPanel = new JPanel();
JPanel secondPanel = new JPanel();
userLabel = new JLabel("User");
userLabel.setFont(new Font("Arial",1 ,24));
backGroundPanel.setBackground(new Color(247,211,53));
// backGroundPanel.setLayout(new BoxLayout(backGroundPanel,BoxLayout.Y_AXIS));
setContentPane(backGroundPanel);
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setSize(1200,800);
setLocationRelativeTo(null);
//backGroundPanel.setLayout(null);
mainPanel.setLayout(new GridLayout(1,2));
firstPanel.setLayout(new FlowLayout(FlowLayout.CENTER));
secondPanel.setLayout(new BoxLayout(secondPanel,BoxLayout.Y_AXIS));
// firstPanel.setBackground(new Color(211,43,185));
secondPanel.setBackground(new Color(34,233,44));
JButton button = new JButton("Click");
JButton button2 = new JButton("Click");
JButton button3 = new JButton("Click");
JButton button4 = new JButton("Click");
firstPanel.add(button);
firstPanel.add(button2);
firstPanel.add(userLabel);
secondPanel.add(button3);
secondPanel.add(button4);
mainPanel.add(firstPanel);
mainPanel.add(secondPanel);
backGroundPanel.add(mainPanel);
setVisible(true);
}
public JPanel logPanel() {
JPanel logInPanel = new JPanel(new FlowLayout(FlowLayout.LEFT));
JTextField userTextField = new JTextField(14);
JTextField passTextField = new JTextField(14);
userLabel = new JLabel("Username: ");
JLabel passLabel = new JLabel("Password: ");
passLabel.setFont(new Font("Arial", Font.BOLD, 24));
userLabel.setFont(new Font("Arial", Font.BOLD, 24));
logInPanel.add(userLabel);
logInPanel.add(userTextField);
logInPanel.add(passLabel);
logInPanel.add(passTextField);
logInPanel.setOpaque(true);
logInPanel.repaint();
return logInPanel;
}
public static void main(String[] args){
LearningFrame x = new LearningFrame();
}
}
Just use
firstPanel.setOpaque(false);
This is will make the background of the component invisible, but you will still be able to see any components that are positioned inside it.

JButtons only appear on JFrame if in BorderLayout.CENTER, not SOUTH or NORTH

So I'm trying to create a gui, I've tinkered with gui's before in java but I'm still new to them. So my issued here is that my JLabels (butLabel & cbLabel) are filled with buttons and checkboxes. Sadly my JFrame will only show whichever is set to the BorderLayout.CENTER. NORTH & SOUTH don't ever show, even if I only set the butLabel to SOUTH and don't even use the cbLabel. What am I overlooking?? It's much appreciated, thanks!
public class mainWindow
{
JFrame frame = new JFrame("Main Window");
JLabel butLabel = new JLabel();
JLabel cbLabel = new JLabel();
JButton showBut = new JButton("Show");
JButton exitBut = new JButton("Exit");
JButton addBut = new JButton("Add");
JButton remBut = new JButton("Remove");
JCheckBox aCB = new JCheckBox("Airplane");
JCheckBox bCB = new JCheckBox("Boat");
JCheckBox cCB = new JCheckBox("Clock");
public mainWindow()
{
frame.setLayout(new BorderLayout()); //I know this is set by default to BorderLayout but I just did it when I was out of options to try.
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setMinimumSize(new Dimension(360, 480));
butLabel.setLayout(new GridLayout(1,4));
cbLabel.setLayout(new GridLayout(2, 2));
butLabel.add(showBut);
butLabel.add(exitBut);
butLabel.add(addBut);
butLabel.add(remBut);
cbLabel.add(aCB);
cbLabel.add(bCB);
cbLabel.add(cCB);
frame.add(butLabel, BorderLayout.CENTER);
frame.add(cbLabel, BorderLayout.NORTH);
}
public void setVisible()
{
butLabel.setVisible(true);//Didn't think I needed butLabel.setVisible or the cbLabel.setVisible but
cbLabel.setVisible(true);//again I was trying things that I thought might make sense.
frame.setVisible(true);
}
}
do not use Label for grouping elements, use JPanel instead
I have tried replace all
Label
with
Panel
it works

Categories