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.
Related
I've been spending the past few hours trying to figure out how to use a panel in my GUI class from a class named algorithms. I know this question has been asked before, But I cant seem to figure out how to incorporate it into my code, so I would appreciate any form of guidance.
Specifically, in my algorithms class I was testing trying to change the JLabel named title by creating a instance of my GUI class and then trying to use title.setText(), however it returns a Null Pointer Exception.
The title JLabel is located on my JPanel named topPanel
I know I'm not doing something right, I've struggled with this for the past few hours and cant seem to make any progress. Like I said, any guidance would be appreciated.
GUI.java
import javax.swing.*;
import java.awt.*;
import java.util.Date;
public class GUI extends JFrame {
public JFrame myFrame;
public JPanel firstFitDisplay,topPanel;
public JLabel title;
public Timer timer;
public int count=0;
public GUI(){
}
public void initGUI(){
JFrame myFrame = new JFrame();
myFrame.setTitle("CIS 452 Dynamic Memory Allocation Project");
myFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
myFrame.setResizable(true);
myFrame.setLayout(new BorderLayout(6,6));
myFrame.setSize(1000,700);
myFrame.setVisible(true);
//myFrame.getContentPane().setBackground(Color.white);
//setup panels
JPanel infoPanel = new JPanel();
JPanel centerPanel = new JPanel();
JPanel topPanel = new JPanel();
JPanel bottom = new JPanel();
infoPanel.setBackground(Color.cyan);
centerPanel.setBackground(Color.red);
topPanel.setBackground(Color.yellow);
bottom.setBackground(Color.pink);
infoPanel.setPreferredSize(new Dimension(200,1000));
centerPanel.setPreferredSize(new Dimension(500,500));
topPanel.setPreferredSize(new Dimension(750,20));
bottom.setPreferredSize(new Dimension(750,25));
//setup layout for panels, so that we can add subpanels
infoPanel.setLayout(new BoxLayout(infoPanel,BoxLayout.PAGE_AXIS));
//add panels to main frame
myFrame.add(infoPanel,BorderLayout.WEST);
myFrame.add(centerPanel,BorderLayout.CENTER);
myFrame.add(topPanel,BorderLayout.NORTH);
myFrame.add(bottom,BorderLayout.SOUTH);
// setup sub panels for infoPanel
JPanel infoSubPanel = new JPanel();
infoSubPanel.setBackground(Color.pink);
infoSubPanel.setPreferredSize(new Dimension(50,90));
infoPanel.add(infoSubPanel);
//setting up text for infoSubPanel
JLabel subPanelTitle = new JLabel("Next Process Size to be allocated");
JLabel firstFitNextUpLabel = new JLabel("First:0");
JLabel bestFitNextUpLabel = new JLabel("Best:0");
JLabel worstFitNextUpLabel = new JLabel("Worst:0");
infoSubPanel.add(subPanelTitle);
infoSubPanel.add(firstFitNextUpLabel);
infoSubPanel.add(bestFitNextUpLabel);
infoSubPanel.add(worstFitNextUpLabel);
//subClockPanel
JPanel infoSubClockPanel = new JPanel();
infoSubClockPanel.setBackground(Color.GRAY);
infoSubClockPanel.setPreferredSize(new Dimension(50,90));
infoPanel.add(infoSubClockPanel);
//setting up text for sub clock panel
JLabel clockText = new JLabel("Seconds passed: ");
int ten = 10;
JLabel clockCounter = new JLabel("0");
infoSubClockPanel.add(clockText);
infoSubClockPanel.add(clockCounter);
//logic for running timer;
timer = new Timer(1000, e -> {
clockCounter.setText(String.valueOf(count++));
});
timer.start();
//setting up sub panels for the main center panel
centerPanel.setLayout(new FlowLayout());
JPanel firstFitDisplay = new JPanel();
JPanel bestFitDisplay = new JPanel();
JPanel worstFitDisplay = new JPanel();
firstFitDisplay.setPreferredSize(new Dimension(200,500));
bestFitDisplay.setPreferredSize(new Dimension(200,500));
worstFitDisplay.setPreferredSize(new Dimension(200,500));
centerPanel.add(firstFitDisplay);
centerPanel.add(bestFitDisplay);
centerPanel.add(worstFitDisplay);
//center components
centerPanel.setAlignmentX(Component.CENTER_ALIGNMENT);
firstFitDisplay.setAlignmentX(Component.CENTER_ALIGNMENT);
//setup title
JLabel title = new JLabel("Dynamic Memory Allocation Simulator");
topPanel.add(title);
}
}
and here is algorithms.java
import javax.swing.*;
import java.awt.*;
public class algorithms {
public static void main(String[] args) {
GUI f = new GUI();
f.initGUI();
f.title.setText("HHHHHHHHHHH");
}
}
so your mistake is that you never define title in your GUI class. I think you intended to with this line:
JLabel title = new JLabel("Dynamic Memory Allocation Simulator");
This actually creates a new local variable called title instead of defining the global one. So the global variable is still null. To fix this simply change that to like to this:
this.title = new JLabel("Dynamic Memory Allocation Simulator");
Now it will define the global variable! This shouldn't give a null pointer exception now.
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.
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.
I'm trying to use a grid layout to make a GUI window. I add all my components and it compiles but when it runs it doesn't show anything. I'm trying to make a simple layout grouped and stacked like this.
{introduction message}
{time label
time input text}
{gravity label
gravity input text}
{answer label
answer text box}
{calculate button clear button}
Here is my code
import javax.swing.*;
import java.awt.*;
public class TurnerRandyFallingGUI extends JFrame
{
final int WINDOW_HEIGHT=500;
final int WINDOW_WIDTH=500;
public TurnerRandyFallingGUI()
{
setTitle("Falling Distance Calculator");
setSize(WINDOW_WIDTH,WINDOW_HEIGHT);
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setLayout(new GridLayout(1, 5));
//labels
JLabel introMessage = new JLabel("Welcome to the Falling distance"+
"calculator");
JLabel timeLabel = new JLabel("Please enter the amount of time "+
"in seconds the object was falling.");
JLabel gravityLabel = new JLabel("Enter the amount of gravity being "+
"forced onto the object");
JLabel answerLabel = new JLabel("Answer");
//text fields
JTextField fTime = new JTextField(10);
JTextField gForce = new JTextField(10);
JTextField answerT = new JTextField(10);
//buttons
JButton calculate = new JButton("Calculate");
JButton clr = new JButton("clear");
//panels
JPanel introP = new JPanel();
JPanel timeP = new JPanel();
JPanel gravityP = new JPanel();
JPanel answerP = new JPanel();
JPanel buttonsP = new JPanel();
//adding to the panels
//intro panel
introP.add(introMessage);
//time panel
timeP.add(timeLabel);
timeP.add(fTime);
//gravity panel
gravityP.add(gravityLabel);
gravityP.add(gForce);
//answer panel
answerP.add(answerLabel);
answerP.add(answerT);
//button panel
buttonsP.add(calculate);
buttonsP.add(clr);
setVisible(true);
}
public static void main(String[] args)
{
new TurnerRandyFallingGUI();
}
}
You've added nothing to the JFrame that your class above extends. You need to add your components to containers whose hierarchy eventually leads to the top level window, to the this if you will. In other words, you have no add(someComponent) or the functionally similar this.add(someComponent)method call in your code above.
Consider adding all of your JPanels to a single JPanel
Consider adding that JPanel to the JFrame instance that is your class by calling add(thatJPanel).
Even better would be to not extend JFrame and just to create one when needed, but that will likely be the subject of another discussion at another time.
Before setVisible (true) statement add following statements:
add (introP);
add (timeP);
add (gravityP);
add (answerP);
add (buttonsP);
There is nothing in your JFrame. That is the reason
import javax.swing.*;
import java.awt.*;
public class TurnerRandyFallingGUI extends JFrame
{
final int WINDOW_HEIGHT=500;
final int WINDOW_WIDTH=500;
public TurnerRandyFallingGUI()
{
//labels
JLabel introMessage = new JLabel("Welcome to the Falling distance"+
"calculator");
JLabel timeLabel = new JLabel("Please enter the amount of time "+
"in seconds the object was falling.");
JLabel gravityLabel = new JLabel("Enter the amount of gravity being "+
"forced onto the object");
JLabel answerLabel = new JLabel("Answer");
//text fields
JTextField fTime = new JTextField(10);
JTextField gForce = new JTextField(10);
JTextField answerT = new JTextField(10);
//buttons
JButton calculate = new JButton("Calculate");
JButton clr = new JButton("clear");
//panels
JPanel introP = new JPanel();
JPanel timeP = new JPanel();
JPanel gravityP = new JPanel();
JPanel answerP = new JPanel();
JPanel buttonsP = new JPanel();
//adding to the panels
//intro panel
introP.add(introMessage);
//time panel
timeP.add(timeLabel);
timeP.add(fTime);
//gravity panel
gravityP.add(gravityLabel);
gravityP.add(gForce);
//answer panel
answerP.add(answerLabel);
answerP.add(answerT);
//button panel
buttonsP.add(calculate);
buttonsP.add(clr);
setLayout(new GridLayout(5, 1));
this.add(introP);
this.add(timeP);
this.add(gravityP);
this.add(answerP);
this.add(buttonsP);
setTitle("Falling Distance Calculator");
this.pack();
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setVisible(true);
this.validate();
}
public static void main(String[] args)
{
SwingUtilities.invokeLater(new Runnable() {
#Override
public void run() {
new TurnerRandyFallingGUI();
}
});
}
}
Consider the following
In GridLayout, the first parameter is Rows, Second is columns
Never set the size of JFrame manually. Use pack() method to decide
the size
Use SwingUtilities.InvokeLater() to run the GUI in another thread.
I'm trying to draw a gui like shown in the figure, but somehow I'm not able to place the objects in right place (I guess that the problem is with the layout) the textArea is suppose to go in the middle... but is not showing at all
package Chapter22Collections;
import javax.swing.*;
import java.awt.*;
public class Exercise226 extends JFrame {
private JButton jbSort;
private JButton jbReverse;
private JButton jbAdd;
private JButton jbShuffle;
private JLabel jlAddnum;
private JTextArea jTextDisplay;
private JTextField jTextAdd;
public Exercise226() {
jbSort = new JButton("Sort");
jbReverse = new JButton("Reverse");
jbShuffle = new JButton("Shuffle");
jbAdd = new JButton("Add");
jlAddnum = new JLabel("Add number here: ");
jTextDisplay = new JTextArea();
jTextAdd = new JTextField(8);
setLayout(new BorderLayout());
JPanel p1 = new JPanel(new GridLayout(1,3));
p1.add(jlAddnum);
p1.add(jTextAdd);
p1.add(jbAdd);
JPanel p2 = new JPanel(new GridLayout(1,3));
p2.add(jbSort);
p2.add(jbReverse);
p2.add(jbShuffle);
add(p1, BorderLayout.NORTH);
add(jTextDisplay, BorderLayout.CENTER);
add(p2, BorderLayout.SOUTH);
}
public static void main(String... args) {
Exercise226 gui = new Exercise226();
gui.setTitle("Numbers");
gui.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
gui.setSize(300, 200);
gui.setLocationRelativeTo(null);
gui.setVisible(true);
}
}
The JTextArea is actually where you expect it to be but has no outline border. It is usual to place the component in a JScrollPane which will give this effect:
add(new JScrollPane(jTextDisplay), BorderLayout.CENTER);
or simply
add(new JScrollPane(jTextDisplay));
To make the textArea re-size with the window, try BoxLayout. Box is "A lightweight container that uses a BoxLayout object as its layout manager."
Box p1 = new Box(BoxLayout.X_AXIS);
How could I add spacing/padding between the elements in the frame? So the text area is more visible and centered.
Borders and padding. E.G.
Compared with:
import javax.swing.*;
import java.awt.*;
import javax.swing.border.EmptyBorder;
import javax.swing.border.TitledBorder;
public class Exercise226 {
private JButton jbSort;
private JButton jbReverse;
private JButton jbAdd;
private JButton jbShuffle;
private JLabel jlAddnum;
private JTextArea jTextDisplay;
private JTextField jTextAdd;
private JPanel gui;
public Exercise226() {
gui = new JPanel(new BorderLayout(5,5));
jbSort = new JButton("Sort");
jbReverse = new JButton("Reverse");
jbShuffle = new JButton("Shuffle");
jbAdd = new JButton("Add");
jlAddnum = new JLabel("Add number here: ");
// set the size constraints using columns/rows
jTextDisplay = new JTextArea("Here I am!", 6,20);
jTextAdd = new JTextField(8);
JPanel p1 = new JPanel(new GridLayout(1,3,3,3));
p1.add(jlAddnum);
p1.add(jTextAdd);
p1.add(jbAdd);
JPanel p2 = new JPanel(new GridLayout(1,3,3,3));
p2.add(jbSort);
p2.add(jbReverse);
p2.add(jbShuffle);
JPanel textAreaContainer = new JPanel(new GridLayout());
textAreaContainer.add(new JScrollPane(jTextDisplay));
textAreaContainer.setBorder(new TitledBorder("Text Area Here"));
gui.add(p1, BorderLayout.PAGE_START);
gui.add(textAreaContainer, BorderLayout.CENTER);
gui.add(p2, BorderLayout.PAGE_END);
gui.setBorder(new EmptyBorder(4,4,4,4));
}
public Container getGui() {
return gui;
}
public static void main(String... args) {
JFrame f = new JFrame();
Exercise226 gui = new Exercise226();
f.setContentPane(gui.getGui());
f.setTitle("Numbers");
f.setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
f.pack();
f.setLocationByPlatform(true);
f.setVisible(true);
}
}
This code:
Primarily provides 'white space' in the GUI using different constructors for the layouts that accept 2 int arguments for horizontal & vertical spacing.
Also adds 2 borders:
An empty border around the entire GUI to provide some spacing between it and the frame decorations.
A titled border around the text area, to make it very obvious.
Does implement a change for one unnecessary part of the original code. Instead of extending frame, it simply retains an instance of one.
Uses the JScrollPane container for the text area, as suggested by #Reimeus. It adds a nice beveled border of its own to an element that needs no scroll bars.
Creates a textAreaContainer specifically so that we can set a titled border to surround the scroll pane - without interfering with its existing border. It is possible to use a CompoundBorder for the scroll pane that consists of the existing border (scroll.getBorder()) & the titled border. However that gets complicated with buttons & other elements that might change borders on selection or action. So to set an 'outermost border' for a screen element (like the text area here) - I generally prefer to wrap the entire component in another container first.
Does not create and show the GUI on the EDT. Swing GUIs should be created and modified on the EDT. Left as an exercise for the user. See Concurrency in Swing for more details.
Old Code
The original code on this answer that provides the 'comparison GUI image' seen above. IT is closely based on the original code but with the text area wrapped in a scroll pane (and gaining a beveled border because of that) & given some text to display.
import javax.swing.*;
import java.awt.*;
public class Exercise226 extends JFrame {
private JButton jbSort;
private JButton jbReverse;
private JButton jbAdd;
private JButton jbShuffle;
private JLabel jlAddnum;
private JTextArea jTextDisplay;
private JTextField jTextAdd;
public Exercise226() {
jbSort = new JButton("Sort");
jbReverse = new JButton("Reverse");
jbShuffle = new JButton("Shuffle");
jbAdd = new JButton("Add");
jlAddnum = new JLabel("Add number here: ");
// set the size constraints using columns/rows
jTextDisplay = new JTextArea("Here I am!", 6,20);
jTextAdd = new JTextField(8);
setLayout(new BorderLayout());
JPanel p1 = new JPanel(new GridLayout(1,3));
p1.add(jlAddnum);
p1.add(jTextAdd);
p1.add(jbAdd);
JPanel p2 = new JPanel(new GridLayout(1,3));
p2.add(jbSort);
p2.add(jbReverse);
p2.add(jbShuffle);
add(p1, BorderLayout.NORTH);
add(new JScrollPane(jTextDisplay), BorderLayout.CENTER);
add(p2, BorderLayout.SOUTH);
}
public static void main(String... args) {
Exercise226 gui = new Exercise226();
gui.setTitle("Numbers");
gui.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
//gui.setSize(300, 200);
gui.pack();
//gui.setLocationRelativeTo(null);
gui.setLocationByPlatform(true);
gui.setVisible(true);
}
}