Solved

GUI design

Posted on 2009-05-07
12
293 Views
Last Modified: 2012-05-06
please tell me what i need to correct in order to have  my GUI identical to the mono color GUI. Thanks.

==============
import javax.swing.JButton;
import javax.swing.JCheckBox;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.JTextField;
import java.awt.BorderLayout;
import java.awt.GridLayout;

public class Align extends JFrame{
      
      private JCheckBox SnapToGrid;
      private JLabel LabelX;
      private JTextField ValueX;
      private JButton ButtonOK;
      
      private JCheckBox ShowGrid;
      private JLabel LabelY;
      private JTextField ValueY;
      private JButton ButtonCancel;
      private JButton ButtonHelp;
      
      private JPanel centerJPanel;
      private JPanel eastJPanel;
            
      public Align()
      {
            super("Align");
            
            SnapToGrid = new JCheckBox("Snap to Grid");

            LabelX = new JLabel("X:");
            ValueX = new JTextField("   ");
            
            ShowGrid = new JCheckBox("Show Grid  ");
            LabelY = new JLabel("Y:");
            ValueY = new JTextField("   ");
            
            centerJPanel = new JPanel();
            centerJPanel.setLayout(new GridLayout(2,3));
            centerJPanel.add(SnapToGrid);
            centerJPanel.add(LabelX);
            centerJPanel.add(ValueX);
            centerJPanel.add(ShowGrid);
            centerJPanel.add(LabelY);
            centerJPanel.add(ValueY);
            
            ButtonOK = new JButton("OK");
            ButtonCancel = new JButton("Cancel");
            ButtonHelp= new JButton("Help");
            
            eastJPanel = new JPanel();
            eastJPanel.setLayout(new GridLayout(3,1));
            eastJPanel.add(ButtonOK);
            eastJPanel.add(ButtonCancel);
            eastJPanel.add(ButtonHelp);
            
            this.setLayout(new BorderLayout());
            this.add(centerJPanel,BorderLayout.CENTER);
            this.add(eastJPanel,BorderLayout.EAST);      
      }
}

GUIdesign2a.jpg
GUIdesign2b.jpg
0
Comment
Question by:valleytech
  • 7
  • 3
  • 2
12 Comments
 
LVL 92

Expert Comment

by:objects
ID: 24333065
try a 2x2 GridLayout instead
and combine the control and label in each cell

0
 
LVL 13

Accepted Solution

by:
Bart Cremers earned 500 total points
ID: 24333509
A GridBagLayout gives you more control over the components.
import javax.swing.*;
import java.awt.*;
 
public class Align extends JFrame {
 
    private JCheckBox snapToGrid;
    private JLabel labelX;
    private JTextField valueX;
    private JButton buttonOK;
 
    private JCheckBox showGrid;
    private JLabel labelY;
    private JTextField valueY;
    private JButton buttonCancel;
    private JButton buttonHelp;
 
    private JPanel centerJPanel;
    private JPanel eastJPanel;
 
    public Align() {
        super("Align");
        JPanel contentPane = new JPanel(new BorderLayout());
        contentPane.setBorder(BorderFactory.createEmptyBorder(5, 5, 10, 10));
        this.setContentPane(contentPane);
 
        snapToGrid = new JCheckBox("Snap to Grid");
 
        labelX = new JLabel("X:");
        valueX = new JTextField(4);
 
        showGrid = new JCheckBox("Show Grid  ");
        labelY = new JLabel("Y:");
        valueY = new JTextField(4);
 
        centerJPanel = new JPanel(new GridBagLayout());
 
        GridBagConstraints gbc = new GridBagConstraints();
 
        Insets leftInsets = new Insets(5, 5, 5, 5);
        Insets middleInsets = new Insets(5, 10, 5, 5);
        Insets rightInsets = new Insets(5, 0, 5, 5);
 
        gbc.gridx = 0;
        gbc.gridy = 0;
        gbc.insets = leftInsets;
        gbc.anchor = GridBagConstraints.WEST;
        centerJPanel.add(snapToGrid, gbc);
 
        gbc.gridx = 1;
        gbc.gridy = 0;
        gbc.insets = middleInsets;
        gbc.anchor = GridBagConstraints.EAST;
        centerJPanel.add(labelX, gbc);
 
        gbc.gridx = 2;
        gbc.gridy = 0;
        gbc.insets = rightInsets;
        gbc.anchor = GridBagConstraints.WEST;
        centerJPanel.add(valueX, gbc);
 
        gbc.gridx = 0;
        gbc.gridy = 1;
        gbc.insets = leftInsets;
        gbc.anchor = GridBagConstraints.WEST;
        centerJPanel.add(showGrid, gbc);
 
        gbc.gridx = 1;
        gbc.gridy = 1;
        gbc.insets = middleInsets;
        gbc.anchor = GridBagConstraints.EAST;
        centerJPanel.add(labelY, gbc);
 
        gbc.gridx = 2;
        gbc.gridy = 1;
        gbc.insets = rightInsets;
        gbc.anchor = GridBagConstraints.WEST;
        centerJPanel.add(valueY, gbc);
 
        buttonOK = new JButton("OK");
        buttonCancel = new JButton("Cancel");
        buttonHelp = new JButton("Help");
 
        eastJPanel = new JPanel(new GridLayout(3, 1, 5, 5));
        eastJPanel.add(buttonOK);
        eastJPanel.add(buttonCancel);
        eastJPanel.add(buttonHelp);
 
        this.add(centerJPanel, BorderLayout.CENTER);
        this.add(eastJPanel, BorderLayout.EAST);
 
    }
 
    public static void main(String[] args) {
        JFrame f = new Align();
        f.pack();
        f.setLocationRelativeTo(null);
        f.setDefaultCloseOperation(EXIT_ON_CLOSE);
        f.setVisible(true);
    }
}

Open in new window

0
 

Author Comment

by:valleytech
ID: 24337706
let me study it. Thanks a lot.
0
Courses: Start Training Online With Pros, Today

Brush up on the basics or master the advanced techniques required to earn essential industry certifications, with Courses. Enroll in a course and start learning today. Training topics range from Android App Dev to the Xen Virtualization Platform.

 

Author Comment

by:valleytech
ID: 24337808
can GridBagLayout  solve all GUI design problem? I want to learn one, even hard & tedious, to solve for GUI design :)
0
 
LVL 13

Expert Comment

by:Bart Cremers
ID: 24337880
GridBagLayout can do a lot, but it's more work to set it up and it won't solve all gui problems. Best is to learn the main Layout Managers: FlowLayout, GridLayout, BorderLayout and GridBagLayout (imo). If you can use combinations of those and can divide your gui in area's using these managers you can solve most GUI problems. Further study would include the more specialized layout managers: BoxLayout, CardLayout, SpringLayout and GroupLayout.

As you can see in the example, I used a combination of Border-, Grid- and GridBagLayout. It still leaves room for improvement, but I think you can see how to divide the GUI in groups.
0
 

Author Comment

by:valleytech
ID: 24338015
i am learning it now. thank you a lot. I don't know how to combine all styles together. my purpose is to learn how to code GUI manually. Once i know it, i can use netbeans to generate GUI code and copy to Eclipse and modify.
 So main point is i must learn this stuff well :)
0
 
LVL 13

Expert Comment

by:Bart Cremers
ID: 24338031
0
 

Author Comment

by:valleytech
ID: 24339814
i bought Java how to program 7th edition by Deitel :)
0
 

Author Comment

by:valleytech
ID: 24340031
 Insets leftInsets = new Insets(5, 5, 5, 5);
  Insets middleInsets = new Insets(5, 10, 5, 5);
  Insets rightInsets = new Insets(5, 0, 5, 5);
 
  Insets(fromTop, fromLeft, fromBottom, fromRight) respect to centerJPanel border??
  please explain to me. thanks.
0
 

Author Comment

by:valleytech
ID: 24340351
how can this code still give same output??? even i have modified inset, EAST?
please help me to clarify this concept. thanks a lot.
==================
import javax.swing.*;
import java.awt.*;
 
public class Align extends JFrame {
 
    private JCheckBox snapToGrid;
    private JLabel labelX;
    private JTextField valueX;
    private JButton buttonOK;
 
    private JCheckBox showGrid;
    private JLabel labelY;
    private JTextField valueY;
    private JButton buttonCancel;
    private JButton buttonHelp;
 
    private JPanel centerJPanel;
    private JPanel eastJPanel;
 
    public Align() {
        super("Align");
        JPanel contentPane = new JPanel(new BorderLayout());
       
        contentPane.setBorder(BorderFactory.createEmptyBorder(5, 5, 10, 10));
        this.setContentPane(contentPane);
 
        snapToGrid = new JCheckBox("Snap to Grid");
 
        labelX = new JLabel("X:");
        valueX = new JTextField(4);
 
        showGrid = new JCheckBox("Show Grid  ");
        labelY = new JLabel("Y:");
        valueY = new JTextField(4);
 
        centerJPanel = new JPanel(new GridBagLayout());
 
        GridBagConstraints gbc = new GridBagConstraints();
 
        Insets leftInsets = new Insets(5, 5, 5, 15);
        Insets middleInsets = new Insets(5, 10, 10, 5);
        Insets rightInsets = new Insets(5,15, 5, 5);
 
        gbc.gridx = 0;
        gbc.gridy = 0;
        gbc.insets = leftInsets;
        gbc.anchor = GridBagConstraints.WEST;
        centerJPanel.add(snapToGrid, gbc);
 
        gbc.gridx = 1;
        gbc.gridy = 0;
        gbc.insets = middleInsets;
        gbc.anchor = GridBagConstraints.CENTER;
        centerJPanel.add(labelX, gbc);
 
        gbc.gridx = 2;
        gbc.gridy = 0;
        gbc.insets = rightInsets;
        gbc.anchor = GridBagConstraints.EAST;
        centerJPanel.add(valueX, gbc);
 
        gbc.gridx = 0;
        gbc.gridy = 1;
        gbc.insets = leftInsets;
        gbc.anchor = GridBagConstraints.WEST;
        centerJPanel.add(showGrid, gbc);
 
        gbc.gridx = 1;
        gbc.gridy = 1;
        gbc.insets = middleInsets;
        gbc.anchor = GridBagConstraints.CENTER;
        centerJPanel.add(labelY, gbc);
 
        gbc.gridx = 2;
        gbc.gridy = 1;
        gbc.insets = rightInsets;
        gbc.anchor = GridBagConstraints.EAST;
        centerJPanel.add(valueY, gbc);
 
        buttonOK = new JButton("OK");
        buttonCancel = new JButton("Cancel");
        buttonHelp = new JButton("Help");
 
        eastJPanel = new JPanel(new GridLayout(3, 1, 5, 5));
        eastJPanel.add(buttonOK);
        eastJPanel.add(buttonCancel);
        eastJPanel.add(buttonHelp);
 
        this.add(centerJPanel, BorderLayout.CENTER);
        this.add(eastJPanel, BorderLayout.EAST);
 
    }
}
0
 
LVL 92

Expert Comment

by:objects
ID: 24341965
> can GridBagLayout  solve all GUI design problem?

no, none can :)  the trick is to use combinations of layouts to meet your needs

0
 

Author Comment

by:valleytech
ID: 24342140
i do'nt know why I can't see different when i changed some number in insets and EAST, WEST !!!!!
0

Featured Post

Gigs: Get Your Project Delivered by an Expert

Select from freelancers specializing in everything from database administration to programming, who have proven themselves as experts in their field. Hire the best, collaborate easily, pay securely and get projects done right.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

For customizing the look of your lightweight component and making it look lucid like it was made of glass. Or: how to make your component more Apple-ish ;) This tip assumes your component to be of rectangular shape and completely opaque. (COD…
This was posted to the Netbeans forum a Feb, 2010 and I also sent it to Verisign. Who didn't help much in my struggles to get my application signed. ------------------------- Start The idea here is to target your cell phones with the correct…
Viewers learn about the “while” loop and how to utilize it correctly in Java. Additionally, viewers begin exploring how to include conditional statements within a while loop and avoid an endless loop. Define While Loop: Basic Example: Explanatio…
Viewers will learn about the regular for loop in Java and how to use it. Definition: Break the for loop down into 3 parts: Syntax when using for loops: Example using a for loop:

808 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question