I have worked hard on writing my GUI in swing however I am trying to improve it further since I feel it still looks a little off.
I would ideally like:
the button to snap to the top right,
the textfield to be the same height as the button and stretch from the top left to the button edge
the scrollpane to stretch from the bottom of the textfield and the button to the edges of the window even when stretched.
I'm unsure how to "snap" the components to the top right, top left and rest of the area respectively.
#SuppressWarnings("serial")
class TFrame extends JFrame
{
TFrame()
{
super("Huffman Compression");//setTitle
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setSize(400, 300);
setResizable(true);
jPanel = new JPanel();
jTextField = new JTextField("Enter string to compress...");
jButton = new JButton("Compress");
jButton.setFocusable(false);
jTextArea = new JTextArea("LOG AREA", 30, 30);
jTextArea.setWrapStyleWord(true);
jTextArea.setLineWrap(true);
jTextArea.setEditable(false);
jTextArea.setFocusable(false);
jTextArea.setOpaque(false);
jScrollPane = new JScrollPane(jTextArea);
jScrollPane.setVerticalScrollBarPolicy(JScrollPane.VERTICAL_SCROLLBAR_ALWAYS);
jScrollPane.setHorizontalScrollBarPolicy(JScrollPane.HORIZONTAL_SCROLLBAR_NEVER);
jPanel.add(jTextField, BorderLayout.WEST);
jPanel.add(jButton, BorderLayout.EAST);
jPanel.add(jScrollPane, BorderLayout.SOUTH);
add(jPanel);
try
{
UIManager.setLookAndFeel(UIManager.getSystemLookAndFeelClassName());
} catch (ClassNotFoundException
| InstantiationException
| IllegalAccessException
| UnsupportedLookAndFeelException e)
{
e.printStackTrace();
}
setVisible(true);
}
private JPanel jPanel;
private JTextField jTextField;
private JButton jButton;
private JTextArea jTextArea;
private JScrollPane jScrollPane;
}
public static void main(String[] args)
{
TFrame frame = new TFrame();
frame.pack();
...
This is what it currently looks like:
http://i.imgur.com/90cmDl1.png
Regards.
Basically, you need to take advantage of a series of layout managers (commonly known as "compound layouts").
For example, you can accomplish the requirements for the button and field using a GridBagLayout and the by using a BorderLayout, you can accomplish the rest, for example...
import java.awt.BorderLayout;
import java.awt.EventQueue;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JScrollPane;
import javax.swing.JTextArea;
import javax.swing.JTextField;
import javax.swing.UIManager;
import javax.swing.UnsupportedLookAndFeelException;
public class BrowserWindow {
public static void main(String[] args) {
new BrowserWindow();
}
public BrowserWindow() {
EventQueue.invokeLater(new Runnable() {
#Override
public void run() {
try {
UIManager.setLookAndFeel(UIManager.getSystemLookAndFeelClassName());
} catch (ClassNotFoundException | InstantiationException | IllegalAccessException | UnsupportedLookAndFeelException ex) {
}
JPanel topPane = new JPanel(new GridBagLayout());
GridBagConstraints gbc = new GridBagConstraints();
gbc.gridx = 0;
gbc.gridy = 0;
gbc.weightx = 1;
gbc.fill = GridBagConstraints.BOTH;
topPane.add(new JTextField(10), gbc);
gbc.weightx = 0;
gbc.fill = GridBagConstraints.NONE;
gbc.gridx++;
topPane.add(new JButton("Compress"), gbc);
JTextArea ta = new JTextArea("Log...", 30, 30);
JScrollPane sp = new JScrollPane(ta);
JFrame frame = new JFrame("Testing");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setLayout(new BorderLayout());
frame.add(topPane, BorderLayout.NORTH);
frame.add(sp);
frame.pack();
frame.setLocationRelativeTo(null);
frame.setVisible(true);
}
});
}
}
Take a look at Laying Out Components Within a Container for more details
Related
So I'm writing a program which utilizes a GUI. The GUI is built from a JFrame and a JPanel in Java. I have a JTextArea() and a JButton() that appears beside the JTextArea on the left. I also have an image which I imported locally using the method call below ("f" is the variable name of my JFrame):
f.setIconImage(ImageIO.read(new File("image.png")));
I don't mind allowing the users to resize the JFrame but what I dislike is that JFrame automatically reformats the components on my JFrame - specifically the distance between my image and the JTextArea(). I'd like, if possible, to keep the distance between my image and the JTextArea the same regardless of the size the user resizes the JFrame to. Here's the rest of my code if that helps:
public class GUI {
private JFrame f;
private JPanel p;
private JButton b1;
private JLabel lab;
private JTextArea tf;
private static final String FileName = "schedule.txt";
private static final String FileName2 = "schedule2.txt";
public void show()
{
f = new JFrame("Scheduler");
f.setSize(600, 400);
f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
p = new JPanel();
//p.setPreferredSize(new Dimension(200, 400));
b1 = new JButton("Run");
p.add(b1);
f.add(p);
f.add(p, BorderLayout.SOUTH);
f.add(new JLabel(new ImageIcon("image.png")));
try {
f.setIconImage(ImageIO.read(new File("image.png")));
} catch(Exception z){
System.out.println("Trouble reading file");
}
tf = new JTextArea();
tf.setPreferredSize(new Dimension(300, 200));
p.add(tf);
b1.addActionListener(new ActionListener() {
#Override
public void actionPerformed(ActionEvent e) {
String text = tf.getText();
try {
FileWriter fw = new FileWriter(FileName);
fw.write(text);
fw.close();
parseInfo();
}
catch(Exception ex)
{
}
}
});
f.setVisible(true);
}
There are any number of ways you "might" achieve this, but the basic answer is, you need to choose one or more layout managers which better meets your needs.
For example, using a GridBagLayout, you can do something like...
import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.EventQueue;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import java.awt.Insets;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.JScrollPane;
import javax.swing.JTextArea;
import javax.swing.border.LineBorder;
public class JavaApplication1 {
public static void main(String[] args) {
new JavaApplication1();
}
public JavaApplication1() {
EventQueue.invokeLater(new Runnable() {
#Override
public void run() {
JFrame frame = new JFrame();
frame.add(new TestPane());
frame.pack();
frame.setLocationRelativeTo(null);
frame.setVisible(true);
}
});
}
public class TestPane extends JPanel {
public TestPane() {
setLayout(new GridBagLayout());
GridBagConstraints gbc = new GridBagConstraints();
gbc.gridx = 0;
gbc.gridy = 0;
gbc.insets = new Insets(8, 8, 8, 8);
JLabel label = new JLabel("Image placeholder") {
// This is done only for demonstration purposes
#Override
public Dimension getPreferredSize() {
return new Dimension(128, 128);
}
};
label.setBorder(new LineBorder(Color.DARK_GRAY));
add(label, gbc);
gbc.gridy++;
gbc.fill = GridBagConstraints.BOTH;
// This will cause the text area to occupy all the avalilable free space
//gbc.weightx = 1;
//gbc.weighty = 1;
JTextArea ta = new JTextArea(10, 20);
add(new JScrollPane(ta), gbc);
JButton btn = new JButton("Run");
gbc.gridy++;
// Reset the constraints
gbc.fill = GridBagConstraints.NONE;
gbc.weightx = 0;
gbc.weighty = 0;
add(btn, gbc);
}
}
}
Take a look at Laying Out Components Within a Container for more details and ideas
Recommendations...
There are a few things in your code that are, "off", but this...
tf = new JTextArea();
tf.setPreferredSize(new Dimension(300, 200));
p.add(tf);
is probably the most striking.
Generally speaking, JTextArea will benefit from been wrapped in a JScrollPane. Also, due to the inconsistencies in how text is rendered across multiple platforms, you should avoid using setPreferredSize (in fact, you should avoid using it in general) and instead rely in the rows, columns constructor, which will make calculations based on the current font and graphics properties.
I have a header on a section of my swing layout, and I want to have text centered horizontally across the whole width of the section, but also have a button on only the right side. It should look like this:
/------Same width------\ /------Same width------\
[------------------------]Text here[----------------[Button]]
I am currently using a BorderLayout, with the text in the center and the button at the line end, but the text is centered not counting the button, as such:
/----Same width----\ /---Same width----\
[--------------------]Text here[-------------------][Button]]
I'm not sure if this is the answer you really want, but you could use a different layout manager, like GridBagLayout
import java.awt.EventQueue;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.UIManager;
import javax.swing.UnsupportedLookAndFeelException;
public class JavaApplication295 {
public static void main(String[] args) {
new JavaApplication295();
}
public JavaApplication295() {
EventQueue.invokeLater(new Runnable() {
#Override
public void run() {
try {
UIManager.setLookAndFeel(UIManager.getSystemLookAndFeelClassName());
} catch (ClassNotFoundException | InstantiationException | IllegalAccessException | UnsupportedLookAndFeelException ex) {
ex.printStackTrace();
}
JFrame frame = new JFrame("Testing");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.add(new TestPane());
frame.pack();
frame.setLocationRelativeTo(null);
frame.setVisible(true);
}
});
}
public class TestPane extends JPanel {
public TestPane() {
setLayout(new GridBagLayout());
GridBagConstraints gbc = new GridBagConstraints();
gbc.gridx = 0;
gbc.gridy = 0;
// gbc.fill = GridBagConstraints.HORIZONTAL;
gbc.weightx = 1;
add(new JLabel("Look ma, no hands"), gbc);
gbc.anchor = GridBagConstraints.EAST;
add(new JButton("No Allowance"), gbc);
}
}
}
Now, the problem with this, is both components are actually positioned at the same location, the difference is, the button is anchored to the right position of the cell, this means that when the layout is been calculated, they will overlap....
Here is an approach using the OverlayLayout which was designed to have multiple components painted on the z axis:
import java.awt.*;
import javax.swing.*;
public class SSCCE extends JPanel
{
public SSCCE()
{
JLabel label = new JLabel("I'm a Centered Label");
Box labelBox= Box.createHorizontalBox();
labelBox.add(Box.createHorizontalGlue());
labelBox.add(label);
labelBox.add(Box.createHorizontalGlue());
JButton button = new JButton("Button");
Box buttonBox= Box.createHorizontalBox();
buttonBox.add(Box.createHorizontalGlue());
buttonBox.add(button);
setLayout( new OverlayLayout(this) );
add(buttonBox);
add(labelBox);
}
private static void createAndShowGUI()
{
JFrame frame = new JFrame("SSCCE");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.add(new SSCCE(), BorderLayout.NORTH);
frame.setLocationByPlatform( true );
frame.pack();
frame.setVisible( true );
}
public static void main(String[] args)
{
EventQueue.invokeLater(new Runnable()
{
public void run()
{
createAndShowGUI();
}
});
}
}
As the width decreases the button will paint over the label.
Using BorderLayout I have put two different JButtons, one on the left (west) and one on the right (east), and a horizontal JSeparator in the center. What I want to do is to y-align the separator to the center, instead of to the top as it is now. I have already tried to use the following method on the separator
setAlignmentY(CENTER_ALIGNMENT);
but it has absolutely no effect. What am I missing? If it is not possible, is there any other way to do that without using external libraries?
This is what I get:
and this is what I want to achieve:
This is the sample code that I am using (JPanels on top and bottom were added just for clarity):
import java.awt.BorderLayout;
import javax.swing.*;
public class SeparatorTest extends JFrame{
JButton btn1 = new JButton("button1");
JSeparator sep = new JSeparator(SwingConstants.HORIZONTAL);
JButton btn2 = new JButton("button2");
public SeparatorTest() {
getContentPane().add(BorderLayout.NORTH, new JPanel());
getContentPane().add(BorderLayout.WEST, btn1);
getContentPane().add(BorderLayout.CENTER, sep);
getContentPane().add(BorderLayout.EAST, btn2);
getContentPane().add(BorderLayout.SOUTH, new JPanel());
setSize(300, 85);
}
public static void main(String[] args){
new SeparatorTest().setVisible(true);
}
}
EDIT 1: I don't mind the layout as long as it looks the same, I used BorderLayout here due to its simpleness.
This will have to do with how the JSeparator UI delegate decides how to paint the component, which, based on your tests, seems to want to always paint the separator starting at a y position of 0.
Instead, you might need to wrap the JSeparator in another panel which can use a different layout manager which meets your needs, like GridBagLayout for example (of course you could just use GridBagLayout to start with, but I'm aiming for the smallest change possible ;))
import java.awt.BorderLayout;
import java.awt.EventQueue;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JSeparator;
import javax.swing.SwingConstants;
import javax.swing.UIManager;
import javax.swing.UnsupportedLookAndFeelException;
public class SeparatorTest extends JFrame {
JButton btn1 = new JButton("button1");
JSeparator sep = new JSeparator(SwingConstants.HORIZONTAL);
JButton btn2 = new JButton("button2");
public SeparatorTest() {
JPanel pane = new JPanel(new GridBagLayout());
GridBagConstraints gbc = new GridBagConstraints();
gbc.gridwidth = GridBagConstraints.REMAINDER;
gbc.weightx = 1;
gbc.fill = GridBagConstraints.HORIZONTAL;
pane.add(sep, gbc);
getContentPane().add(BorderLayout.NORTH, new JPanel());
getContentPane().add(BorderLayout.WEST, btn1);
getContentPane().add(BorderLayout.CENTER, pane);
getContentPane().add(BorderLayout.EAST, btn2);
getContentPane().add(BorderLayout.SOUTH, new JPanel());
setSize(300, 85);
}
public static void main(String[] args) {
EventQueue.invokeLater(new Runnable() {
#Override
public void run() {
try {
UIManager.setLookAndFeel(UIManager.getSystemLookAndFeelClassName());
} catch (ClassNotFoundException | InstantiationException | IllegalAccessException | UnsupportedLookAndFeelException ex) {
}
SeparatorTest frame = new SeparatorTest();
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.pack();
frame.setLocationRelativeTo(null);
frame.setVisible(true);
}
});
}
}
I tried a bunch of different layouts but none are giving me the desired effect.
I want something like this:
+-----------------------------+
Centered Text
+-------+
|Button |
+-------+
+-----------------------------+
In html it might look like this:
<p align="center">Some text</p>
<input type="button" value="Press"/>
The trouble I am having is with certain layouts (BorderLayout) it likes to resize the button to fit. Other layouts (Boxlayout and GroupLayout) will do something like this:
+-----------------------------+
Centered Text
+-------+
|Button |
+-------+
+-----------------------------+
Even when I have the JLabel aligned to CENTER and the Button aligned to LEFT.
Much appreciation to my helpers.
There are a number layouts that would be able to achieve this, in fact, you might even be able to use BorderLayout and FlowLayout together to do this, but this example simply uses GridBagLayout
import java.awt.BorderLayout;
import java.awt.EventQueue;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.UIManager;
import javax.swing.UnsupportedLookAndFeelException;
public class ExampleLayout {
public static void main(String[] args) {
new ExampleLayout();
}
public ExampleLayout() {
EventQueue.invokeLater(new Runnable() {
#Override
public void run() {
try {
UIManager.setLookAndFeel(UIManager.getSystemLookAndFeelClassName());
} catch (ClassNotFoundException | InstantiationException | IllegalAccessException | UnsupportedLookAndFeelException ex) {
}
JFrame frame = new JFrame("Testing");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setLayout(new BorderLayout());
frame.add(new TestPane());
frame.pack();
frame.setLocationRelativeTo(null);
frame.setVisible(true);
}
});
}
public class TestPane extends JPanel {
public TestPane() {
setLayout(new GridBagLayout());
GridBagConstraints gbc = new GridBagConstraints();
gbc.gridx = 0;
gbc.gridy = 0;
gbc.fill = GridBagConstraints.HORIZONTAL;
gbc.gridwidth = GridBagConstraints.REMAINDER;
gbc.weightx = 1;
JLabel center = new JLabel("Centered Text");
center.setHorizontalAlignment(JLabel.CENTER);
add(center, gbc);
gbc.gridy++;
gbc.fill = GridBagConstraints.NONE;
gbc.gridwidth = 1;
gbc.weightx = 0;
gbc.anchor = GridBagConstraints.WEST;
JButton button = new JButton("Button");
add(button, gbc);
}
}
}
Take a look at Laying Out Components Within a Container for more examples and details
Although MadProgrammer and Costis Aivalis already answered your question, here is also an answer with MigLayout:
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.SwingUtilities;
import net.miginfocom.swing.MigLayout;
public class MigLayoutDemo {
JFrame frame = new JFrame();
JPanel panel = new JPanel();
JLabel label = new JLabel("Centered text");
JButton button = new JButton("Button");
public MigLayoutDemo() {
panel.setLayout(new MigLayout());
label.setHorizontalAlignment(JLabel.CENTER);
panel.add(label, "wrap, pushx, growx");
panel.add(button);
frame.add(panel);
frame.setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
frame.pack();
frame.setVisible(true);
}
public static void main(String[] args) {
SwingUtilities.invokeLater(MigLayoutDemo::new);
}
}
Same effect, but this approach is less verbose unlike in case of GridBagLayout and I personally think that MigLayout is easier to use.
FlowLayout(int align) allows you to define justification. The default is CENTER. If you just left justify the FlowLayout of the panel that contains your button it works without having to use GridBagLayout manually. NetBeans provide an excellent GridBagLayout customizer, but you do not want to touch the code it generates automatically.
import javax.swing.*;
import java.awt.*;
public class MyLooks extends JFrame {
public MyLooks() {
setDefaultCloseOperation(EXIT_ON_CLOSE);
p = new JPanel(new GridLayout(2, 1));
p1 = new JPanel();
p2 = new JPanel(new FlowLayout(FlowLayout.LEFT));
myLabel = new JLabel("this is a label");
myButton = new JButton("press");
p1.add(myLabel);
p2.add(myButton);
p.add(p1);
p.add(p2);
setContentPane(p);
pack();
}
public static void main(String[] args) {
EventQueue.invokeLater(new Runnable() {
#Override
public void run() {
new MyLooks().setVisible(true);
}
});
}
private JLabel myLabel;
private JButton myButton;
private JPanel p, p1, p2;
}
I want to put some texts in text-Field when the form is load which instruct to user and when user click on that text-filed the texts remove automatically.
txtEmailId = new JTextField();
txtEmailId.setText("Email ID");
i have wrote above code but it display the text and keep as it is when user click on that text button i want to remove it.
is there any way to do this task?
I use to override the text fields paint method, until I ended up with more custom text fields then I really wanted...
Then I found this prompt API which is simple to use and doesn't require you to extend any components. It also has a nice "buddy" API
This has now been included in the SwingLabs, SwingX library which makes it even eaiser to use...
For example (this uses SwingX-1.6.4)
import java.awt.BorderLayout;
import java.awt.EventQueue;
import java.awt.Font;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import javax.swing.JFrame;
import javax.swing.JTextField;
import javax.swing.UIManager;
import javax.swing.UnsupportedLookAndFeelException;
import org.jdesktop.swingx.prompt.PromptSupport;
public class PromptExample {
public static void main(String[] args) {
new PromptExample();
}
public PromptExample() {
EventQueue.invokeLater(new Runnable() {
#Override
public void run() {
try {
UIManager.setLookAndFeel(UIManager.getSystemLookAndFeelClassName());
} catch (ClassNotFoundException | InstantiationException | IllegalAccessException | UnsupportedLookAndFeelException ex) {
}
JTextField bunnies = new JTextField(10);
JTextField ponnies = new JTextField(10);
JTextField unicorns = new JTextField(10);
JTextField fairies = new JTextField(10);
PromptSupport.setPrompt("Bunnies", bunnies);
PromptSupport.setPrompt("Ponnies", ponnies);
PromptSupport.setPrompt("Unicorns", unicorns);
PromptSupport.setPrompt("Fairies", fairies);
PromptSupport.setFocusBehavior(PromptSupport.FocusBehavior.HIDE_PROMPT, bunnies);
PromptSupport.setFocusBehavior(PromptSupport.FocusBehavior.HIGHLIGHT_PROMPT, ponnies);
PromptSupport.setFocusBehavior(PromptSupport.FocusBehavior.SHOW_PROMPT, unicorns);
PromptSupport.setFontStyle(Font.BOLD, bunnies);
PromptSupport.setFontStyle(Font.ITALIC, ponnies);
PromptSupport.setFontStyle(Font.ITALIC | Font.BOLD, unicorns);
JFrame frame = new JFrame("Testing");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setLayout(new GridBagLayout());
GridBagConstraints gbc = new GridBagConstraints();
gbc.gridwidth = GridBagConstraints.REMAINDER;
frame.add(bunnies, gbc);
frame.add(ponnies, gbc);
frame.add(unicorns, gbc);
frame.add(fairies, gbc);
frame.pack();
frame.setLocationRelativeTo(null);
frame.setVisible(true);
}
});
}
}
JTextField busqueda = new JTextField(20);
add(busqueda);
busqueda.setHorizontalAlignment(SwingConstants.CENTER);
if (busqueda.getText().length() == 0) {
busqueda.setText("Buscar");
busqueda.setForeground(new Color(150, 150, 150));
}
busqueda.addFocusListener(new FocusListener() {
#Override
public void focusGained(FocusEvent e) {
busqueda.setText("");
busqueda.setForeground(new Color(50, 50, 50));
}
#Override
public void focusLost(FocusEvent e) {
if (busqueda.getText().length() == 0) {
busqueda.setText("Buscar");
busqueda.setForeground(new Color(150, 150, 150));
}
}
});
You can download this NetBeans plugin which you can use to create a placeholder with just one line.