【问题标题】:Split image into clickable regions将图像分割成可点击区域
【发布时间】:2023-03-23 20:28:02
【问题描述】:

有什么方法可以将图像拆分为区域(现在是 JLabel,但如果需要我可以更改它)?
我在我的程序中使用了 swing,我有一个图像(本示例为正方形),其中包含一些三角形、星形和梯形(可以是 JPG、PNG 等)。
这个想法是用户将在其中一个形状内单击,然后我将在用户单击的区域顶部放置另一个小图标。用户可以点击多个区域,但归根结底,我需要知道点击了哪些形状。

似乎有人可以?

【问题讨论】:

  • 您是否已经知道如何将大图像分割成精灵(每个单独的形状)?如果是这样,它应该相当容易。只需将子图像用作GridLayout 切换按钮的图标即可。所以答案是“是的,这似乎是可能的”。

标签: java image swing jlabel java-2d


【解决方案1】:

看看我做了什么:

这是我用于测试的图像:

图像分割后:

这里是来源:

import java.awt.Graphics2D;
import java.awt.GridLayout;
import java.awt.Toolkit;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.FileInputStream;
import java.io.FileNotFoundException;
import java.io.IOException;
import java.util.logging.Level;
import java.util.logging.Logger;
import javax.imageio.ImageIO;
import javax.swing.ImageIcon;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.SwingUtilities;

public class Test {

    private JFrame frame;
    private JLabel[] labels;
    private static String imagePath = "c:/test.jpg";
    private final int rows = 3; //You should decide the values for rows and cols variables
    private final int cols = 3;
    private final int chunks = rows * cols;
    private final int SPACING = 10;//spacing between split images

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

            @Override
            public void run() {
                new Test().createAndShowUI();
            }
        });
    }

    private void createAndShowUI() {
        frame = new JFrame("Test");
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        initComponents();
        frame.setResizable(false);
        frame.pack();
        frame.setVisible(true);
    }

    private void initComponents() {

        BufferedImage[] imgs = getImages();

        //set contentpane layout for grid
        frame.getContentPane().setLayout(new GridLayout(rows, cols, SPACING, SPACING));

        labels = new JLabel[imgs.length];

        //create JLabels with split images and add to frame contentPane
        for (int i = 0; i < imgs.length; i++) {
            labels[i] = new JLabel(new ImageIcon(Toolkit.getDefaultToolkit().createImage(imgs[i].getSource())));
            frame.getContentPane().add(labels[i]);
        }
    }

    private BufferedImage[] getImages() {
        File file = new File(imagePath); // I have bear.jpg in my working directory
        FileInputStream fis = null;
        try {
            fis = new FileInputStream(file);
        } catch (FileNotFoundException ex) {
            Logger.getLogger(Test.class.getName()).log(Level.SEVERE, null, ex);
        }
        BufferedImage image = null;
        try {
            image = ImageIO.read(fis); //reading the image file
        } catch (IOException ex) {
            Logger.getLogger(Test.class.getName()).log(Level.SEVERE, null, ex);
        }
        int chunkWidth = image.getWidth() / cols; // determines the chunk width and height
        int chunkHeight = image.getHeight() / rows;
        int count = 0;
        BufferedImage imgs[] = new BufferedImage[chunks]; //Image array to hold image chunks
        for (int x = 0; x < rows; x++) {
            for (int y = 0; y < cols; y++) {
                //Initialize the image array with image chunks
                imgs[count] = new BufferedImage(chunkWidth, chunkHeight, image.getType());

                // draws the image chunk
                Graphics2D gr = imgs[count++].createGraphics();
                gr.drawImage(image, 0, 0, chunkWidth, chunkHeight, chunkWidth * y, chunkHeight * x, chunkWidth * y + chunkWidth, chunkHeight * x + chunkHeight, null);
                gr.dispose();
            }
        }
        return imgs;
    }
}

唯一的缺陷是我没有检查图像是否大于可能导致问题的屏幕,这将通过在图像上使用 getScaledInstance(int x,int y, int width, in height) 进行简单的图像调整大小并将其分成块来解决。

更新

抱歉,我错过了 Shapes 中的问题,请查看 Graphics2D/Graphicsdraw(Shape s) 方法。

我读到了:

任何 Shape 对象都可以用作限制 将被渲染的绘图区域的一部分。剪辑路径 是Graphics2D 上下文的一部分;要设置剪辑属性,您调用 Graphics2D.setClip 并传入定义剪辑的形状 您要使用的路径。

查看此处了解如何将 u] 图像裁剪为形状:Clipping the Drawing Region

参考资料:

【讨论】:

  • 我应该在哪里改变它,所以这些图像之间没有差距?,对不起菜鸟问题
【解决方案2】:

可以使用BufferedImagegetSubImage()方法,图解herehere。该示例还使用了JLabel,但您可以将Icon 添加到可以单击的JButton。按钮可以通过多种方式记住其图标的详细信息:

  • 子类JButton 并添加合适的字段。
  • 将客户端属性添加到父 JComponent
  • 使用父 Componentname 属性。

【讨论】:

    猜你喜欢
    • 2015-12-01
    • 2011-05-18
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-07-12
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多