Solved

Layout Question

Posted on 2004-03-27
3
219 Views
Last Modified: 2010-03-31
Hi everyone how would this be done.

I think using colours would help with separating each group of checkboxes but this approach still doesn't satisfy another criteria of good GUI, that is "Focus". Think about the time a user needs to search for a particular group, a new user will need to scan through 10 groups to find out which group he needs and an experienced user has to rely on his memory to locate a group. So whether your users are experienced or not, you're making too much work for them.

I would suggest another approach, assuming each of your checkbox groups contains a specific character then this character would be the _name_ of this group (remember this name has a meaning therefore a user can identify to it). With this approach, you only need to transfer focus twice. Initially, the focus would be on a list of names, perhaps awt.List, a user then chooses a name that is appropiate to his required action then the chosen group will appear dominantly in the center of your program. Because this effect causes a user, subconsciously, to look at it, imagine a pop-up window, hence second focus transition.

It's difficult to draw the layout here, but if you can imagine a rectangle that contains a square and another rectangle inside it.

---------------------------------------
|                              |                |
|                              |                |
|                              |                |
|          square          |   rec         |
|                              |                |
|                              |                |
|                              |                |
----------------------------------------

rec contains a List of names and square contains all the groups.

A detail look at square:

Initially
--------------------------
|  g1         g2      g3   |
|         ----------         |
| g10  |          |  g4   |
|        |          |         |
|   g9  ----------  g5    |
|                              |
|   g8        g7     g6    |
--------------------------

then a user chooses group 10 so:

--------------------------
|  g1         g2      g3   |
|         ----------         |
|        |  g10   |  g4   |
|        |          |         |
|   g9  ----------  g5    |
|                              |
|   g8        g7     g6    |
--------------------------

Note here all the surrounding groups have the same colour, g10 has a different colour. Hence created a pop-out effect.

Now, how would we program this Java? There are many different ways to achieve this, it depends on your imagination.
0
Comment
Question by:Drop_of_Rain
  • 3
3 Comments
 
LVL 15

Expert Comment

by:Javatm
ID: 10696927
You need to learn it on your own though I'm gonna try my best, wait . . .
0
 
LVL 15

Accepted Solution

by:
Javatm earned 500 total points
ID: 10697407
Hi Friend;

You need to implement it yourself but
I have made a simple example to get you started :

import java.awt.*;
import java.awt.event.*;
import javax.swing.*;

public class MyFrame3 extends JFrame
{
    public MyFrame3()
    {
        super("Sample . . .");

        Font f1 = new Font("Courier New", Font.BOLD, 15);

        JPanel p1 = new JPanel();
        JPanel p2 = new JPanel();
        JPanel p3 = new JPanel();
        JPanel p4 = new JPanel();
        JPanel p5 = new JPanel();
        JPanel p6 = new JPanel();

        final JButton b1 = new JButton("G1");
        final JButton b2 = new JButton("G2");
        final JButton b3 = new JButton("G3");
        final JButton b4 = new JButton("G4");
        final JButton b5 = new JButton("G5");
        final JButton b6 = new JButton("G6");
        final JButton b7 = new JButton("G7");
        final JButton b8 = new JButton("G8");

        final JButton b9 = new JButton("Restart");
        final JButton b0 = new JButton("   Exit    ");

       b9.setMnemonic('R'); b0.setMnemonic('E');

        final JLabel l1 = new JLabel();
        l1.setBorder(BorderFactory.createLineBorder(Color.gray));

        p1.setBorder(BorderFactory.createLoweredBevelBorder());
        p4.setBorder(BorderFactory.createLoweredBevelBorder());
        p4.setBackground(Color.white);

        p1.setLayout(new GridLayout(1,2));
        p1.add(p2); p1.add(p3);

        p2.setLayout(new GridLayout(1,1));
        p2.add(p4);

        p4.setLayout(new GridLayout(3,3));
        p4.add(b1); p4.add(b2); p4.add(b3);
        p4.add(b4); p4.add(l1); p4.add(b5);
        p4.add(b6); p4.add(b7); p4.add(b8);

        p5.setLayout(new GridLayout(5,1));
        p5.add(new JLabel("Name 1\n"));
        p5.add(new JLabel("Name 2"));
        p5.add(new JLabel("Name 3"));
        p5.add(new JLabel("Name 4"));
        p5.add(new JLabel("Name 5"));
 
        p3.setLayout(new GridLayout(1,3));
        p3.add(new JPanel()); p3.add(p5);
        p3.add(new JPanel());

        p6.add(b9); p6.add(b0);

        this.getRootPane().setDefaultButton(b9);
        this.getContentPane().add(p1, BorderLayout.CENTER);
        this.getContentPane().add(p6, BorderLayout.SOUTH);

        this.setResizable(false);
        this.setSize(400, 300);
        this.setVisible(true);

        // Add your action listener here . . .
        b1.addActionListener(new ActionListener() {
        public void actionPerformed(ActionEvent h)
        {
        l1.setText("       G1       ");
        b1.setText("");
        b1.setEnabled(false);
        }
        });

        b2.addActionListener(new ActionListener() {
        public void actionPerformed(ActionEvent h)
        {
        l1.setText("       G2       ");
        b2.setText("");
        b2.setEnabled(false);
        }
        });

        b3.addActionListener(new ActionListener() {
        public void actionPerformed(ActionEvent h)
        {
        l1.setText("       G3       ");
        b3.setText("");
        b3.setEnabled(false);
        }
        });

        b4.addActionListener(new ActionListener() {
        public void actionPerformed(ActionEvent h)
        {
        l1.setText("       G4       ");
        b4.setText("");
        b4.setEnabled(false);
        }
        });

        b5.addActionListener(new ActionListener() {
        public void actionPerformed(ActionEvent h)
        {
        l1.setText("       G5       ");
        b5.setText("");
        b5.setEnabled(false);
        }
        });

        b6.addActionListener(new ActionListener() {
        public void actionPerformed(ActionEvent h)
        {
        l1.setText("       G6       ");
        b6.setText("");
        b6.setEnabled(false);
        }
        });

        b7.addActionListener(new ActionListener() {
        public void actionPerformed(ActionEvent h)
        {
        l1.setText("       G7       ");
        b7.setText("");
        b7.setEnabled(false);
        }
        });

        b8.addActionListener(new ActionListener() {
        public void actionPerformed(ActionEvent h)
        {
        l1.setText("       G8       ");
        b8.setText("");
        b8.setEnabled(false);
        }
        });

        b9.addActionListener(new ActionListener() {
        public void actionPerformed(ActionEvent h)
        {
        l1.setText("");

        b1.setText("G1");
        b2.setText("G2");
        b3.setText("G3");
        b4.setText("G4");
        b5.setText("G5");
        b6.setText("G6");
        b7.setText("G7");
        b8.setText("G8");

        b1.setEnabled(true);
        b2.setEnabled(true);
        b3.setEnabled(true);
        b4.setEnabled(true);
        b5.setEnabled(true);
        b6.setEnabled(true);
        b7.setEnabled(true);
        b8.setEnabled(true);
        }
        });

        b0.addActionListener(new ActionListener() {
        public void actionPerformed(ActionEvent h)
        {
        System.exit(0);
        }
        });
    }

    public static void main(String[] args)
    {
      MyFrame3 x = new MyFrame3();
      x.setDefaultCloseOperation(EXIT_ON_CLOSE);
    }
}

Hope that helps . . .
Javatm
0
 
LVL 15

Expert Comment

by:Javatm
ID: 10697425
http://www.freewebs.com/cube-j

Always glad to help . . .
Friend : Javatm
0

Featured Post

3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
javap bin 2 34
Maven Project: Hibernate Dependencies Conflict 10 23
Configure a Bean in an XML file 4 32
by zero exception 10 41
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…
Introduction This article is the first of three articles that explain why and how the Experts Exchange QA Team does test automation for our web site. This article explains our test automation goals. Then rationale is given for the tools we use to a…
Viewers will learn about arithmetic and Boolean expressions in Java and the logical operators used to create Boolean expressions. We will cover the symbols used for arithmetic expressions and define each logical operator and how to use them in Boole…
This theoretical tutorial explains exceptions, reasons for exceptions, different categories of exception and exception hierarchy.

810 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