title: How to use Canvas to draw multiple rectangles based on user input?
body: <p>So basically I'm writing a program where the user clicks and drags the mouse to a size he/she wants, and lets go, filling in a rectangle based on the choice from the JComboBox.</p>
  
  <p><img src="https://i.stack.imgur.com/2qHmV.png" alt="basic layout"></p>
  
  <p>What I have implemented is MouseListener and MouseMotionListener to track the location of the mouse, and draw a rectangle based on where the user first clicked, to where it was let go.</p>
  
  <p>When the user clicks and drags (but does not let go), there is a drawRect() but not a fillRect() (as in, the rectangle does not fill - only when the user releases the mouse does the rectangle fill with the color).</p>
  
  <p>This class creates a Rect object that has another part in the constructor, which is the color that is selected (which is determined in the ColorListener class below).</p>
  
  <p>This is where I included my instance variables, and everything is instantiated in the constructor below: </p>
  
  <pre><code>private ArrayList&lt;Rect&gt; rectList;
  private Color currentColor;
  private Canvas canvas;
  private JPanel controlPanel;
  private JButton undo, erase;
  private JComboBox comboBox;
  private int xStart, yStart, xEnd, yEnd;
  private Graphics page;
  private Point pt = null;
  private PointListener pointListener;
  private ColorListener colorListener;
  
  public WholePanel()
  {
      // here we use black to draw a rectangle
      currentColor = Color.black;
      pointListener = new PointListener();
      addMouseListener(pointListener);
      addMouseMotionListener(pointListener);
  
      String[] listOfColors = {"black", "red", "blue", "green", "orange"};
  
      comboBox = new JComboBox(listOfColors);
      comboBox.setSelectedIndex(0);
  
      rectList = new ArrayList&lt;Rect&gt;();
      controlPanel = new JPanel(new GridLayout(1,3));
  
      undo = new JButton("Undo");
      erase = new JButton("Erase");
      controlPanel.add(comboBox);
      controlPanel.add(undo);
      controlPanel.add(erase);
      undo.addActionListener(new ButtonListener());
      erase.addActionListener(new ButtonListener());
  
      canvas = new Canvas();
  
      JSplitPane sp = new JSplitPane(JSplitPane.VERTICAL_SPLIT, controlPanel, canvas);
  
      setLayout(new BorderLayout());
      add(sp);
  }
  </code></pre>
  
  <p>The Rect class can create a Rect object used later.</p>
  
  <pre><code>public class Rect
  {
  private int x1, y1, width1, height1;
  private Color color1;
  
  public Rect(int x, int y, int width, int height, Color color)
  {
      x1 = x;
      y1 = y;
      width1 = width;
      height1 = height;
      color1 = color;
  }
  
  public void draw(Graphics page)
  {
      page.setColor(color1);
      page.drawRect(x1,y1,width1,height1);
  }
  }
  </code></pre>
  
  <p>The Canvas class creates the space that allows for drawing of an object. </p>
  
  <pre><code>private class Canvas extends JPanel
  {
  
      public void paintComponent(Graphics page)
      {
          super.paintComponent(page);
          setBackground(Color.white);
          if (pt != null)
          {
              Rect rect = new Rect(xStart, yStart, xEnd-xStart, yEnd-yStart, currentColor);
              rect.draw(page);
          }
      }
  }
  </code></pre>
  
  <p>The PointListener class finds all the points that are there, as in where the user clicks, to where the user drags, and also to where the user releases. </p>
  
  <pre><code>private class PointListener implements MouseListener, MouseMotionListener
  {
      public void mousePressed(MouseEvent event)
      {
          pt = event.getPoint();
          xStart = pt.x;
          yStart = pt.y;
      }
      public void mouseReleased(MouseEvent event)
      {
          pt = event.getPoint();
          if (pt != null)
          {
              xEnd = pt.x;
              yEnd = pt.y;
              page.fillRect(xStart, yStart, xEnd-xStart, yEnd-yStart);
          }
      }
      public void mouseClicked(MouseEvent event) {}
      public void mouseEntered(MouseEvent event) {}
      public void mouseExited(MouseEvent event) {}
      public void mouseDragged(MouseEvent event)
      {
          pt = event.getPoint();
          if (pt != null)
          {
              xEnd = pt.x;
              yEnd = pt.y;
              Rect rect = new Rect(xStart, yStart, xEnd-xStart, yEnd-yStart, currentColor);
              rect.draw(page);
          }
          repaint();
      }
      public void mouseMoved(MouseEvent event) {}
  
  }
  </code></pre>
  
  <p>ColorListener finds the type of object that is selected in the JComboBox determined in the main() method, and sets the currentColor to it (it is put back as the color in the Rect constructor above).</p>
  
  <pre><code>private class ColorListener implements ActionListener
  {
      public void actionPerformed(ActionEvent event)
      {
          if (event.getSource().equals("black"))
          {
              currentColor = Color.black;
              comboBox.setSelectedIndex(0);
          }
          else if (event.getSource().equals("red"))
          {
              currentColor = Color.red;
              comboBox.setSelectedIndex(1);
          }
          else if (event.getSource().equals("blue"))
          {
              currentColor = Color.blue;
              comboBox.setSelectedIndex(2);
          }
          else if (event.getSource().equals("green"))
          {
              currentColor = Color.green;
              comboBox.setSelectedIndex(3);
          }
          else if (event.getSource().equals("orange"))
          {
              currentColor = Color.orange;
              comboBox.setSelectedIndex(4);
          }
      }
  }
  </code></pre>
  
  <p>So what I am having trouble with is being able to draw it. I don't see any flaws in logic in the program so far above, and nothing is being able to be drawn onto the Canvas (don't worry about the JButtons Undo and Erase, as they are easy to work with with an ArrayList and remove() and clear() and things like that).</p>