如何使用列标签和行标签创建这种类似网格的布局?

时间:2016-04-03 20:57:56

标签: java swing user-interface layout-manager

from django.db.models import IntegerField, Sum
Client.objects.aggregate(
    num_object_raw=Sum(
        Case(
            When(object_raw='foo', then=1),
            output_field=IntegerField()
        )
    )
)

如何将行和列作为图片进行此布局? 对于cols我如何做白色空间并将两者结合在一起并制作网格?没有其他问题告诉我如何进行这种布局?

[![在此处输入图像说明] [1]] [1]

3 个答案:

答案 0 :(得分:2)

拍摄,我做了一些我会尝试挖掘的东西......

很久以前制作并使用两个jpg图像来创建如下的GUI:

enter image description here

import java.io.IOException;
import javax.swing.JFrame;
import javax.swing.SwingUtilities;

public class BattleShipMainProg {
   private static void createAndShowGui() {
      BattleShipMainPanel mainPanel;
      try {
         mainPanel = new BattleShipMainPanel();
         JFrame frame = new JFrame("Battleship");
         frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
         frame.getContentPane().add(mainPanel);
         frame.pack();
         frame.setLocationByPlatform(true);
         frame.setVisible(true);
      } catch (IOException e) {
         e.printStackTrace();
      }

   }

   public static void main(String[] args) {
      SwingUtilities.invokeLater(new Runnable() {
         public void run() {
            createAndShowGui();
         }
      });
   }

}

import java.awt.BorderLayout;
import java.awt.Font;
import java.awt.image.BufferedImage;
import java.beans.PropertyChangeEvent;
import java.beans.PropertyChangeListener;
import java.io.IOException;

import javax.imageio.ImageIO;
import javax.swing.*;

@SuppressWarnings("serial")
public class BattleShipMainPanel extends JPanel {
   private static final int TA_ROWS = 10;
   private static final int TA_COLS = 30;
   private static final int CELL_SIDE_LENGTH = 36;
   private static final String WEST_IMG_PATH = "battleship/images/Wallpaper-Picture-Under-Water Crp.jpg";
   private static final String EAST_IMG_PATH = "battleship/images/Maldives_Sml.jpg";
   private BattleShipGridPanel playerGrid;
   private BattleShipGridPanel opponentGrid;
   private ShipImageMaker imageMaker = new ShipImageMaker(CELL_SIDE_LENGTH);
   private JTextArea textarea = new JTextArea(TA_ROWS, TA_COLS);

   public BattleShipMainPanel() throws IOException {
      ClassLoader classLoader = getClass().getClassLoader();
      System.out.println(classLoader.getResource("").getFile());
      String westImgString = WEST_IMG_PATH;
      String eastImgString = EAST_IMG_PATH;
      BufferedImage westImg = ImageIO.read(getClass().getClassLoader()
            .getResource(westImgString));
      BufferedImage eastImg = ImageIO.read(getClass().getClassLoader()
            .getResource(eastImgString));

      playerGrid = new BattleShipGridPanel(westImg, CELL_SIDE_LENGTH);
      opponentGrid = new BattleShipGridPanel(eastImg, CELL_SIDE_LENGTH);

      // !! to delete
      playerGrid.getLabel("A 1").setIcon(imageMaker.getSternLeftIcon()[0]);
      playerGrid.getLabel("A 2").setIcon(imageMaker.getMidshipHorizIcon()[0]);
      playerGrid.getLabel("A 3").setIcon(imageMaker.getMidshipHorizIcon()[0]);
      playerGrid.getLabel("A 4").setIcon(imageMaker.getMidshipHorizIcon()[0]);
      playerGrid.getLabel("A 5").setIcon(imageMaker.getBowRightIcon()[0]);

      playerGrid.getLabel("C 2").setIcon(imageMaker.getBowUpIcon()[1]);
      playerGrid.getLabel("D 2").setIcon(imageMaker.getMidshipVertIcon()[1]);
      playerGrid.getLabel("E 2").setIcon(imageMaker.getSternDownIcon()[1]);
      // !! to delete

      playerGrid.addPropertyChangeListener(new PropertyChangeListener() {

         @Override
         public void propertyChange(PropertyChangeEvent pChngEvt) {
            if (pChngEvt.getPropertyName().equals(
                  BattleShipGridPanel.MOUSE_PRESSED)) {
               textarea.append("Player: " + pChngEvt.getNewValue() + "\n");

               System.out.printf("[%c, %d]%n", playerGrid.getSelectedRow(), playerGrid.getSelectedCol());
               playerGrid.resetSelections();
            }
         }
      });

      opponentGrid.addPropertyChangeListener(new PropertyChangeListener() {

         @Override
         public void propertyChange(PropertyChangeEvent pChngEvt) {
            if (pChngEvt.getPropertyName().equals(
                  BattleShipGridPanel.MOUSE_PRESSED)) {
               textarea.append("Opponent: " + pChngEvt.getNewValue() + "\n");
               opponentGrid.resetSelections();
            }
         }
      });

      textarea.setFont(new Font(Font.MONOSPACED, Font.PLAIN, 12));
      textarea.setEditable(false);
      textarea.setFocusable(false);

      JPanel centerPanel = new JPanel();
      centerPanel.setLayout(new BoxLayout(centerPanel, BoxLayout.PAGE_AXIS));
      JPanel centerTopPanel = new JPanel(new BorderLayout());
      centerTopPanel.add(new JLabel("GridCell Pressed", SwingConstants.LEFT),
            BorderLayout.NORTH);
      centerTopPanel.add(new JScrollPane(textarea,
            JScrollPane.VERTICAL_SCROLLBAR_ALWAYS,
            JScrollPane.HORIZONTAL_SCROLLBAR_NEVER));
      centerPanel.add(centerTopPanel);
      centerPanel.add(Box.createVerticalGlue());

      JPanel playerPanel = new JPanel(new BorderLayout());
      playerPanel.add(new JLabel("Player", JLabel.LEFT),
            BorderLayout.PAGE_START);
      playerPanel.add(playerGrid.getMainPanel(), BorderLayout.CENTER);

      JPanel opponentPanel = new JPanel(new BorderLayout());
      opponentPanel.add(new JLabel("Opponent", JLabel.LEFT),
            BorderLayout.PAGE_START);
      opponentPanel.add(opponentGrid.getMainPanel(), BorderLayout.CENTER);

      int eb = 10;
      setBorder(BorderFactory.createEmptyBorder(eb, eb, eb, eb));
      setLayout(new BorderLayout(eb, eb));
      add(playerPanel, BorderLayout.WEST);
      add(opponentPanel, BorderLayout.EAST);
      add(centerPanel, BorderLayout.CENTER);

   }
}

import java.awt.Color;
import java.awt.Component;
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.GridLayout;
import java.awt.Image;
import java.awt.event.MouseAdapter;
import java.awt.event.MouseEvent;
import java.awt.image.BufferedImage;
import java.beans.PropertyChangeEvent;
import java.beans.PropertyChangeListener;
import java.io.IOException;
import java.net.URL;
import java.util.HashMap;
import java.util.Map;

import javax.imageio.ImageIO;
import javax.swing.*;
import javax.swing.event.SwingPropertyChangeSupport;

@SuppressWarnings("serial")
public class BattleShipGridPanel {
   public static final String MOUSE_PRESSED = "Mouse Pressed";
   // public static final String MOUSE_DRAGGED = "Mouse Dragged";
   private static final int ROW_COUNT = 11;
   private static final int COL_COUNT = 11;

   // the main JPanel for this part of my program
   private JPanel mainPanel = new JPanel(){
      // it draws an image if available
      protected void paintComponent(Graphics g) {
         super.paintComponent(g);
         myPaint(g);
      };
   };
   private Image img = null;
   private String selectedCellName = "";
   private JLabel selectedLabel = null;
   private Map<String, JLabel> labelMap = new HashMap<String, JLabel>();
   private SwingPropertyChangeSupport propChangeSupport = new SwingPropertyChangeSupport(this);

   public BattleShipGridPanel(Image img, int cellSideLength) {
      this.img = img;
      mainPanel.setLayout(new GridLayout(11, 11));
      mainPanel.setBorder(BorderFactory.createLineBorder(Color.black));

      MyMouseAdapter myMouseAdapter = new MyMouseAdapter();
      mainPanel.addMouseListener(myMouseAdapter);

      for (int row = 0; row < ROW_COUNT; row++) {
         for (int col = 0; col < COL_COUNT; col++) {
            String rowStr = String.valueOf((char) ('A' + row - 1));
            String colStr = String.valueOf(col);
            String name = ""; // name for component
            String text = ""; // text to display

            // create JLabel to add to grid
            JLabel label = new JLabel("", SwingConstants.CENTER);

            // text to display if label is a row header at col 0
            if (col == 0 && row != 0) {
               text = "" + rowStr;
            } else

            // text to display if label is a col header at row 0
            if (row == 0 && col != 0) {
               text = "" + colStr;
            } else

            // name to give to label if label is on the grid and not a
            // row or col header
            if (row != 0 && col != 0) {
               name = rowStr + " " + colStr;
               labelMap.put(name, label);
            }
            label.setText(text);
            label.setName(name);
            label.setPreferredSize(new Dimension(cellSideLength, cellSideLength));
            label.setBorder(BorderFactory.createLineBorder(Color.black));
            mainPanel.add(label);
         }
      }
   }

   private void myPaint(Graphics g) {
      if (img != null) {
         int w0 = mainPanel.getWidth();
         int h0 = mainPanel.getHeight();
         int x = w0 / 11;
         int y = h0 / 11;

         int iW = img.getWidth(null);
         int iH = img.getHeight(null);

         g.drawImage(img, x, y, w0, h0, 0, 0, iW, iH, null);
      }
   }

   public void addPropertyChangeListener(PropertyChangeListener listener) {
      propChangeSupport.addPropertyChangeListener(listener);
   }

   private class MyMouseAdapter extends MouseAdapter {
      @Override
      public void mousePressed(MouseEvent mEvt) {
         if (mEvt.getButton() == MouseEvent.BUTTON1) {
            Component comp = mainPanel.getComponentAt(mEvt.getPoint());
            if (comp instanceof JLabel) {
               String name = comp.getName();
               if (!name.trim().isEmpty()) {
                  String oldValue = selectedCellName;
                  String newValue = name;
                  selectedCellName = name;
                  selectedLabel = (JLabel) comp;
                  propChangeSupport.firePropertyChange(MOUSE_PRESSED, oldValue, newValue);
               }
            }
         }
      }
   }

   public JPanel getMainPanel() {
      return mainPanel;
   }

   public String getSelectedCellName() {
      return selectedCellName;
   }

   public char getSelectedRow() {
      if (selectedCellName.isEmpty()) {
         return (char)0;
      } else {
         return selectedCellName.split(" ")[0].charAt(0);
      }
   }

   public int getSelectedCol() {
      if (selectedCellName.isEmpty()) {
         return 0;
      } else {
         return Integer.parseInt(selectedCellName.split(" ")[1]);
      }
   }

   public JLabel getSelectedLabel() {
      return selectedLabel;
   }

   public void resetSelections() {
      selectedCellName = "";
      selectedLabel = null;
   }

   public JLabel getLabel(String key) {
      return labelMap.get(key);
   }

   public void resetAll() {
      resetSelections();
      for (String key : labelMap.keySet()) {
         labelMap.get(key).setIcon(null);
      }
   }

   // for testing purposes only
   private static void createAndShowGui() {
      // path to some undersea image
      String imgPath = "http://upload.wikimedia.org/wikipedia/"
            + "commons/3/31/Great_white_shark_south_africa.jpg";
      BufferedImage img = null;
      try {
         img = ImageIO.read(new URL(imgPath));
      } catch (IOException e) {
         e.printStackTrace();
         System.exit(-1);
      }

      int cellSideLength = 36;
      BattleShipGridPanel gridPanel = new BattleShipGridPanel(img, cellSideLength);
      gridPanel.addPropertyChangeListener(new PropertyChangeListener() {

         @Override
         public void propertyChange(PropertyChangeEvent evt) {
            // print out where the mouse pressed:
            System.out.println(evt.getNewValue());
         }
      });
      JFrame frame = new JFrame("BattleShipGridPanel");
      frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
      frame.getContentPane().add(gridPanel.getMainPanel());
      frame.pack();
      frame.setLocationRelativeTo(null);
      frame.setVisible(true);
   }

   public static void main(String[] args) {
      SwingUtilities.invokeLater(new Runnable() {
         public void run() {
            createAndShowGui();
         }
      });
   }

}

import java.awt.BasicStroke;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.Graphics2D;
import java.awt.GridLayout;
import java.awt.RenderingHints;
import java.awt.geom.AffineTransform;
import java.awt.geom.Arc2D;
import java.awt.geom.CubicCurve2D;
import java.awt.geom.Ellipse2D;
import java.awt.geom.Line2D;
import java.awt.geom.Path2D;
import java.awt.geom.Rectangle2D;
import java.awt.geom.Path2D.Double;
import java.awt.geom.QuadCurve2D;
import java.awt.image.BufferedImage;
import java.util.ArrayList;
import java.util.List;

import javax.swing.Icon;
import javax.swing.ImageIcon;
import javax.swing.JLabel;
import javax.swing.JOptionPane;
import javax.swing.JPanel;

public class ShipImageMaker {
   public static final double GAP = 1.0 / 10.0;
   public static final Color LINE_COLOR = Color.black;
   public static final Color[] SHIP_FILL_COLOR = { // Color.LIGHT_GRAY,
         new Color(200, 200, 200, 180),
         new Color(255, 100, 100, 180) };
   public static final Color SHIP_BACKGROUND_COLOR = new Color(0, 0, 0, 0);
   private AffineTransform rotateUp;
   private ImageIcon[] bowRightIcon = new ImageIcon[2];
   private ImageIcon[] bowUpIcon = new ImageIcon[2];
   private ImageIcon[] sternLeftIcon = new ImageIcon[2];
   private ImageIcon[] sternDownIcon = new ImageIcon[2];
   private ImageIcon[] midshipHorizIcon = new ImageIcon[2];
   private ImageIcon[] midshipVertIcon = new ImageIcon[2];

   public ShipImageMaker(int side) {
      rotateUp = AffineTransform.getQuadrantRotateInstance(3, side / 2,
            side / 2);

      Path2D turretPath = new Path2D.Double();
      double tpX = side / 2.0 - 3 * GAP * side;
      double tpY = side / 2.0 - 1.5 * GAP * side;
      double tpW = 3 * GAP * side;
      double tpH = tpW;
      double lx1 = tpX + tpW;
      double ly1 = side / 2.0 - 0.5 * GAP * side;
      double lx2 = lx1 + 1.5 * GAP * side;
      double ly2 = ly1;
      turretPath.append(new Ellipse2D.Double(tpX, tpY, tpW, tpH), false);
      turretPath.append(new Line2D.Double(lx1, ly1, lx2, ly2), false);
      turretPath.append(new Line2D.Double(lx1, side - ly1, lx2, side - ly2),
            false);

      double y1 = GAP * side;
      double ctrlx = side / 2.0;
      double ctrly = y1;
      double x2 = side - y1;
      double y2 = side / 2.0;

      QuadCurve2D topQC = new QuadCurve2D.Double(0, y1, ctrlx, ctrly, x2, y2);
      QuadCurve2D botQC = new QuadCurve2D.Double(x2, y2, ctrlx, side - ctrly,
            0, side - y1);
      Path2D bowFillPath = new Path2D.Double();
      bowFillPath.moveTo(0, y1);
      bowFillPath.append(topQC, false);
      bowFillPath.append(botQC, false);
      bowFillPath.lineTo(0, y1);

      Path2D bowDrawPath = new Path2D.Double();
      bowDrawPath.append(topQC, false);
      bowDrawPath.append(botQC, false);
      bowDrawPath.append(turretPath, false);

      Line2D midShipTopLine = new Line2D.Double(0, y1, side, y1);
      Line2D midShipBotLine = new Line2D.Double(side, side - y1, 0, side - y1);
      Path2D midShipFillPath = new Path2D.Double();
      midShipFillPath.moveTo(0, y1);
      midShipFillPath.append(midShipTopLine, false);
      midShipFillPath.lineTo(side, side - y1);
      midShipFillPath.append(midShipBotLine, false);
      midShipFillPath.lineTo(0, y1);

      Path2D midShipDrawPath = new Path2D.Double();
      midShipDrawPath.append(midShipTopLine, false);
      midShipDrawPath.append(midShipBotLine, false);
      midShipDrawPath.append(turretPath, false);

      Path2D sternDrawPath = new Path2D.Double();
      sternDrawPath.moveTo(side, y1);
      sternDrawPath.lineTo(side / 2, y1);
      sternDrawPath.append(new CubicCurve2D.Double(side / 2, y1, y1, y1, y1,
            side - y1, side / 2, side - y1), false);
      sternDrawPath.lineTo(side, side - y1);

      Path2D sternFillPath = new Path2D.Double(sternDrawPath);
      sternFillPath.lineTo(side, y1);

      sternDrawPath.append(turretPath.createTransformedShape(AffineTransform
            .getQuadrantRotateInstance(2, side / 2, side / 2)), false);

      for (int i = 0; i < bowRightIcon.length; i++) {
         BufferedImage img = createImage(side, bowFillPath, bowDrawPath,
               SHIP_FILL_COLOR[i]);
         bowRightIcon[i] = new ImageIcon(img);
         bowUpIcon[i] = rotateUp(side, img);

         img = createImage(side, midShipFillPath, midShipDrawPath,
               SHIP_FILL_COLOR[i]);
         midshipHorizIcon[i] = new ImageIcon(img);
         midshipVertIcon[i] = rotateUp(side, img);

         img = createImage(side, sternFillPath, sternDrawPath,
               SHIP_FILL_COLOR[i]);
         sternLeftIcon[i] = new ImageIcon(img);
         sternDownIcon[i] = rotateUp(side, img);
      }

   }

   private BufferedImage createImage(int side, Path2D fillPath,
         Path2D drawPath, Color shipFillColor) {
      BufferedImage img = new BufferedImage(side, side,
            BufferedImage.TYPE_INT_ARGB);
      Graphics2D g2 = img.createGraphics();
      g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING,
            RenderingHints.VALUE_ANTIALIAS_ON);
      g2.setColor(shipFillColor);
      g2.setBackground(SHIP_BACKGROUND_COLOR);
      g2.fill(fillPath);
      g2.setColor(LINE_COLOR);
      g2.setStroke(new BasicStroke(2f));
      g2.draw(drawPath);
      g2.dispose();
      return img;
   }

   private ImageIcon rotateUp(int side, BufferedImage src) {
      BufferedImage img = new BufferedImage(side, side,
            BufferedImage.TYPE_INT_ARGB);
      Graphics2D g2 = img.createGraphics();
      g2.setTransform(rotateUp);
      g2.drawImage(src, 0, 0, null);
      g2.dispose();
      return new ImageIcon(img);
   }

   public ImageIcon[] getBowRightIcon() {
      return bowRightIcon;
   }

   public ImageIcon[] getBowUpIcon() {
      return bowUpIcon;
   }

   public ImageIcon[] getSternLeftIcon() {
      return sternLeftIcon;
   }

   public ImageIcon[] getSternDownIcon() {
      return sternDownIcon;
   }

   public ImageIcon[] getMidshipHorizIcon() {
      return midshipHorizIcon;
   }

   public ImageIcon[] getMidshipVertIcon() {
      return midshipVertIcon;
   }

   public static void main(String[] args) {
      List<Icon> icons = new ArrayList<Icon>();
      ShipImageMaker imgMaker = new ShipImageMaker(40);

      icons.add(imgMaker.getBowRightIcon()[0]);
      icons.add(imgMaker.getBowRightIcon()[1]);
      icons.add(imgMaker.getBowUpIcon()[0]);
      icons.add(imgMaker.getBowUpIcon()[1]);
      icons.add(imgMaker.getMidshipHorizIcon()[0]);
      icons.add(imgMaker.getMidshipHorizIcon()[1]);
      icons.add(imgMaker.getMidshipVertIcon()[0]);
      icons.add(imgMaker.getMidshipVertIcon()[1]);
      icons.add(imgMaker.getSternDownIcon()[0]);
      icons.add(imgMaker.getSternDownIcon()[1]);
      icons.add(imgMaker.getSternLeftIcon()[0]);
      icons.add(imgMaker.getSternLeftIcon()[1]);

      for (Icon icon : icons) {
         JOptionPane.showMessageDialog(null, new JLabel(icon));
      }
   }
}

使用BorderLayout,GridLayout和BoxLayout。

答案 1 :(得分:2)

很多内容将归结为您想要实现的目标,例如您可以使用GridLayoutGridBagLayout或布局管理器的组合,或者您可以使用自定义绘画,或者您可以使用例如JTable ......

Layout

现在,这是非常基本的,仅用于提供概念证明

import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.EventQueue;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.JScrollPane;
import javax.swing.JTable;
import javax.swing.UIManager;
import javax.swing.UnsupportedLookAndFeelException;
import javax.swing.border.Border;
import javax.swing.border.LineBorder;
import javax.swing.border.MatteBorder;
import javax.swing.event.TableModelEvent;
import javax.swing.event.TableModelListener;
import javax.swing.table.DefaultTableModel;

public class Test {

    public static void main(String[] args) {
        new Test();
    }

    public Test() {
        EventQueue.invokeLater(new Runnable() {
            @Override
            public void run() {
                try {
                    UIManager.setLookAndFeel(UIManager.getSystemLookAndFeelClassName());
                } catch (ClassNotFoundException | InstantiationException | IllegalAccessException | UnsupportedLookAndFeelException ex) {
                    ex.printStackTrace();
                }

                JFrame frame = new JFrame("Testing");
                frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                frame.add(new MainPane());
                frame.pack();
                frame.setLocationRelativeTo(null);
                frame.setVisible(true);
            }
        });
    }

    public class MainPane extends JPanel {

        public MainPane() {
            setLayout(new BorderLayout());
            DefaultTableModel model = new DefaultTableModel(10, 10);
            JTable table = new JTable(model);
            table.setRowHeight(40);
            table.setShowGrid(true);
            table.setGridColor(Color.BLACK);

            JScrollPane sp = new JScrollPane(table);
            sp.setRowHeaderView(new RowHeader(table));
            add(sp);
        }

    }

    public class RowHeader extends JPanel {

        private JTable table;

        public RowHeader(JTable table) {
            setOpaque(false);
            this.table = table;
            table.getModel().addTableModelListener(new TableModelListener() {
                @Override
                public void tableChanged(TableModelEvent e) {
                    prepareLayout();
                }
            });
            setLayout(new GridBagLayout());
            prepareLayout();
        }

        protected void prepareLayout() {
            GridBagConstraints gbc = new GridBagConstraints();
            gbc.gridwidth = GridBagConstraints.REMAINDER;
            gbc.fill = GridBagConstraints.BOTH;
            gbc.anchor = GridBagConstraints.CENTER;
            Border border = new MatteBorder(0, 1, 1, 1, Color.BLACK);
            for (int row = 0; row < 10; row++) {
                char value = (char) ('A' + row);
                JLabel label = makeLabel(Character.toString(value));
                label.setBorder(border);
                add(label, gbc);
            }
            gbc.weighty = 1;
            JLabel filler = makeLabel("");
            filler.setBorder(new MatteBorder(1, 0, 0, 0, Color.BLACK));
            add(filler, gbc);
        }

        protected JLabel makeLabel(String text) {
            JLabel label = new JLabel(text) {
                @Override
                public Dimension getPreferredSize() {
                    Dimension size = super.getPreferredSize();
                    size.height = table.getRowHeight();
                    size.width += 10;
                    return size;
                }
            };
            label.setHorizontalAlignment(JLabel.CENTER);
            return label;
        }
    }

}

答案 2 :(得分:0)

使用BorderLayout,取3个面板并将它们设置在NORTH,CENTER和SOUTH。 IN CENTER使用JTable。要显示您的表格,如果您想在两个表格之间添加字母表,您可以通过在中心面板中添加子面板来拆分中心面板。 比如center_panel.add(subpanel1,你想要的位置),或者只是通过流程布局。