Center an image and position text in a border layout - java

I'm trying to center an image and position text to south in a border layout.
Here's what I have so far
import java.awt.BorderLayout;
import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
public class FlowWindow extends JFrame {
public FlowWindow() {
Container contentPane = getContentPane();
JPanel PanelImage = new JPanel();
JPanel PanelText = new JPanel();
contentPane.setLayout(new FlowLayout());
This Section is where the image is supposed to be centered in the border.
//calls the image and displays it to screen
//supposed to center it also
ImageIcon imageIcon = new
ImageIcon(getClass().getResource("WITlogo.JPG"));
JLabel label = new JLabel(imageIcon);
PanelImage.add(label);
contentPane.add(PanelImage, BorderLayout.CENTER);
This section is where the text is supposed to be position south in the border.
//creates the string of text and displays to screen
//supposed to position it in the south section of the border
contentPane.add(new JLabel("Waterford Institude of technology"));
PanelText.add(label);
contentPane.add(PanelText, BorderLayout.SOUTH);
}
public static void main(String args[]) {
FlowWindow window = new FlowWindow ();
window .setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
window.setTitle("FlowWindow ");
window.pack();
window.setVisible(true);
window .show();
}
}

The easiest way to center a component is to use a GridBagLayout:
JPanel center = new JPanel( new GridBagLayout() );
JLabel imageLabel = new JLabel(...);
center.add(image, new GridBagConstraints());
JLabel textLabel = new JLabel(...);
Then you add your components to the frame using:
add(imageLabel, BorderLayout.CENTER);
add(textLabel, BorderLayout.PAGE_END);
Im really new to this
Then start by reading the section from the Swing tutorial on Layout Managers for working examples that show the basics.
Don't forget to look at the tutorial table of contents for more information on all Swing basics.

You are using a FlowLayout and adding stuff using BorderLayout constraints (for example BorderLayout.SOUTH).
If you want an centered picture with text just below you need to have a panel inside another panel.

Related

Is there a way to put JPanel on a JPanel?

I'm trying to put a JPanel inside OR on a JPanel, whichever may be the case, ultimately I just want this to work like this
As you can see on the picture, the red line is a JFrame and it has 2 JPanels inside it, on the green JPanel there are some different JPanels.
I need help with the green JPanel and the little JPanels inside it. Is there any way to make it work like this?
Any help would be greatly appreciated!
==============EDIT 1==============
So here is some code, to show you what I've done so far with the help of #hfontanez.
import javax.swing.*;
import java.awt.*;
import java.io.IOException;
public class Main
{
public static void main(String[] args)
{
//JFrame
JFrame jframe = new JFrame();
jframe.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
jframe.setSize(1920, 1080);
jframe.setResizable(false);
jframe.setLocationRelativeTo(null);
jframe.setVisible(true);
//parentJpanel - This is the main panel
JPanel parentJpanel = new JPanel();
parentJpanel.setBackground(Color.YELLOW);
parentJpanel.setSize(1920, 1080);
parentJpanel.setLayout(new BorderLayout());
//smallPanel - This is the little panel on the bottom
JPanel smallPanel = new JPanel();
smallPanel.setBackground(Color.GREEN);
smallPanel.setSize(1920, 300);
smallPanel.setLocation(0, 780);
smallPanel.setLayout(new BoxLayout(smallPanel, BoxLayout.PAGE_AXIS));
parentJpanel.add(smallPanel);
jframe.add(parentJpanel);
}
}
I expected the top part to be yellow, and the small part on the bottom to be green, yet the whoel thing turned green. What did I do wrong?
The pictured GUI is created using three panels.
The YELLOW panel is the game play area. It has no layout, no components (which define their own preferred sizes) and is custom painted, so it defines a sensible preferred size to report to the layout manager.
The GREEN panel contains controls. It uses a FlowLayout.
The RED panel uses a BorderLayout, and puts the YELLOW panel in the CENTER and the GREEN panel in the PAGE_END.
Code
This is the code that made the screenshot seen above.
import javax.swing.*;
import javax.swing.border.EmptyBorder;
import java.awt.*;
public class GameLayout {
GameLayout() {
// The main GUI. Everything else is added to this panel
JPanel gui = new JPanel(new BorderLayout(5, 5));
gui.setBorder(new EmptyBorder(4, 4, 4, 4));
gui.setBackground(Color.RED);
// The custom painted area - it is a panel that defines its preferred size.
gui.add(new GamePanel());
JPanel buttonPanel = new JPanel(new FlowLayout(FlowLayout.LEADING));
buttonPanel.setBackground(Color.GREEN);
for (int ii = 1; ii<5; ii++) {
buttonPanel.add(new JButton("B " + ii));
}
gui.add(buttonPanel,BorderLayout.PAGE_END);
JFrame f = new JFrame("Game Layout");
f.setContentPane(gui);
f.setLocationByPlatform(true);
f.pack();
f.setVisible(true);
}
public static void main(String[] args) {
Runnable r = () -> new GameLayout();
SwingUtilities.invokeLater(r);
}
}
class GamePanel extends JPanel {
GamePanel() {
setBackground(Color.YELLOW);
}
#Override
public Dimension getPreferredSize() {
return new Dimension(400, 100);
}
}
You need to use a LayoutManager so when you put the JPanel inside the other JPanel it will have the correct look. If you simply put panels inside the others, the parent JPanel will use its default layout manager, which is FlowLayout.
For the look of it, it seems you need to use Border Layout for the parent (yellow) panel. For the green, you have options, but I think your best bet is to use Box Layout with a PAGE_AXIS Component Orientation.
In general, you need to be familiarized with two things: 1) Layout Managers and how they behave, and 2) the default layout behavior of JComponents.

How to make embedded Jpanel go to WEST

Im creating an application in java swing and in it Im making what I think is called an embedded Jpanel which is to my understanding a jpanel inside a jpanel. To make this simpler we will use the panel names there is content, sidebar, and content sidebar
Sidebar is just the sidebar for the application with buttons
Content is the main content of the app
Content sidebar is a side bar inside of content, I use this so my settings page has its own side bar apart from the normal side bar.
I make sidebar aligned to WEST and content CENTER
after content.add(contentSidebar, BorderLayout.WEST); it won't make content sidebar go to west and im not sure why.
this is my source code
package Assets.Settings;
import javax.swing.*;
import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
public class Security implements ActionListener{
JFrame Security;
JPanel sideBar;
JPanel content;
//for sidebar
JButton volume;
JButton security;
JButton contactUs;
JPanel contentSidePanel;
// JButton twoStep;
// JButton changePassword;
public void security(){
Security = new JFrame();
sideBar = new JPanel();
content = new JPanel();
contentSidePanel = new JPanel();
sideBar.setPreferredSize(new Dimension(125, 700));
content.setPreferredSize(new Dimension(1000, 700));
content.setBackground(Color.YELLOW);
Security.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
Security.setTitle("Anonyomail Security Settings");
Security.setSize(1152, 700);
Security.setLayout(new java.awt.BorderLayout());
contentSidePanel.setLayout( new java.awt.BorderLayout());
volume = new JButton();
security = new JButton();
contactUs = new JButton();
// twoStep = new JButton();
// changePassword = new JButton();
volume.addActionListener(this);
contactUs.addActionListener(this);
volume.setText("Volume");
security.setText("Security");
contactUs.setText("Contact Us");
// changePassword.setText("Change Password");
// twoStep.setText("2-Step");
security.setBackground(Color.decode("#24a0ed"));
contentSidePanel.setPreferredSize(new Dimension(100, 700));
contentSidePanel.setBackground(Color.BLACK);
// contentSidePanel.add(changePassword);
// contentSidePanel.add(twoStep);
content.add(contentSidePanel, BorderLayout.WEST);
sideBar.add(volume);
sideBar.add(security);
sideBar.add(contactUs);
Security.add(sideBar, BorderLayout.WEST);
Security.add(content, BorderLayout.CENTER);
Security.pack();
Security.setVisible(true);
}
#Override
public void actionPerformed(ActionEvent e) {
if(e.getSource() == volume){
//open volume
}else if(e.getSource() == contactUs){
//open contact us
}
}
}
EDIT
The issue is that I didn't give content a border layout
You call content.add(contentSidePanel, BorderLayout.WEST) however you never set content's layout manager to BorderLayout. I believe JPanel's default layout manager is FlowLayout and thus BorderLayout.WEST implies nothing.
On another note, it seems like you're only adding one thing, contentSidePanel, to content. I believe that BorderLayout will size content to the same size as contentSidePanel and that specifying BorderLayout.WEST will have no effect since there is nothing in the center or to the east. Try adding a test JPanel to content and setting it's layout to BorderLayout.CENTER to see if I'm correct.
Note: BorderLayout's position constants where updated in JDK 1.4 from compass positions (NORTH, EAST, ...) to wordier constants (PAGE_START, PAGE_END, LINE_START, LINE_END and CENTER). Therefor the use of BorderLayout.WEST should be replaced with BorderLayout.LINE_START. - from How to use BorderLayout

How set JLabel at center of JDialog on X? [duplicate]

I'm using the NetBeans GUI builder to handle my layout (I'm terrible with LayoutManagers) and am trying to place a simple JLabel so that it is always centered (horizontally) inside its parent JPanel. Ideally, this would maintain true even if the JPanel was resized, but if that's a crazy amount of coding than it is sufficient to just be centered when the JPanel is first created.
I'm bad enough trying to handle layouts myself, but since the NetBeans GUI Builder autogenerates immutable code, it's been impossible for me to figure out how to do this centering, and I haven't been able to find anything online to help me.
Thanks to anybody who can steer me in the right direction!
Here are four ways to center a component:
import java.awt.*;
import javax.swing.*;
import javax.swing.border.*;
class CenterComponent {
public static JLabel getLabel(String text) {
return getLabel(text, SwingConstants.LEFT);
}
public static JLabel getLabel(String text, int alignment) {
JLabel l = new JLabel(text, alignment);
l.setBorder(new LineBorder(Color.RED, 2));
return l;
}
public static void main(String[] args) {
SwingUtilities.invokeLater(new Runnable() {
public void run() {
JPanel p = new JPanel(new GridLayout(2,2,4,4));
p.setBackground(Color.black);
p.setBorder(new EmptyBorder(4,4,4,4));
JPanel border = new JPanel(new BorderLayout());
border.add(getLabel(
"Border", SwingConstants.CENTER), BorderLayout.CENTER);
p.add(border);
JPanel gridbag = new JPanel(new GridBagLayout());
gridbag.add(getLabel("GridBag"));
p.add(gridbag);
JPanel grid = new JPanel(new GridLayout());
grid.add(getLabel("Grid", SwingConstants.CENTER));
p.add(grid);
// from #0verbose
JPanel box = new JPanel();
box.setLayout(new BoxLayout(box, BoxLayout.X_AXIS ));
box.add(Box.createHorizontalGlue());
box.add(getLabel("Box"));
box.add(Box.createHorizontalGlue());
p.add(box);
JFrame f = new JFrame("Streeeetch me..");
f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
f.setContentPane(p);
f.pack();
f.setLocationByPlatform(true);
f.setVisible(true);
}
});
}
}
By using Borderlayout, you can put any of JComponents to the CENTER area. For an example, see an answer to Stack Overflow question Get rid of the gap between JPanels. This should work.
Even with BoxLayout you can achieve that:
JPanel listPane = new JPanel();
listPane.setLayout(new BoxLayout(listPane, BoxLayout.X_AXIS ));
JLabel label = new JLabel();
listPane.add(Box.createHorizontalGlue());
listPane.add(label);
listPane.add(Box.createHorizontalGlue());
mKorbel's solution is perfect for your goal. Anyway I always like to suggest BoxLayout because it's very flexible.
Mara: "thanks for your response, however the NetBeans GUI Build uses GroupLayout and this is not overridable."
Not true! Right click anywhere inside JFrame (or any other GUI container) in NetBeans GUI builder and select "Set Layout". By default is selected "Free Design", which is Group layout, but you can select any other layout including Border layout as advised by mKorbel.
There's many ways to do this, depending on the layout manager(s) you use. I suggest you read the Laying Out Components Within a Container tutorial.
I believe the following will work, regardless of layout manager:
JLabel.setHorizontalAlignment(SwingConstants.CENTER)

ImageIcon extends beyond window, resizing window expands all of components instead of showing more

private void setupGUI(){
// Setup Frame
f = new JFrame("Shape Image Generator");
f.setBounds(500, 150, 450, 350);
f.setLayout(new GridLayout(8,1));
f.addWindowListener(new WindowAdapter() {
public void windowClosing(WindowEvent windowEvent){
System.exit(0);
}
});
}
I create the frame above, then 8 panels. I create various components and add them to the panels and everything works fine. Until I created an ImageIcon and added it to a label and added that label to the 8th panel. The image used is 140x129 pixels. The problem is, only the top.... maybe 1/4 of the image is showing. If I change the frames dimensions in the code, more empty space is created between each panel, but only a slight bit more of the image is shown, so the image is still off of the screen. I'd say the window is easily adding 10 pixels of spacing for every 1 more pixel of the image it shows. If I drag the corners of the window to expand it, the same thing happens. If the window is maximized I still can only see a little over half of my now very stretched image.
Things I tried:
None of my components have preferred dimensions set, but I tried setting a preferred dimension for the label then panel that contains the ImageIcon and it only added the difference between the image and preferred size in gray space above the image, pushing it further offscreen. So, I undid that.
Adding the label containing the ImageIcon to a different panel which was not the 8th and last panel, in this case, the image is still cut off, but at the point that it gets cut off, the components on the panel underneath it appear (over top of the background coloring which cuts off the image).
Exhaustively Googling this situation with about 30 different ways of phrasing it and not finding a solution.
(row1 - row8 are JPanels, I didn't include the coding for them)
ImageIcon iconStart = createImageIcon("/images/ShapeClipart.png", "Shapes");
JLabel imgLabel = new JLabel();
row8.add(imgLabel);
// Add image to image label
imgLabel.setIcon(iconStart);
// Add panels to frame
f.add(row1);
f.add(row2);
f.add(row3);
f.add(row4);
f.add(row5);
f.add(row6);
f.add(row7);
f.add(row8);
f.setVisible(true);
Window at execution
Window when stretched
edit:
adding f.pack() makes a very tall skinny window (the windows height taller than my screen) but it still looks like when I manually expand the window (empty space between panels, image partially offscreen), even if I take out f.setBounds and only use f.setLocation.
You are using a GridLayout. This gives all of the enclosed panels the same amount of space. In this case it is a vertical grid.
You should probably use something a bit different. I might try a BorderLayout in the JFrame and put the a panel containing the top seven panels (in a GridLayout) into the CENTER, and then put the JLabel into the SOUTH portion of the JFrame.
There are other ways to lay it out, but this is the first I could think of.
GridLayout makes each cell in the grid the same size and the size of each cell is determined by the largest Component contained in the grid.
In your code, the icon is the largest component and you also have only one column in your grid so every row has the same height as your icon.
Since you also limit the size of your JFrame by calling method setBounds(), the Swing infrastructure cuts off the icon so that all the components fit into the bounds you specified.
One alternative, but not the only one, is to use BoxLayout since it uses the preferred size of each of its contained components.
Here is a sample GUI that matches the screen capture that you posted and uses BoxLayout.
import static javax.swing.WindowConstants.EXIT_ON_CLOSE;
import java.awt.BorderLayout;
import java.awt.EventQueue;
import java.net.URL;
import javax.swing.BoxLayout;
import javax.swing.Icon;
import javax.swing.ImageIcon;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.JRadioButton;
import javax.swing.JTextField;
public class Shapes23 implements Runnable {
private JFrame frame;
#Override // java.lang.Runnable
public void run() {
showGui();
}
private JPanel createEighthRow() {
JPanel eighthRow = new JPanel();
URL url = getClass().getResource("paint-bursht.jpg");
Icon ico = new ImageIcon(url);
JLabel label = new JLabel(ico);
eighthRow.add(label);
return eighthRow;
}
private JPanel createFifthRow() {
JPanel fifthRow = new JPanel();
JTextField textField = new JTextField(20);
fifthRow.add(textField);
return fifthRow;
}
private JPanel createFirstRow() {
JPanel firstRow = new JPanel();
JLabel label = new JLabel("2D Shapes");
firstRow.add(label);
return firstRow;
}
private JPanel createFourthRow() {
JPanel fourthRow = new JPanel();
fourthRow.add(createRadioButton("Sphere"));
fourthRow.add(createRadioButton("Cube"));
fourthRow.add(createRadioButton("Cone"));
fourthRow.add(createRadioButton("Cylinder"));
fourthRow.add(createRadioButton("Torus"));
return fourthRow;
}
private JPanel createMainPanel() {
JPanel mainPanel = new JPanel();
BoxLayout layout = new BoxLayout(mainPanel, BoxLayout.PAGE_AXIS);
mainPanel.setLayout(layout);
mainPanel.add(createFirstRow());
mainPanel.add(createSecondRow());
mainPanel.add(createThirdRow());
mainPanel.add(createFourthRow());
mainPanel.add(createFifthRow());
mainPanel.add(createSixthRow());
mainPanel.add(createSeventhRow());
mainPanel.add(createEighthRow());
return mainPanel;
}
private JRadioButton createRadioButton(String text) {
JRadioButton radioButton = new JRadioButton(text);
return radioButton;
}
private JPanel createSecondRow() {
JPanel secondRow = new JPanel();
secondRow.add(createRadioButton("Circle"));
secondRow.add(createRadioButton("Rectangle"));
secondRow.add(createRadioButton("Square"));
secondRow.add(createRadioButton("Triangle"));
return secondRow;
}
private JPanel createSeventhRow() {
JPanel seventhRow = new JPanel();
JButton button = new JButton("Enter");
seventhRow.add(button);
return seventhRow;
}
private JPanel createSixthRow() {
JPanel sixthRow = new JPanel();
JTextField textField = new JTextField(20);
sixthRow.add(textField);
return sixthRow;
}
private JPanel createThirdRow() {
JPanel thirdRow = new JPanel();
JLabel label = new JLabel("3D Shapes");
thirdRow.add(label);
return thirdRow;
}
private void showGui() {
frame = new JFrame("Shape Image Generator");
frame.setDefaultCloseOperation(EXIT_ON_CLOSE);
frame.add(createMainPanel(), BorderLayout.CENTER);
frame.pack();
frame.setLocationByPlatform(true);
frame.setVisible(true);
}
public static void main(String[] args) {
EventQueue.invokeLater(new Shapes23());
}
}
Here is a screen capture of how it looks. Note that I couldn't find the same icon as in your screen capture so I just used a different one.

How do I place JComponents on a Jframe background image?,

I'm new here
I need help in placing components on a background image in Jframe using BorderLayout.
I tried adding the components to the label then the label to the frame but it hasn't worked so far
Here's my code:
package com.hosp;
import javax.swing.*;
import java.awt.*;
public class BackgroundImage extends JFrame {
BackgroundImage() {
//get image from package
ImageIcon img=new ImageIcon(getClass().getResource("backgroundimage.jpg"));
//add image to Label
JLabel imageLabel =new JLabel(img,JLabel.CENTER);
//button on screen
JButton btn =new JButton("Save");
//
add(imageLabel);
imageLabel.add(btn,BorderLayout.SOUTH);
}
public static void main(String []args) {
BackgroundImage frame = new BackgroundImage ();
frame.setVisible(true);
frame.setSize(300,300);
frame.setResizable(false);
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
}
}
public class backgroundImage extends JFrame{
Class names should start with an upper case character
add(imageLabel);
imageLabel.add(btn,BorderLayout.SOUTH);
validate();
Unlike a JPanel, a JLabel isn't designed to be a "container" to hold other components so it doesn't have a default layout manager so you can't just add the component to it using a BorderLayout constraint.
There is not need for the validate() method. You would only use revalidate() and repaint() when you add a component to a panel AFTER the frame is visible.
So your code should look something like:
add(imageLabel);
imageLabel.setLayout( new BorderLayout() );
imageLabel.add(btn,BorderLayout.SOUTH);
//validate();
Note this will only work if the components you add to the label are smaller than the size of the image, otherwise the component will be truncated to fit in the area of the label.
Check out Background Panel for a more flexible solution.

Categories

Resources