Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

GUI design

Posted on 2009-05-07
12
Medium Priority
?
314 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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 2000 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
The top UI technologies you need to be aware of

An important part of the job as a front-end developer is to stay up to date and in contact with new tools, trends and workflows. That’s why you cannot miss this upcoming webinar to explore the latest trends in UI technologies!

 

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

Build and deliver software with DevOps

A digital transformation requires faster time to market, shorter software development lifecycles, and the ability to adapt rapidly to changing customer demands. DevOps provides the solution.

Question has a verified solution.

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

For beginner Java programmers or at least those new to the Eclipse IDE, the following tutorial will show some (four) ways in which you can import your Java projects to your Eclipse workbench. Introduction While learning Java can be done with…
Introduction This article is the last of three articles that explain why and how the Experts Exchange QA Team does test automation for our web site. This article covers our test design approach and then goes through a simple test case example, how …
This tutorial covers a practical example of lazy loading technique and early loading technique in a Singleton Design Pattern.
This tutorial will introduce the viewer to VisualVM for the Java platform application. This video explains an example program and covers the Overview, Monitor, and Heap Dump tabs.
Suggested Courses

670 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