Question

作为较大项目的一部分，我试图创建一个基本的UI，该UI将允许用户单击JButton选择所需的颜色，然后允许该用户单击另一个JButton指定要显示的形状，并填充根据先前选择的颜色。我了解我必须利用动作事件。

请注意，我正在引用这个类似的问题：

GUI Application that allows the user to choose the shape and color of a drawing

到目前为止，我的代码是：

import java.util.*;
import javax.swing.*;
import javax.swing.border.*;
import java.awt.*;
import java.awt.event.*;

public class GUI extends JFrame implements ActionListener, WindowListener
{
private final JButton circleButton, rectangleButton, redButton;
private final JButton greenButton, blueButton, exitButton;
private final JTextArea textArea;
private final JLabel label1;
private final JPanel colorPane;

private String shapeColor = "black";
private String actualShape = "rectangle";

private static final int ROWS = 2, COLS = 3;

public GUI (String title)
{
    super(title);
    //setResizable(false);
    setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

    colorPane = new JPanel();

    label1 = new JLabel("current date here");
    label1.setVerticalAlignment(SwingConstants.BOTTOM);
    label1.setHorizontalAlignment(SwingConstants.LEFT);
    label1.setPreferredSize(new Dimension(200,0));
    getContentPane().add(label1, BorderLayout.WEST);

    colorPane.setLayout(new GridLayout(ROWS,COLS));
    getContentPane().add(colorPane, BorderLayout.CENTER);

    redButton = makeButton("Red");
    colorPane.add(redButton);
    greenButton = makeButton("Green");
    colorPane.add(greenButton);
    blueButton = makeButton("Blue");
    colorPane.add(blueButton);
    rectangleButton = makeButton("Rectangle");
    colorPane.add(rectangleButton);
    circleButton = makeButton("Circle");
    colorPane.add(circleButton);
    exitButton = makeButton("Exit");
    colorPane.add(exitButton);

    textArea = new JTextArea(0,20);
    getContentPane().add(textArea, BorderLayout.EAST);

    pack();
}


public void paint(Graphics g, String color)
{
    if (shapeColor.equalsIgnoreCase("blue") && actualShape.equalsIgnoreCase("rectangle"))
    {   
        g.setColor(Color.BLUE);
        g.fillRect(50, 90, 100, 50);
    }
    else if (shapeColor.equalsIgnoreCase("green") && actualShape.equalsIgnoreCase("circle"))
    {   
        g.setColor(Color.GREEN);
        g.fillOval(50, 180, 55, 55);
    }
    else if (shapeColor.equalsIgnoreCase("red") && actualShape.equalsIgnoreCase("rectangle"))
    {
        g.setColor(Color.RED);
        g.fillRect(50, 90, 100, 50);
    }
    else if (shapeColor.equalsIgnoreCase("green") && actualShape.equalsIgnoreCase("rectangle"))
    {
        g.setColor(Color.GREEN);
        g.fillRect(50,90,100,50);
    }
    else if (shapeColor.equalsIgnoreCase("blue") && actualShape.equalsIgnoreCase("circle"))
    {
        g.setColor(Color.BLUE);
        g.fillOval(50, 180, 55, 55);
    }
    else if (shapeColor.equalsIgnoreCase("red") && actualShape.equalsIgnoreCase("circle"))
    {
        g.setColor(Color.RED);
        g.fillOval(50, 180, 55, 55);
    }
}




//method designed to create new JButtons while avoiding code duplication
private JButton makeButton(String text)
{
    JButton b = new JButton(text);
    b.setHorizontalAlignment(SwingConstants.LEFT);
    b.addActionListener(this);
    b.setPreferredSize(new Dimension(125,55));

    return b;
}

@Override
public void windowOpened(WindowEvent e) {
    // TODO Auto-generated method stub

}

@Override
public void windowClosing(WindowEvent e) 
{
    System.exit(0);

}

@Override
public void windowClosed(WindowEvent e) {
    // TODO Auto-generated method stub

}

@Override
public void windowIconified(WindowEvent e) {
    // TODO Auto-generated method stub

}

@Override
public void windowDeiconified(WindowEvent e) {
    // TODO Auto-generated method stub

}

@Override
public void windowActivated(WindowEvent e) {
    // TODO Auto-generated method stub

}

@Override
public void windowDeactivated(WindowEvent e) {
    // TODO Auto-generated method stub

}

@Override
public void actionPerformed(ActionEvent e) 
{
    System.out.println( ( (JButton)e.getSource() ).getText() + " button pressed ");

    if ( ( ((JButton) e.getSource()).getText().equalsIgnoreCase("Red")) )
    {   
        setShapeColor("Red");
        System.out.println("selected color is: " + shapeColor + " selected shape is: " + actualShape);
        //paint(this.getGraphics());
    }   
    else if ( ( ((JButton) e.getSource()).getText().equalsIgnoreCase("Blue")) )
    {   
        setShapeColor("Blue");
        System.out.println("selected color is: " + shapeColor + " selected shape is: " + actualShape);
        //paint(this.getGraphics());
    }

    else if ( ( ((JButton) e.getSource()).getText().equalsIgnoreCase("Green")) )
    {   
        setShapeColor("Green");
        System.out.println("selected color is: " + shapeColor + " selected shape is: " + actualShape);
        //paint(this.getGraphics());
    }   


    if ( ( ((JButton) e.getSource()).getText().equalsIgnoreCase("Rectangle")) )
    {
        setActualShape("rectangle");
        System.out.println("selected shape is: " + actualShape + " selected color is: " + shapeColor);
        paint(this.getGraphics(), shapeColor);


    }

    else if ( ( ((JButton) e.getSource()).getText().equalsIgnoreCase("Circle")) )
    {
        setActualShape("circle");
        System.out.println("selected shape is: " + actualShape + " selected color is: " + shapeColor);
        paint(this.getGraphics(), shapeColor);
    }

}

public String getShapeColor() {
    return shapeColor;
}

public void setShapeColor(String shapeColor) {
    this.shapeColor = shapeColor;
}

public String getActualShape() {
    return actualShape;
}

public void setActualShape(String actualShape) {
    this.actualShape = actualShape;
}

public static void main(String[] args)
{
    new GUI("My Gui").setVisible(true);
}

}

到目前为止，我实现的是一个输出，该输出既显示所选颜色，又显示将以所选颜色呈现的所选形状。

此外，我已经成功输出了形状，该形状的位置是硬编码的，但是由于用户单击，其形状（圆形或正方形）和颜色（红色，蓝色或绿色）可以正确输出

我正在努力的最后一个阶段是形状输出的实现，以便用户的单击顺序确定形状输出到屏幕的位置和尺寸。

目标是实现此处演示的功能：

https://metrostate.learn.minnstate.edu/content/2020/4560296-20201000539/ICS372%20-%20Assignment%202%20Video.mp4?d2lSessionVal=ARifwbCHriCBrkgxBWpL9g8fL&ou=4560296

我相对确定正确的解决方案类似于以下代码：

import java.util.*;
import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
import javax.swing.event.*;

/**
 *  Note: Normally the ButtonPanel and DrawingArea would not be static 
classes.
 *  This was done for the convenience of posting the code in one class and 
to
 *  highlight the differences between the two approaches. All the 
differences
 *  are found in the DrawingArea class.
 */
public class DrawOnComponent
{
public static void main(String[] args)
{
    SwingUtilities.invokeLater(new Runnable() {
        public void run() {
            createAndShowGUI();
        }
    });
}

private static void createAndShowGUI()
{
    DrawingArea drawingArea = new DrawingArea();
    ButtonPanel buttonPanel = new ButtonPanel( drawingArea );

    JFrame.setDefaultLookAndFeelDecorated(true);
    JFrame frame = new JFrame("Draw On Component");
    frame.setDefaultCloseOperation( JFrame.EXIT_ON_CLOSE );
    frame.getContentPane().add(drawingArea);
    frame.getContentPane().add(buttonPanel, BorderLayout.SOUTH);
    frame.setSize(400, 400);
    frame.setLocationRelativeTo( null );
    frame.setVisible(true);
}

static class ButtonPanel extends JPanel implements ActionListener
{
    private DrawingArea drawingArea;

    public ButtonPanel(DrawingArea drawingArea)
    {
        this.drawingArea = drawingArea;

        add( createButton(" ", Color.BLACK) );
        add( createButton(" ", Color.RED) );
        add( createButton(" ", Color.GREEN) );
        add( createButton(" ", Color.BLUE) );
        add( createButton(" ", Color.ORANGE) );
        add( createButton(" ", Color.YELLOW) );
        add( createButton("Clear Drawing", null) );
    }

    private JButton createButton(String text, Color background)
    {
        JButton button = new JButton( text );
        button.setBackground( background );
        button.addActionListener( this );

        return button;
    }

    public void actionPerformed(ActionEvent e)
    {
        JButton button = (JButton)e.getSource();

        if ("Clear Drawing".equals(e.getActionCommand()))
            drawingArea.clear();
        else
            drawingArea.setForeground( button.getBackground() );
    }
}

static class DrawingArea extends JPanel
{
    private final static int AREA_SIZE = 400;
    private ArrayList<ColoredRectangle> coloredRectangles = new ArrayList<ColoredRectangle>();
    private Rectangle shape;

    public DrawingArea()
    {
        setBackground(Color.WHITE);

        MyMouseListener ml = new MyMouseListener();
        addMouseListener(ml);
        addMouseMotionListener(ml);
    }

    @Override
    public Dimension getPreferredSize()
    {
        return isPreferredSizeSet() ?
            super.getPreferredSize() : new Dimension(AREA_SIZE, AREA_SIZE);
    }

    @Override
    protected void paintComponent(Graphics g)
    {
        super.paintComponent(g);

        //  Custom code to paint all the Rectangles from the List

        Color foreground = g.getColor();

        g.setColor( Color.BLACK );
        g.drawString("Add a rectangle by doing mouse press, drag and release!", 40, 15);

        for (DrawingArea.ColoredRectangle cr : coloredRectangles)
        {
            g.setColor( cr.getForeground() );
            Rectangle r = cr.getRectangle();
            g.drawRect(r.x, r.y, r.width, r.height);
        }

        //  Paint the Rectangle as the mouse is being dragged

        if (shape != null)
        {
            Graphics2D g2d = (Graphics2D)g;
            g2d.setColor( foreground );
            g2d.draw( shape );
        }
    }

    public void addRectangle(Rectangle rectangle, Color color)
    {
        //  Add the Rectangle to the List so it can be repainted

        ColoredRectangle cr = new ColoredRectangle(color, rectangle);
        coloredRectangles.add( cr );
        repaint();
    }

    public void clear()
    {
        coloredRectangles.clear();
        repaint();
    }

    class MyMouseListener extends MouseInputAdapter
    {
        private Point startPoint;

        public void mousePressed(MouseEvent e)
        {
            startPoint = e.getPoint();
            shape = new Rectangle();
        }

        public void mouseDragged(MouseEvent e)
        {
            int x = Math.min(startPoint.x, e.getX());
            int y = Math.min(startPoint.y, e.getY());
            int width = Math.abs(startPoint.x - e.getX());
            int height = Math.abs(startPoint.y - e.getY());

            shape.setBounds(x, y, width, height);
            repaint();
        }

        public void mouseReleased(MouseEvent e)
        {
            if (shape.width != 0 || shape.height != 0)
            {
                addRectangle(shape, e.getComponent().getForeground());
            }

            shape = null;
        }
    }

    class ColoredRectangle
    {
        private Color foreground;
        private Rectangle rectangle;

        public ColoredRectangle(Color foreground, Rectangle rectangle)
        {
            this.foreground = foreground;
            this.rectangle = rectangle;
        }

        public Color getForeground()
        {
            return foreground;
        }

        public void setForeground(Color foreground)
        {
            this.foreground = foreground;
        }

        public Rectangle getRectangle()
        {
            return rectangle;
        }
    }
}
}

但是，以我目前的知识水平，我无法对该解决方案程序进行逆向工程以适合我的当前代码。

~~我知道我必须重写'paint'方法~~，并且作为硬编码练习，我在代码中添加了以下内容：

public void paint(Graphics g, String color)
{
    if (shapeColor.equalsIgnoreCase("blue") && actualShape.equalsIgnoreCase("rectangle"))
    {   
        g.setColor(Color.BLUE);
        g.fillRect(50, 90, 100, 50);
    }
    else if (shapeColor.equalsIgnoreCase("green") && actualShape.equalsIgnoreCase("circle"))
    {   
        g.setColor(Color.GREEN);
        g.fillOval(50, 180, 55, 55);
    }
    else if (shapeColor.equalsIgnoreCase("red") && actualShape.equalsIgnoreCase("rectangle"))
    {
        g.setColor(Color.RED);
        g.fillRect(50, 90, 100, 50);
    }
    else if (shapeColor.equalsIgnoreCase("green") && actualShape.equalsIgnoreCase("rectangle"))
    {
        g.setColor(Color.GREEN);
        g.fillRect(50,90,100,50);
    }
    else if (shapeColor.equalsIgnoreCase("blue") && actualShape.equalsIgnoreCase("circle"))
    {
        g.setColor(Color.BLUE);
        g.fillOval(50, 180, 55, 55);
    }
    else if (shapeColor.equalsIgnoreCase("red") && actualShape.equalsIgnoreCase("circle"))
    {
        g.setColor(Color.RED);
        g.fillOval(50, 180, 55, 55);
    }
}
}

~~我不确定如何记录用户单击按钮的坐标，然后将这些坐标传递到所需形状的构造函数中。~~

我有点挣扎，所以任何帮助当然都会得到赞赏

Answer 1

您的代码中有几个错误需要更改：

不要扩展JFrame，请参见Extends JFrame vs. creating it inside the program，而是在您的类中创建它的实例。如果您需要从JComponent扩展，请使其更加灵活，例如JPanel。
不要覆盖paint(...)方法，您需要覆盖JPanel的{{1}}方法，并且不要忘记将paintComponent(...)作为第一行在其中，否则您可能会中断油漆链并产生有趣/怪异的行为。都不通过super.paintComponent(g)对象，请参见Tutorial on Custom Painting
使用Shape API而不是直接在getGraphics()上绘图，因为它提供了更多功能。看到这篇文章：Create the square, rectangle, triangle of java in jframe
不要调用JPanel，请覆盖setPreferredSize，请参阅：Should I avoid the use of set(Preferred|Maximum|Minimum)Size methods in Java Swing?
将您的程序放在EDT上，在同一答案的第3点的链接文章中查看第7点。

因此，这是一个遵循上述建议的示例：

getPreferredSize

程序外观如下：

我不确定如何记录用户单击按钮的坐标，然后将这些坐标传递到所需形状的构造函数中。

要获取相对于窗口的坐标，请参见：How to get location of a mouse click relative to a swing window

Answer 2

以下是建议的实现，其中还结合了good guidance you got from Frakcool：

import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.GridLayout;
import java.awt.Point;
import java.awt.event.ActionListener;
import java.awt.event.MouseAdapter;
import java.awt.event.MouseEvent;
import java.awt.geom.Ellipse2D;
import java.awt.geom.Rectangle2D;
import java.util.HashMap;
import java.util.Map;
import javax.swing.ButtonGroup;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.JTextArea;
import javax.swing.JToggleButton;
import javax.swing.SwingConstants;
import javax.swing.SwingUtilities;

public class GUI
{
    private final ButtonGroup colorGroup; //group  buttons
    private final ButtonGroup shapeGroup; //so only one can be selected at any given time
    private final Map<String, Color> colors; //map colors to it names.
    private Color color; // color for painting
    private Shape shape; //shape to paint
    private JFrame frame;
    private JPanel buttonsPane;
    private JTextArea textArea;

    private static final int ROWS = 2, COLS = 3;
    private static final String[] BUTTONS_LABELS = {"Rectangle", "Circle", "Exit"};

    public GUI()
    {
        shapeGroup = new ButtonGroup(); colorGroup = new ButtonGroup();
        colors = new HashMap<>();
        colors.put("Red", Color.RED); colors.put("Green", Color.GREEN); colors.put("Blue", Color.BLUE);
    }

    private void createAndShowGUI(String title) {
        frame = new JFrame(title);
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

        //use a GridLayout for the buttons pane
        buttonsPane = new JPanel();
        buttonsPane.setLayout(new GridLayout(ROWS, COLS));
        frame.getContentPane().add(buttonsPane, BorderLayout.CENTER);//each BorderLayout position can hold ONE component

        for(String colorName : colors.keySet()){
            JToggleButton button = makeButton(colorName);
            buttonsPane.add(button);
            colorGroup.add(button);
            button.addActionListener(changeColorAction());
        }

        for(String text : BUTTONS_LABELS){
            JToggleButton button = makeButton(text);
            buttonsPane.add(button);
            shapeGroup.add(button);
            button.addActionListener(changeShapeAction());
        }

        setDefaults();

        frame.getContentPane().add(new Draw(), BorderLayout.WEST);
        textArea = new JTextArea(0,20);
        frame.getContentPane().add(textArea, BorderLayout.EAST);

        frame.pack();
        frame.setVisible(true);
    }

    private JToggleButton makeButton(String text) {
        JToggleButton b = new JToggleButton(text); //use toggle buttons
        b.setHorizontalAlignment(SwingConstants.LEFT);
        b.setPreferredSize(new Dimension(100, 80)); //set preferred and let Layout manager do its work
        return b;
    }

    private ActionListener changeColorAction() {
        return e->{
            color = colors.get(((JToggleButton)e.getSource()).getText());
            frame.repaint();
        };
    }

    private ActionListener changeShapeAction() {
        return e->{
            switch (((JToggleButton)e.getSource()).getText()){

                case "Circle":
                    shape = Shape.CIRCLE;
                    break;
                case "Rectangle":
                    shape = Shape.RECTANGLE;
                    break;
                default: System.exit(0);
            }

            frame.repaint();
        };
    }

    private void setDefaults() {
        colorGroup.getElements().nextElement().setSelected(true);
        color = colors.get(colorGroup.getElements().nextElement().getText());
        shapeGroup.getElements().nextElement().setSelected(true);
        shape = Shape.RECTANGLE;
    }

      public static void main(String[] args) {
            SwingUtilities.invokeLater(() -> new GUI().createAndShowGUI("My Gui"));
        }

    class Draw extends JPanel{

        private final Point[] points; // an array to hold clicked points
        private int mouseClicks = 0;
        private static final int POINT_SIZE = 2;

        Draw(){
            setLayout(new BorderLayout());
            setBackground(Color.WHITE);
            setPreferredSize(new Dimension(200, 200));

            JLabel help = new JLabel("Click 2 points to draw");
            help.setHorizontalAlignment(SwingConstants.CENTER);
            add(help, BorderLayout.PAGE_START);

            JLabel timeLabel = new JLabel("current time here");
            timeLabel.setHorizontalAlignment(SwingConstants.LEFT);
            add(timeLabel, BorderLayout.PAGE_END);

            points = new Point[2];
            addMouseListener(new MouseAdapter(){
                @Override
                public void mouseClicked(MouseEvent e) {
                    addPoint(e.getX(), +e.getY() );
                }
            });
        }

        @Override
        public void paintComponent(Graphics g){
            super.paintComponent(g);
            g.setColor(color);
            for(Point point : points)
                if(point != null){
                    g.drawOval(point.x, point.y, POINT_SIZE, POINT_SIZE);
                }

            drawShape((Graphics2D)g);
        }

        private void addPoint(int x, int y) {
            if(mouseClicks ==2){
                mouseClicks = 0;
                points[1] = null;
            }

            points[mouseClicks++] = new Point(x, y);
            repaint();
        }

        private void drawShape(Graphics2D g2d) {

            if(points[0] == null ||  points[1] == null) return;
            if(shape == Shape.RECTANGLE) {
                drawRectangle(g2d);
            }else{
                drawCircle(g2d);
            }
        }

        private void drawRectangle(Graphics2D g2D) {

            int minX = Math.min(points[0].x, points[1].x);
            int minY = Math.min(points[0].y, points[1].y);
            int maxX = Math.max(points[0].x, points[1].x);
            int maxY = Math.max(points[0].y, points[1].y);
            int width  = maxX - minX;
            int height = maxY - minY;
            Rectangle2D.Double rectangle = new Rectangle2D.Double(minX, minY, width, height);
            g2D.draw(rectangle);
        }

        private void drawCircle(Graphics2D g2D) {

            int minX = Math.min(points[0].x, points[1].x);
            int minY = Math.min(points[0].y, points[1].y);
            int maxX = Math.max(points[0].x, points[1].x);
            int maxY = Math.max(points[0].y, points[1].y);
            double dx  = maxX - minX;
            double dy = maxY - minY;
            double radius =  Math.sqrt(dx*dx + dy*dy)/2;
            double centerX = minX + dx/2;
            double centerY = minY + dy/2;

            g2D.draw(new Ellipse2D.Double(centerX - radius , centerY - radius, 2* radius, 2* radius));
        }
    }

    enum Shape {
        RECTANGLE, CIRCLE
    }
}

如何输出用户选择的形状和颜色，其位置和尺寸取决于用户点击的坐标位置

2 个答案: