首页 > 解决方案 > 显示 base64 编码的图像

问题描述

我在文本/html JTextPane 中集成图像时遇到问题。JTextPane 使用以下文本初始化:

<html>
  <head>
    <style type="text/css">
    </style>
  </head>
  <body>
  </body>
</html>

我插入文本:

kit.insertHTML(doc, doc.getLength(), "<b>" + string + "</b><br>" , 0, 0, HTML.Tag.B);

以这种方式插入的所有文本都可以正确显示,但是当我尝试插入 base64 编码的图像时:

kit.insertHTML(doc,doc.getLength(), "<img src=\"data:image/jpeg;base64," + base64Code + "\"/>", 0, 0, HTML.Tag.IMG);

我只有一个占位符图像。尝试使用正常的源路径时,它起作用了。然而,在线获取 base64 代码并使用它也得到了一个占位符图像,而完全相同的代码在 w3school.com 的 HTML tryit 编辑器上工作。

标签: javahtmljtextpane

解决方案


当 aJTextPane看到一个<img>标签时,它会检查图像是否存在于缓存中,如果不存在,它会尝试从 url 中读取图像。使用的 html 库JTextPane不支持<img>标签中的 base64 编码图像数据,因此我们需要以不同的方式进行处理。

事实证明,我们可以手动将图像添加到图像缓存中。这可以用来选择一些其他无效的 url 并为其分配一个图像。


让我们将图像添加到缓存中并以JTextPane!

首先,您要将图像转换为BufferedImage. 这可以使用ImageIO类来完成。

byte[] imgBytes = decodeBase64(base64Code);
BufferedImage img = ImageIO.read(new ByteArrayInputStream(imgBytes));

请注意,这里我们需要原始图像字节,而不是 base64 编码。如果您正在从文件中读取图像,则可以将 a 传递Fileread函数而不是输入流。


现在我们将图像作为BufferedImage,我们可以编写一个将其添加到缓存的函数。

@SuppressWarnings({ "rawtypes", "unchecked" })
public static String saveImageToCache(JTextPane pane, BufferedImage img, String name) throws MalformedURLException {
    Dictionary cache = (Dictionary) pane.getDocument().getProperty("imageCache");
    if (cache == null) {
        // No cache exists, so create a new one.
        cache = new Hashtable();
        pane.getDocument().putProperty("imageCache", cache);
    }
    String url = "http:\\buffered/" + name;
    cache.put(new URL(url), img);
    return url;
}

请注意,我在 和 上禁止了一些关于类型参数的Dictionary警告Hashtable。通常应该避免这种情况,但在这种情况下,我们处理 Swing 废话的方式是可以抑制警告。

此方法本质上是选择一些无效的 url 并将图像存储在该 url 中。

注意name论点。这将是 url 的一部分,如果您尝试将与前一个图像同名的图像存储到缓存中,这将替换前一个图像。避免在此名称中使用疯狂字符,因为如果它不是有效的 url ,new Url(url)可能会抛出 a 。MalformedURLException


我们现在可以将它与JTextPane.

BufferedImage img = ...;

JTextPane pane = new JTextPane();
pane.setContentType("text/html");

String url = saveImageToCache(pane, img, "image1");

pane.setText("<html><body><img src=\"" + url + "\"></body></html>");

JFrame frame = new JFrame("image test");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.getContentPane().add(pane);
frame.setSize(img.getWidth(), img.getHeight());
frame.setLocationRelativeTo(null);
frame.setVisible(true);

请注意,您必须setContentType在将图像添加到缓存之前调用,因为该方法会清除缓存。此外,重要的是在setText调用之前将图像添加到缓存中,以确保在 swing 需要之前添加图像。

如果使用以前已知的名称更改缓存中的图像,saveImageToCache则需要以JTextPane某种方式更新,例如调用setText.


如果您有很多图像,您可能希望在不再需要它们时将它们从缓存中删除,以避免过多的内存使用。一种方法是定义一个如下所示的函数,该函数从缓存中删除图像。

@SuppressWarnings({ "rawtypes" })
public static void removeImageFromCache(JTextPane pane, String name) throws MalformedURLException {
    Dictionary cache = (Dictionary) pane.getDocument().getProperty("imageCache");
    if (cache == null) {
        // There is no cache, so the image is not in the cache.
        return;
    }
    String url = "http:\\buffered/" + name;
    cache.remove(new URL(url));
}

您还可以通过调用setContentType或将 替换JTextPane为新对象来清除缓存。这是因为缓存存储在JTextPane.


推荐阅读