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

x
?
Solved

Layout Question

Posted on 2004-03-27
3
Medium Priority
?
229 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
[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
  • 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 2000 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

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!

Question has a verified solution.

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

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…
Go is an acronym of golang, is a programming language developed Google in 2007. Go is a new language that is mostly in the C family, with significant input from Pascal/Modula/Oberon family. Hence Go arisen as low-level language with fast compilation…
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:
This tutorial covers a practical example of lazy loading technique and early loading technique in a Singleton Design Pattern.
Suggested Courses

715 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