Bufferedimage 上的可拖动形状

Question

我正在 Java 中开发一个简单的形状编辑器，我在 BufferedImage 上绘制所有内容，因为我想保存绘制的图像。用户可以通过从菜单中选择形状来绘制形状，然后单击图像。我开始实现拖动形状。当我拖动一个形状时，正在创建该形状的路径...我认为这是因为我在 BufferedImage 上绘制所以它就像 'temporary'。还是我错了？我正在考虑重写所有内容，这次不是在 BufferedImage 上绘制，只是创建 Graphics2D，但是我在实现侦听器时遇到了问题，因为我需要将我的 Graphics2D 传输到那里以在那里添加形状，而且我不知道如何调用 repaint例如。我的 MouseListener class。我计划在用户想要保存图像时创建 BufferedImage，我会在存储所有形状的矢量的帮助下创建它（或者更好的方法？）。这是我的面板 class:

public class Panel {

    public static Graphics2D img2;

    public static Graphics2D getIm() {
        return this.img2;
    }

    public Panel(JFrame frame) {

        JPanel panel = new JPanel(true) {

            @Override
            protected void paintComponent(Graphics g) {

                super.paintComponent(g);


                img2 = (Graphics2D)g.create();  
                img2.dispose();
            };
        };
        RenderingHints.VALUE_ANTIALIAS_ON); // setting rendering to achieve better looking shapes
        panel.setBackground(Color.WHITE);
        MouseListenerShapes mouseListenerShapes = new MouseListenerShapes();
        panel.addMouseListener(mouseListenerShapes);
        //MouseMoveAdapter mouseMouseMoveAdapter = new MouseMoveAdapter();
        //panel.addMouseMotionListener(mouseMouseMoveAdapter);
        //panel.addMouseListener(mouseMouseMoveAdapter);
        frame.add(panel);
    };
}

我看了很多书，但还是做不好，我需要我的形状可以调整大小，可移动等，但同时我想事后保存图像，

Answer 1

我要提出的解决方案远未完成，但我希望它能阐明一些概念，帮助您获得成功。我将构建一个包含两个可移动图像的面板，但将使用应该使此代码更易于维护的模式来实现。

我强烈建议将渲染层（您的 JComponents）和模型层（形状及其位置）分成不同的对象。这被称为 关注点分离 并且在长期运行.

中将使您的生活更轻松

首先让我们定义一个出现在屏幕上的形状。我将保持我的非常简单，并创建一个具有位置、大小和 BufferedImage:

的

class DrawNode
{
    private Rectangle bounds;
    private BufferedImage image;

    public DrawNode()
    {
    }

    public Rectangle getBounds()
    {
        return bounds;
    }

    public void setBounds( Rectangle bounds )
    {
        this.bounds = bounds;
    }

    public BufferedImage getImage()
    {
        return image;
    }

    public void setImage( BufferedImage image )
    {
        this.image = image;
    }
}

接下来，让我们创建一个模型来保存您的形状集合。我们可以对模型做的一件巧妙的事情是让它接受一个侦听器，只要我们的 2D space 的部分变为 "invalidated." 的部分 space 可能变得无效并且需要重新绘制，该侦听器就会被调用如果一个节点之前在一个给定的区域并且已经被移动到一个新的区域。我们还将包括一些辅助方法，用于确定什么形状占据给定的 space，等等。这些辅助方法可以在效率方面得到极大优化，但我的简单版本将使用强力迭代：

class DrawPanelModel
{
    private final List<DrawNode> nodes;
    private final Consumer<Rectangle> invalidAreaListener;

    public DrawPanelModel( Consumer<Rectangle> invalidAreaListener )
    {
        this.invalidAreaListener = invalidAreaListener;
        nodes = new ArrayList<>();
    }

    public void addNode( DrawNode node )
    {
        nodes.add( node );
    }

    public Optional<DrawNode> getNodeForPoint( Point p )
    {
        return nodes.stream()
                .filter( node -> node.getBounds().contains( p ))
                .findFirst();
    }

    public Stream<DrawNode> getNodesInRectangle( Rectangle r )
    {
        return nodes.stream()
                .filter( node -> node.getBounds().intersects( r ));
    }

    public void setNodeLocation( DrawNode node, Point p )
    {
        Rectangle bounds = (Rectangle)node.getBounds().clone();
        bounds.setLocation( p );
        setNodeBounds( node, bounds );
    }

    public void setNodeBounds( DrawNode node, Rectangle bounds )
    {
        Rectangle old = node.getBounds();
        node.setBounds( Objects.requireNonNull( bounds ));

        if ( old == null || !old.equals( bounds ))
        {
            invalidAreaListener.accept( bounds );

            if ( old != null ) {
                invalidAreaListener.accept( old );
            }
        }
    }
}

接下来我们需要一种方法将 shapes/nodes 渲染到屏幕上。我们可以在每次调用 paint(...) 时绘制每个节点，但这不是很有效，因为我们实际上只需要重新绘制无效区域。我们可以通过确保 JComponent 使用双缓冲来保留其余区域： https://docs.oracle.com/javase/7/docs/api/javax/swing/JComponent.html#setDoubleBuffered(boolean)

编辑： 稍作更正：如果要将组件放置在滚动窗格中，双缓冲将主要在涉及滚动时提供好处。我不认为它会影响简单重绘事件的行为。（昨天写的时候累了）

在 Swing 中用于实现此目的的一种常用技术是将 CellRendererPane 与用作渲染器的 JLabel 结合使用。每当我们需要在特定位置绘制节点时，我们可以将所需的图像和大小分配给 JLabel，并让 CellRendererPane 在绘制过程中渲染 JLabel（可能超过一次）在不同的位置。

让我们创建这样一个 JLabel 子类，并为其提供一个辅助方法来从给定节点初始化其状态：

class ShapeRenderer extends JLabel
{
    private static final long serialVersionUID = 1L;

    public ShapeRenderer() {
    }

    public void initFrom( DrawNode node )
    {
        setIcon( new ImageIcon( node.getImage() ));
        setSize( node.getBounds().getSize() );
    }

    // Methods below are overridden as a performance optimization:
    @Override
    public void invalidate() {
    }

    @Override
    public void validate() {
    }

    @Override
    public void revalidate() {
    }

    @Override
    public void repaint( long tm, int x, int y, int width, int height ) {
    }

    @Override
    public void repaint( Rectangle r ) {
    }

    @Override
    public void repaint() {
    }

    @Override
    protected void firePropertyChange( String propertyName, Object oldValue, Object newValue ) {
    }

    @Override
    public void firePropertyChange( String propertyName, boolean oldValue, boolean newValue ) {
    }
}

此时我们还剩下 JComponent 个，让我们创建一个自定义的。我们将给它 DrawPanelModel、CellRendererPane 和我们的 ShapeRenderer。它将作为侦听器订阅模型，调用 repaint(Rectangle) 以响应每当节点移动时模型在区域中失效。请记住，repaint(...) 不会立即绘制，而是安排绘制事件在未来的某个时间点发生。这意味着我们实际上可以移动多个节点，并且 Swing 框架将为我们提供一个绘制事件，该事件将所有无效矩形的联合指定为 Graphic's 剪辑区域。但是，我们的代码并不真正关心无效区域是否合并。如果框架决定为我们无效的每个区域给我们一个绘制事件，我们也可以处理：

class DrawPanel extends JComponent
{
    private static final long serialVersionUID = 1L;

    private final CellRendererPane renderPane;
    private final ShapeRenderer renderer;
    private final DrawPanelModel model;

    public DrawPanel()
    {
        renderPane = new CellRendererPane();
        add( renderPane );
        setDoubleBuffered( true );
        renderer = new ShapeRenderer();
        model = new DrawPanelModel( this::repaint );

        DrawMouseListener listener = new DrawMouseListener();
        addMouseListener( listener );
        addMouseMotionListener( listener );
    }

    public void addNode( BufferedImage image, Point loc )
    {
        DrawNode node = new DrawNode();
        node.setImage( image );
        model.addNode( node );
        model.setNodeBounds( node, new Rectangle( loc, new Dimension( image.getWidth(), image.getHeight() )));
    }

    @Override
    public void doLayout()
    {
        renderPane.setSize( getSize() );
    }

    private void paintBackground( Graphics2D g )
    {
        g.setColor( Color.WHITE );
        g.fill( g.getClip() );
    }

    private void paintNodes( Graphics2D g )
    {
        model.getNodesInRectangle( g.getClipBounds() )
            .forEach( node -> paintNode( node, g ));
    }

    private void paintNode( DrawNode node, Graphics2D g )
    {
        Rectangle r = node.getBounds();
        renderer.initFrom( node );
        renderPane.paintComponent( g, renderer, this, r );
    }

    @Override
    public void paintComponent( Graphics aG )
    {
        Graphics2D g = (Graphics2D)aG.create();
        paintBackground( g );
        paintNodes( g );
    }

    class DrawMouseListener extends MouseAdapter
    {
        private Optional<DrawNode> movingNode;

        public DrawMouseListener()
        {
            movingNode = Optional.empty();
        }

        @Override
        public void mousePressed( MouseEvent e )
        {
            movingNode = model.getNodeForPoint( e.getPoint() );
        }

        @Override
        public void mouseReleased( MouseEvent e )
        {
            movingNode = Optional.empty();
        }

        @Override
        public void mouseDragged( MouseEvent e )
        {
            movingNode.ifPresent( node -> {
                model.setNodeLocation( node, e.getPoint() );
            } );
        }
    }
}

最后，手动测试：

@Test
public void testPanel() throws InvocationTargetException, InterruptedException
{
    SwingUtilities.invokeLater( () -> {

        // Create frame:
        JFrame frame = new JFrame();
        frame.setLayout( new GridLayout( 1, 1 ));

        // Create draw panel:
        DrawPanel drawPanel = new DrawPanel();
        frame.add( drawPanel );

        // Show frame:
        frame.setDefaultCloseOperation( JFrame.EXIT_ON_CLOSE );
        frame.setSize( new Dimension( 1000, 600 ));
        frame.setVisible( true );

        // Create first image:
        BufferedImage image1 = new BufferedImage( 50, 50, BufferedImage.TYPE_INT_ARGB );
        Graphics2D g = image1.createGraphics();
        g.setColor( Color.BLUE );
        g.fillOval( 0, 0, 50, 50 );

        // Add first image to draw panel:
        drawPanel.addNode( image1, new Point( 100, 100 ));

        // Create second image:
        BufferedImage image2 = new BufferedImage( 50, 50, BufferedImage.TYPE_INT_ARGB );
        Graphics2D g2 = image2.createGraphics();
        g2.setColor( Color.RED );
        g2.fillOval( 0, 0, 50, 50 );

        // Add second image to draw panel:
        drawPanel.addNode( image2, new Point( 200, 100 ));
    } );

    Thread.sleep( Long.MAX_VALUE );
}

结果：

Bufferedimage 上的可拖动形状

Dragabble shapes on Buffered Image

java

shapes