Graphical editor

Question

Hi,
I'm trying to make a graphical DTD editor. Right now I have a little problem with moveable objects and arrows. Perhaps someone can help me with this?
I'll try to describe my problem as good as I can. First, there should be some objects like squares or circles (moveable one). Second, every object have a different meaning (like square is some kind a node or value). So we have couple of squares and circles, we're connecting them with our arrows and we suppose to have a nice DTD document. Yes, I know ... Right now I need some information how to put one object on it place (when we click on the square it stops to move and we can play with another one). Please forgive me my English but I'm not an native speaker.
Cheers.
----some of my code---
import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
import javax.swing.border.BevelBorder;
import javax.swing.event.MouseInputAdapter;
import javax.swing.text.Highlighter;
import java.io.*;
public class DTDEdit extends JFrame
     OptionsTB     _op;
     FunctionsTB     _fu;     
     JTabbedPane _ta;
     * This is main constructor.
     * In here we're cooking all fancy stuff.
     * @param _ch is a JFileChooser. Thank to this he can open
     * a file.
     public DTDEdit() {
          _ta = new JTabbedPane();
          _op = new OptionsTB();
          _fu = new FunctionsTB();
          ImageIcon ic = new ImageIcon("images/icons/Earth-16x16.png");
          JPanel panel = new JPanel();
          //JPanel panel2 = new JPanel();          
          //TODO To nadal jest puste.
          SecondPanel panel2 = new SecondPanel();
          panel2.setVisible(true);
          panel.setBorder(new BevelBorder(BevelBorder.LOWERED));
OverlayLayout overlay = new OverlayLayout(panel);
panel.setLayout(overlay);
panel.add(new TopPanel("123"));
panel.add(new Overlay());
_ta.addTab("graphical",ic, panel);
_ta.addTab("source",ic, panel2);   
add(_ta, "Center");
          setJMenuBar(new Menu());
          getContentPane().add(_op, BorderLayout.NORTH);
          getContentPane().add(_fu, BorderLayout.WEST);
          pack();
     public int scWidth() //get width of screen number 1
          GraphicsEnvironment ge = GraphicsEnvironment.getLocalGraphicsEnvironment();
     GraphicsDevice[] gs = ge.getScreenDevices();
     DisplayMode dm = gs[0].getDisplayMode();
     return dm.getWidth();
     public int scHeight() //get height of screen number 1
          GraphicsEnvironment ge = GraphicsEnvironment.getLocalGraphicsEnvironment();
     GraphicsDevice[] gs = ge.getScreenDevices();
     DisplayMode dm = gs[0].getDisplayMode();
     return dm.getHeight();
     public static void main(String[] args) {
DTDEdit f = new DTDEdit();
f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
f.setSize(800,600);
f.setLocation(200, 200);
f.setVisible(true);
* This determines an movable editor
* @author Marcin
class Overlay extends JPanel
public Overlay()
setBackground(Color.LIGHT_GRAY);
* This is top panel.
* We're painting on it.
* @author Marcin
class TopPanel extends JPanel
Point loc;
int width, height, arcRadius;
Rectangle r;
String s;
public TopPanel(String s)
     this.s = s;
setOpaque(false);
width = 80;
height = 40;
arcRadius = 0;
r = new Rectangle(width, height);
TopRanger ranger = new TopRanger(this);
addMouseListener(ranger);
addMouseMotionListener(ranger);
protected void paintComponent(Graphics g)
super.paintComponent(g);
Graphics2D g2 = (Graphics2D)g;
g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING,
RenderingHints.VALUE_ANTIALIAS_ON);
if(loc == null)
init();
g2.setPaint(Color.DARK_GRAY);
g2.fillRoundRect(loc.x, loc.y, width, height, arcRadius, arcRadius);
g2.setPaint(Color.yellow);
g2.drawString(s, loc.x + 25, loc.y + 25);
//g2.drawRoundRect(loc.x, loc.y, width, height, arcRadius, arcRadius);
private void init()
int w = getWidth();
int h = getHeight();
loc = new Point();
loc.x = (w - width)/2;
loc.y = (h - height)/2;
r.x = loc.x;
r.y = loc.y;
public int getRectWidth()
     return width;
* In here we're enabling an mouse adapters.
* Thank's to this we can move what we had made :)
* @author Marcin
class TopRanger extends MouseInputAdapter
TopPanel top;
Point offset;
boolean dragging;
public TopRanger(TopPanel top)
this.top = top;
offset = new Point();
dragging = false;
public void mousePressed(MouseEvent e)
Point p = e.getPoint();
if(top.r.contains(p))
offset.x = p.x - top.r.x;
offset.y = p.y - top.r.y;
dragging = true;
public void mouseReleased(MouseEvent e)
dragging = false;
// update top.r
top.r.x = top.loc.x;
top.r.y = top.loc.y;
public void mouseDragged(MouseEvent e)
if(dragging)
top.loc.x = e.getX() - offset.x;
top.loc.y = e.getY() - offset.y;
top.r.setSize(65, 25);
top.repaint();
* Menus and other things.
* I've made this for two reasons
* 1) Every application has things like this.
* 2) It's a pretty cool when you don't have to
*      search for something in embedded option of
*      application.
* @author Marcin
//     Our little menu
class Menu extends JMenuBar                         //Still not finished
     JMenu File = new JMenu("File");
     JMenu Edit = new JMenu("Edit");
     JMenuItem firstItem = new JMenuItem("first");
     JMenuItem secondItem = new JMenuItem("second");
     Menu(){
          File.add(firstItem);
          add(File);
          Edit.add(secondItem);
          add(Edit);
class OptionsTB extends JToolBar implements ActionListener                    //Still not finished
     ImageIcon sa = new ImageIcon("images/icons/Save24.gif");
     ImageIcon op = new ImageIcon("images/icons/Open24.gif");
     JButton _open;
     JButton _save;
     Separator sep1;
     JFileChooser _ch;
     OptionsTB()
          _open  = new JButton("Open", op);
          sep1 = new Separator();
          _save  = new JButton("save", sa);
          _open.addActionListener(this);
          _save.addActionListener(this);
          _ch = new JFileChooser();
          add(_open);
          add(_save);
          add(sep1);
          setFloatable(false);
          setSize(100, 50);
// TODO Open and save handler
     public void actionPerformed(ActionEvent e)
          if( e.getSource() == _open){
               int returnVal = _ch.showOpenDialog(OptionsTB.this);
if (returnVal == JFileChooser.APPROVE_OPTION) {
File file = _ch.getSelectedFile();
     //TODO We should have a file handler in here.
} else
if (e.getSource() == _save) {
     int returnVal = _ch.showSaveDialog(OptionsTB.this);
if (returnVal == JFileChooser.APPROVE_OPTION);
     File file = _ch.getSelectedFile();
          //TODO We should have a save handler in here.
class FunctionsTB extends JToolBar                    //Still not finished
     JButton _check;      
     ImageIcon star = new ImageIcon("images/icon/Star.png");
     FunctionsTB()
          _check = new JButton("Check", star);
          add(_check);
          setFloatable(false);
          setOrientation(VERTICAL);
          setSize(100, 50);
class SecondPanel extends JPanel
     JEditorPane pane;
     JScrollPane scroll;
     public SecondPanel() {
          pane = new JTextPane();
          //pane.setBackground(Color.BLACK);
          pane.setText("Pierwsza linia");
          pane.setBackground(Color.BLACK);
          pane.setForeground(Color.WHITE);
          pane.setEditable(false);
          scroll = new JScrollPane(pane);
          scroll.setVerticalScrollBarPolicy(
JScrollPane.VERTICAL_SCROLLBAR_ALWAYS);
          scroll.setPreferredSize(new Dimension(600, 600));
          scroll.setMinimumSize(new Dimension(800, 600));
          add(scroll);
          JScrollPane scroll = new JScrollPane();
--- THE END OF MY STUFF ---

Answer 1

Hi nordvik_
I developed a component that does exactly what you are talking about. Would you be interested in buying a copy?
This is not a simple project, but if you're determined to build it yourself, here's a few hints
1. How are you going to represent your nodes? Will they be components? The advantage of this is that with Components its easy to set size, implement painting. The disadvantage is that it's difficult to draw lines between components, and they will likely absorb mouse events that are outside of the shape's area (unless all your shapes are rectangles)
2. How are you going to move + resize the components? If you search google for draggable.java/resizeable.java tjacobs01 you'll find some classes that I've previously posted that drag / resize components. This may or may not be helpful
3. How are you going to internally represent the connection lines? how are you going to draw them? How are you going to figure out start and end points?
If you're potentially interested in buying a copy of my source code, plz post your email address and I will contact you
Edited by: tjacobs01 on Aug 10, 2008 2:17 PM