SVG 到位图到 ImageView
SVG to Bitmap to ImageView
在我的 android 应用程序中，我尝试从 SVG 文件中获取位图对象并将其存储在缓存中。然后它应该从这个位图中的 ImageView 对象中显示出来。我无法正常工作，要么是 ImageView 的密度错误，要么是图片太小或太大。有人可以告诉我该代码有什么问题吗？出于我的目的，我使用 AndroidSVG 库 (link)。图片的宽度和高度应为 30dp。
ImageView img = (ImageView)getView().findViewById(R.id.testingImage);
try {
int size = convertDPtoPixels(30);
SVG svg = SVG.getFromResource(mGlob.mContext,R.raw.vectorimage);
svg.setDocumentHeight(size);
svg.setDocumentWidth(size);
PictureDrawable pictureDrawable = new PictureDrawable(svg.renderToPicture());
Bitmap mutableBitmap = Bitmap.createBitmap(30, 30, Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(mutableBitmap);
pictureDrawable.setBounds(0,0,size,size);
pictureDrawable.draw(canvas);
img.setImageBitmap(mutableBitmap);
} catch (SVGParseException e) {
e.printStackTrace();
}
编辑 2015 年 3 月 30 日
如果我尝试用这样的像素大小创建位图，我得到的图像太小（但很清晰）：
Bitmap mutableBitmap = Bitmap.createBitmap(size, size, Bitmap.Config.ARGB_8888);
补充信息：
蓝色是背景色，来自我的 ImageView。我用它来查看它的起点和终点，因为我的 SVG 具有透明表面。 SVG 应填充蓝色区域...
这是我的 SVG 文件：
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="30"
height="30"
id="svg15733"
version="1.1"
inkscape:version="0.91 r13725"
sodipodi:docname="vectorimage.svg">
<defs
id="defs15735" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="9.1"
inkscape:cx="21.063016"
inkscape:cy="17.702822"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="false"
inkscape:window-width="1366"
inkscape:window-height="715"
inkscape:window-x="-8"
inkscape:window-y="-8"
inkscape:window-maximized="1"
borderlayer="true"
inkscape:showpageshadow="false" />
<metadata
id="metadata15738">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Ebene 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,-1022.3622)">
<path
style="fill:#ffe71d;fill-opacity:1;stroke:#000000;stroke-width:0.3515625;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none"
d="m 20.507812,1023.827 8.027344,8.0274 0,11.4258 -8.027344,7.6172 -11.4257807,0 -7.6171876,-7.6172 0,-11.4258 7.6171876,-8.0274 z"
id="Auswahl"
inkscape:connector-curvature="0"
sodipodi:nodetypes="ccccccccc" />
<flowRoot
xml:space="preserve"
id="flowRoot16280"
style="font-style:normal;font-weight:normal;font-size:72px;line-height:125%;font-family:Sans;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"><flowRegion
id="flowRegion16282"><rect
id="rect16284"
width="123.23861"
height="98.994949"
x="171.72594"
y="179.65981" /></flowRegion><flowPara
id="flowPara16286" /></flowRoot> <text
xml:space="preserve"
style="font-style:normal;font-weight:normal;font-size:4.21875px;line-height:125%;font-family:Sans;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none"
x="6.8066916"
y="1049.5211"
id="text16288"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan16290"
x="6.8066916"
y="1049.5211"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:31.46484184px;font-family:Tahoma;-inkscape-font-specification:'Tahoma Bold'">?</tspan></text>
<path
transform="translate(0,540.3622)"
style="display:inline;fill:#000000;fill-opacity:0.09958508;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 9.0820313,483.46484 -4.048462,4.26636 21.1303707,17.43713 2.371216,-2.25036 0,-11.42578 -8.027344,-8.02735 -11.4257807,0 z"
id="path16293"
inkscape:connector-curvature="0" />
<path
transform="translate(0,540.3622)"
style="display:inline;fill:#000000;fill-opacity:0.06639003;stroke:none;stroke-width:6;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none"
d="m 9.0820313,483.46484 -7.6171876,8.02735 0,7.68493 25.0598143,-9.69543 -6.016846,-6.01685 -11.4257807,0 z"
id="path16295"
inkscape:connector-curvature="0" />
</g>
</svg>
您似乎将 SVG 渲染为 30x30 位图，然后将其缩放到（大小 x 大小）。
尝试将位图创建更改为：
Bitmap mutableBitmap = Bitmap.createBitmap(size, size, Bitmap.Config.ARGB_8888);
更新：
问题是 Inkscape 不会自动给它的 SVG 文件一个viewBox。
阅读有关如何处理 Inkscape 文件的 AndroidSVG 常见问题解答。 https://code.google.com/p/androidsvg/wiki/FAQ#Dealing_with_Inkscape_files
您可以按照那里的建议（在运行时以编程方式更新 SVG）。或者，手动更改 SVG。进行以下更改：
width="100%"
height="100%"
viewBox="0 0 30 30"
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="100%"
height="100%"
id="svg15733"
version="1.1"
inkscape:version="0.91 r13725"
sodipodi:docname="vectorimage.svg"
viewBox="0 0 30 30">
<defs
id="defs15735" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="9.1"
inkscape:cx="21.063016"
inkscape:cy="17.702822"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="false"
inkscape:window-width="1366"
inkscape:window-height="715"
inkscape:window-x="-8"
inkscape:window-y="-8"
inkscape:window-maximized="1"
borderlayer="true"
inkscape:showpageshadow="false" />
<metadata
id="metadata15738">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Ebene 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,-1022.3622)">
<path
style="fill:#ffe71d;fill-opacity:1;stroke:#000000;stroke-width:0.3515625;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none"
d="m 20.507812,1023.827 8.027344,8.0274 0,11.4258 -8.027344,7.6172 -11.4257807,0 -7.6171876,-7.6172 0,-11.4258 7.6171876,-8.0274 z"
id="Auswahl"
inkscape:connector-curvature="0"
sodipodi:nodetypes="ccccccccc" />
<flowRoot
xml:space="preserve"
id="flowRoot16280"
style="font-style:normal;font-weight:normal;font-size:72px;line-height:125%;font-family:Sans;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"><flowRegion
id="flowRegion16282"><rect
id="rect16284"
width="123.23861"
height="98.994949"
x="171.72594"
y="179.65981" /></flowRegion><flowPara
id="flowPara16286" /></flowRoot> <text
xml:space="preserve"
style="font-style:normal;font-weight:normal;font-size:4.21875px;line-height:125%;font-family:Sans;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none"
x="6.8066916"
y="1049.5211"
id="text16288"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan16290"
x="6.8066916"
y="1049.5211"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:31.46484184px;font-family:Tahoma;-inkscape-font-specification:'Tahoma Bold'">?</tspan></text>
<path
transform="translate(0,540.3622)"
style="display:inline;fill:#000000;fill-opacity:0.09958508;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 9.0820313,483.46484 -4.048462,4.26636 21.1303707,17.43713 2.371216,-2.25036 0,-11.42578 -8.027344,-8.02735 -11.4257807,0 z"
id="path16293"
inkscape:connector-curvature="0" />
<path
transform="translate(0,540.3622)"
style="display:inline;fill:#000000;fill-opacity:0.06639003;stroke:none;stroke-width:6;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none"
d="m 9.0820313,483.46484 -7.6171876,8.02735 0,7.68493 25.0598143,-9.69543 -6.016846,-6.01685 -11.4257807,0 z"
id="path16295"
inkscape:connector-curvature="0" />
</g>
</svg>
在我的 android 应用程序中，我尝试从 SVG 文件中获取位图对象并将其存储在缓存中。然后它应该从这个位图中的 ImageView 对象中显示出来。我无法正常工作，要么是 ImageView 的密度错误，要么是图片太小或太大。有人可以告诉我该代码有什么问题吗？出于我的目的，我使用 AndroidSVG 库 (link)。图片的宽度和高度应为 30dp。
ImageView img = (ImageView)getView().findViewById(R.id.testingImage);
try {
int size = convertDPtoPixels(30);
SVG svg = SVG.getFromResource(mGlob.mContext,R.raw.vectorimage);
svg.setDocumentHeight(size);
svg.setDocumentWidth(size);
PictureDrawable pictureDrawable = new PictureDrawable(svg.renderToPicture());
Bitmap mutableBitmap = Bitmap.createBitmap(30, 30, Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(mutableBitmap);
pictureDrawable.setBounds(0,0,size,size);
pictureDrawable.draw(canvas);
img.setImageBitmap(mutableBitmap);
} catch (SVGParseException e) {
e.printStackTrace();
}
编辑 2015 年 3 月 30 日
如果我尝试用这样的像素大小创建位图，我得到的图像太小（但很清晰）：
Bitmap mutableBitmap = Bitmap.createBitmap(size, size, Bitmap.Config.ARGB_8888);
补充信息：
蓝色是背景色，来自我的 ImageView。我用它来查看它的起点和终点，因为我的 SVG 具有透明表面。 SVG 应填充蓝色区域...
这是我的 SVG 文件：
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="30"
height="30"
id="svg15733"
version="1.1"
inkscape:version="0.91 r13725"
sodipodi:docname="vectorimage.svg">
<defs
id="defs15735" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="9.1"
inkscape:cx="21.063016"
inkscape:cy="17.702822"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="false"
inkscape:window-width="1366"
inkscape:window-height="715"
inkscape:window-x="-8"
inkscape:window-y="-8"
inkscape:window-maximized="1"
borderlayer="true"
inkscape:showpageshadow="false" />
<metadata
id="metadata15738">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Ebene 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,-1022.3622)">
<path
style="fill:#ffe71d;fill-opacity:1;stroke:#000000;stroke-width:0.3515625;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none"
d="m 20.507812,1023.827 8.027344,8.0274 0,11.4258 -8.027344,7.6172 -11.4257807,0 -7.6171876,-7.6172 0,-11.4258 7.6171876,-8.0274 z"
id="Auswahl"
inkscape:connector-curvature="0"
sodipodi:nodetypes="ccccccccc" />
<flowRoot
xml:space="preserve"
id="flowRoot16280"
style="font-style:normal;font-weight:normal;font-size:72px;line-height:125%;font-family:Sans;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"><flowRegion
id="flowRegion16282"><rect
id="rect16284"
width="123.23861"
height="98.994949"
x="171.72594"
y="179.65981" /></flowRegion><flowPara
id="flowPara16286" /></flowRoot> <text
xml:space="preserve"
style="font-style:normal;font-weight:normal;font-size:4.21875px;line-height:125%;font-family:Sans;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none"
x="6.8066916"
y="1049.5211"
id="text16288"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan16290"
x="6.8066916"
y="1049.5211"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:31.46484184px;font-family:Tahoma;-inkscape-font-specification:'Tahoma Bold'">?</tspan></text>
<path
transform="translate(0,540.3622)"
style="display:inline;fill:#000000;fill-opacity:0.09958508;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 9.0820313,483.46484 -4.048462,4.26636 21.1303707,17.43713 2.371216,-2.25036 0,-11.42578 -8.027344,-8.02735 -11.4257807,0 z"
id="path16293"
inkscape:connector-curvature="0" />
<path
transform="translate(0,540.3622)"
style="display:inline;fill:#000000;fill-opacity:0.06639003;stroke:none;stroke-width:6;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none"
d="m 9.0820313,483.46484 -7.6171876,8.02735 0,7.68493 25.0598143,-9.69543 -6.016846,-6.01685 -11.4257807,0 z"
id="path16295"
inkscape:connector-curvature="0" />
</g>
</svg>
您似乎将 SVG 渲染为 30x30 位图，然后将其缩放到（大小 x 大小）。
尝试将位图创建更改为：
Bitmap mutableBitmap = Bitmap.createBitmap(size, size, Bitmap.Config.ARGB_8888);
更新：
问题是 Inkscape 不会自动给它的 SVG 文件一个viewBox。
阅读有关如何处理 Inkscape 文件的 AndroidSVG 常见问题解答。 https://code.google.com/p/androidsvg/wiki/FAQ#Dealing_with_Inkscape_files
您可以按照那里的建议（在运行时以编程方式更新 SVG）。或者，手动更改 SVG。进行以下更改：
width="100%"
height="100%"
viewBox="0 0 30 30"
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="100%"
height="100%"
id="svg15733"
version="1.1"
inkscape:version="0.91 r13725"
sodipodi:docname="vectorimage.svg"
viewBox="0 0 30 30">
<defs
id="defs15735" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="9.1"
inkscape:cx="21.063016"
inkscape:cy="17.702822"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="false"
inkscape:window-width="1366"
inkscape:window-height="715"
inkscape:window-x="-8"
inkscape:window-y="-8"
inkscape:window-maximized="1"
borderlayer="true"
inkscape:showpageshadow="false" />
<metadata
id="metadata15738">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Ebene 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,-1022.3622)">
<path
style="fill:#ffe71d;fill-opacity:1;stroke:#000000;stroke-width:0.3515625;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none"
d="m 20.507812,1023.827 8.027344,8.0274 0,11.4258 -8.027344,7.6172 -11.4257807,0 -7.6171876,-7.6172 0,-11.4258 7.6171876,-8.0274 z"
id="Auswahl"
inkscape:connector-curvature="0"
sodipodi:nodetypes="ccccccccc" />
<flowRoot
xml:space="preserve"
id="flowRoot16280"
style="font-style:normal;font-weight:normal;font-size:72px;line-height:125%;font-family:Sans;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"><flowRegion
id="flowRegion16282"><rect
id="rect16284"
width="123.23861"
height="98.994949"
x="171.72594"
y="179.65981" /></flowRegion><flowPara
id="flowPara16286" /></flowRoot> <text
xml:space="preserve"
style="font-style:normal;font-weight:normal;font-size:4.21875px;line-height:125%;font-family:Sans;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none"
x="6.8066916"
y="1049.5211"
id="text16288"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan16290"
x="6.8066916"
y="1049.5211"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:31.46484184px;font-family:Tahoma;-inkscape-font-specification:'Tahoma Bold'">?</tspan></text>
<path
transform="translate(0,540.3622)"
style="display:inline;fill:#000000;fill-opacity:0.09958508;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 9.0820313,483.46484 -4.048462,4.26636 21.1303707,17.43713 2.371216,-2.25036 0,-11.42578 -8.027344,-8.02735 -11.4257807,0 z"
id="path16293"
inkscape:connector-curvature="0" />
<path
transform="translate(0,540.3622)"
style="display:inline;fill:#000000;fill-opacity:0.06639003;stroke:none;stroke-width:6;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none"
d="m 9.0820313,483.46484 -7.6171876,8.02735 0,7.68493 25.0598143,-9.69543 -6.016846,-6.01685 -11.4257807,0 z"
id="path16295"
inkscape:connector-curvature="0" />
</g>
</svg>