nuoda

视图设计

表格视图设计

在编辑器中调色板中，选择表格，拖入编辑器，系统默认显示一个方框的思路，来规划表格的显示图形。由于表格中有很多子元素，所以设置显示图形时，必须考虑子元素的显示位置和子元素的布局管理。

public class TableFigure extends Figure{

      private TableNode model;

      private Figure childPanel;

      public TableFigure(TableNode node){

             super();

             this.model=node;

             init();

      }

      public void init(){

             childPanel=new Figure(){

            protected void paintFigure(Graphics g){

                   super.paintFigure(g);

            }

            public Dimension getPreferredSize(int wHint,int hHint){

                   Dimension dimension = super.getPreferredSize(wHint, hHint);

                int w = Math.max(dimension.width, 200);

                int h = Math.max(dimension.height, 200);

                return new Dimension(w, h);

            }

        };

        if(model.getBgColor() != null){

            childPanel.setBackgroundColor(model.getBgColor());

        }

        ToolbarLayout stepLayout = new ToolbarLayout();

        stepLayout.setVertical(true);

        this.setBorder(new MarginBorder(1, 1, 1, 1));

        this.setLayoutManager(stepLayout);

        //设置表格

        GridLayout grid=model.getGrid();

        if(grid==null){

            grid=new GridLayout();

        }

        childPanel.setLayoutManager(grid);

        this.add(childPanel);

        this.setOpaque(true);

      }

       public void paintFigure(Graphics graphics) {

              super.paintFigure(graphics);

              if(model.isBorder()){

                    Rectangle rect=getBounds();

                    graphics.setForegroundColor(new Color(null, 0, 0, 255));

                      graphics.drawRectangle(new Rectangle(rect.x,rect.y,rect.width-1,rect.height-1));

              }

      }

      public Figure getContainerFigure() {

        return this.childPanel;

    }

      public void setModel(TableNode node){

             this.model=node;

             this.repaint();

      }

}

单元格视图

单元格视图相对比较简单，就显示一个方框。

public class CellFigure extends Figure{

      private CellNode model;

      private Figure childPanel;

      public CellFigure(CellNode node){

             super();

             this.model=node;

             init();

      }

      public void init(){

             childPanel=new Figure(){

            protected void paintFigure(Graphics g){

                   super.paintFigure(g);

            }

        };

        if(model.getBgColor() != null){

            childPanel.setBackgroundColor(model.getBgColor());

        }

        ToolbarLayout stepLayout = new ToolbarLayout();

        //stepLayout.setSpacing(4);

        stepLayout.setVertical(true);

        //this.setBorder(new MarginBorder(8, 8, 8, 8));

        this.setBorder(new MarginBorder(1, 1, 1, 1));

        this.setLayoutManager(stepLayout);

        //设置表格

        GridLayout grid=new GridLayout();

        childPanel.setLayoutManager(grid);

        this.add(childPanel);

        this.setOpaque(true);

      }

      public void setModel(CellNode node){

             this.model=node;

             this.repaint();

      }

}

其它视图

画布采用XYLayout布局，直接在控制器中设置就可以了。

行、列做为逻辑层，不需要设计视图。

至此，视图已经设计完成了。