蜡染没有呈现正确的字体颜色？

提问者：小点点

蜡染没有呈现正确的字体颜色？

我正在使用Apache BatikJava库将. svg矢量图像文件转换为.png文件。问题是生成的.png图像的字体颜色都变黑了。这是我用来进行转换的代码：

import java.io.ByteArrayInputStream;
import java.io.ByteArrayOutputStream;

import org.apache.batik.transcoder.TranscoderInput;
import org.apache.batik.transcoder.TranscoderOutput;
import org.apache.batik.transcoder.image.PNGTranscoder;

public class SVGHelperDesktop extends SVGHelper {
    @Override
    public byte[] convertSvgToPng(String svgXml, float png_width)
            throws SVGConversionException {
        byte[] resultPngBytes = null;

        try {
            ByteArrayInputStream inputSvgBytes = new 
                    ByteArrayInputStream(svgXml.getBytes());
            TranscoderInput input_svg_image = new 
                    TranscoderInput(inputSvgBytes);

            ByteArrayOutputStream outputPngBytes = new ByteArrayOutputStream();
            TranscoderOutput output_png_image = new TranscoderOutput(outputPngBytes);

            PNGTranscoder svgToPngConverter = new PNGTranscoder(); 
            svgToPngConverter.addTranscodingHint(PNGTranscoder.KEY_WIDTH, png_width);
            svgToPngConverter.transcode(input_svg_image, output_png_image);

            resultPngBytes = outputPngBytes.toByteArray();

            outputPngBytes.flush();
            outputPngBytes.close(); 
        } catch (Exception e) {
            throw new SVGConversionException("Error converting SVG to PNG", e);
        }

        return resultPngBytes;
    }
}

在同一个. svg文件上使用AndroidSVG库生成具有正确颜色的正确.png图像。

另一个注意事项；使用inkscape（我用来创建矢量图形的程序）的默认字体解决了这个问题。使用任何其他字体脸都会导致蜡染将其颜色更改为黑色。

这是我的SVG文件的链接。

共2个答案

匿名用户

Inkscape在与自定义字体文本关联的style属性中添加了自定义CSS属性-inkscape-font-规范。以下是摘录：

style="...;-inkscape-font-specification:'Aharoni, Bold';..."

已知的Batikbug阻止呈现以连字符（-）开头的CSS属性。

一个简单的修复方法是编辑文件，然后删除“-inkscape-font-规范”属性。

或者，您可以使用Batik的API创建一个新的CSS样式解析器，删除有问题的CSS样式类。例如：

  /**
   * <a href="https://issues.apache.org/jira/browse/BATIK-1112">Bug fix</a>
   */
  public static final class InkscapeCssParser extends Parser {
    public void parseStyleDeclaration( final String source )
      throws CSSException, IOException {
      super.parseStyleDeclaration(
        source.replaceAll( "-inkscape-font-specification:[^;\"]*;", "" )
      );
    }
  }

  static {
    XMLResourceDescriptor.setCSSParserClassName(
      InkscapeCssParser.class.getName()
    );
  }

匿名用户

公认的答案非常有用地指向蜡染bug1112，表明“-inkscape-font-规范”没有正确解析。bug报告有一个解决方法，它通过重新实现Batik的CSS解析器的一部分来工作。为了扩展这一点并使其在这里可用，这里是我的简化和天真版本的解决方法。

首先，需要一个CSS解析器类来覆盖Batik中的解析器类：

import org.apache.batik.css.parser.ExtendedParser;
import org.apache.batik.css.parser.Parser;
import org.w3c.css.sac.CSSException;
import java.io.IOException;

public class InkscapeCssParser extends Parser {
    public void parseStyleDeclaration(String source)
            throws CSSException, IOException {
        source = source.replaceAll(";-inkscape", ";inkscape");
        super.parseStyleDeclaration(source);
    }
}

请注意，source参数是特定SVG元素的CSS样式，而不是完整的SVG源代码。

虽然Batikbug中提供的解决方法重新实现了一大块parseStyle声明，但我只是做了一个简单的字符串替换来消除"；"之后的冒犯"-"，因为这是问题的核心。

要使用它，请在加载文档之前设置CSS解析器类名：

JSVGCanvas mSvgCanvas;
XMLResourceDescriptor.setCSSParserClassName(InkscapeCssParser.class.getName());
mSvgCanvas.setURI(svgUrl.toString());