[widgets/arrows] Fix viewBox size and naturalSize in SvgItems

The viewBox wasn't right, which made the values reported by naturalSize.width and naturalSize.height extremely small.

If you start an SVG from certain templates in Inkscape and then convert the units to px, the viewBox gets messed up. It won't look messed up in Inkscape because everything will appear scaled correctly, but it's actually roughly 26% of the size it should be. In order to fix this, you need to set the document scale to 1.0 which will cause all of the elements in the SVG to shrink to the size they really were. Then, you need to scale all the elements back up to their original sizes.
This commit is contained in:
Noah Davis 2021-03-31 01:37:00 -04:00
parent aeb21cb68d
commit a9ed527663

View File

@ -1,8 +1,7 @@
<?xml version="1.0"?>
<!-- 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="44" height="44" viewBox="0 0 11.641666 11.641667" id="svg2" version="1.1" inkscape:version="0.91 r13725" sodipodi:docname="arrows.svgz">
<defs id="defs4">
<style type="text/css" id="current-color-scheme">
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="44" height="44" viewBox="0 0 44 44" id="svg2" version="1.1" inkscape:version="1.1-alpha (db535a56c6, 2021-02-18, custom)" sodipodi:docname="arrows.svg" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:cc="http://creativecommons.org/ns#">
<defs id="defs4">
<style type="text/css" id="current-color-scheme">
.ColorScheme-Text {
color:#31363b;
stop-color:#31363b;
@ -48,35 +47,31 @@
stop-color:#3daee9;
}
</style>
</defs>
<sodipodi:namedview id="base" pagecolor="#ffffff" bordercolor="#c90303" borderopacity="1" inkscape:pageopacity="0" inkscape:pageshadow="2" inkscape:zoom="11.352941" inkscape:cx="25.658614" inkscape:cy="22.601166" inkscape:document-units="px" inkscape:current-layer="layer1" showgrid="true" units="px" inkscape:showpageshadow="false" borderlayer="true" inkscape:window-width="2560" inkscape:window-height="957" inkscape:window-x="0" inkscape:window-y="30" inkscape:window-maximized="1" fit-margin-top="0" fit-margin-left="0" fit-margin-right="0" fit-margin-bottom="0">
<inkscape:grid type="xygrid" id="grid4160" empspacing="2" originx="-11.641648" originy="-23.812464"/>
</sodipodi:namedview>
<metadata id="metadata7">
<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/>
</cc:Work>
</rdf:RDF>
</metadata>
<g inkscape:label="Capa 1" inkscape:groupmode="layer" id="layer1" transform="translate(-11.641649,-261.54584)">
<g id="up-arrow" transform="translate(-1.3769874e-5,6.6146114)">
<rect transform="matrix(0,1,1,0,0,0)" y="15.610413" x="254.93123" height="3.7041664" width="3.7041669" id="rect4241" style="opacity:1;fill:none;fill-opacity:1;stroke:none;stroke-width:0.03741773;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"/>
<path inkscape:connector-curvature="0" id="path4148" d="m 17.462495,256.25414 -1.058333,1.05833 2.116667,0 -1.058334,-1.05833 z" style="fill:currentColor;fill-rule:evenodd;stroke:none;stroke-width:0.26458335px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" class="ColorScheme-Text"/>
</defs>
<sodipodi:namedview id="base" pagecolor="#ffffff" bordercolor="#c90303" borderopacity="1" inkscape:pageopacity="0" inkscape:pageshadow="2" inkscape:zoom="11.352941" inkscape:cx="25.658614" inkscape:cy="22.601166" inkscape:document-units="px" inkscape:current-layer="layer1" showgrid="true" units="px" inkscape:showpageshadow="false" borderlayer="true" inkscape:window-width="2560" inkscape:window-height="957" inkscape:window-x="0" inkscape:window-y="30" inkscape:window-maximized="1" fit-margin-top="0" fit-margin-left="0" fit-margin-right="0" fit-margin-bottom="0" objecttolerance="10.0" gridtolerance="10.0" guidetolerance="10.0" inkscape:pagecheckerboard="0" scale-x="1">
<inkscape:grid type="xygrid" id="grid4160" empspacing="2" originx="-11.641648" originy="-23.812464" />
</sodipodi:namedview>
<metadata id="metadata7">
<rdf:RDF>
<cc:Work rdf:about="" />
</rdf:RDF>
</metadata>
<g inkscape:label="Capa 1" inkscape:groupmode="layer" id="layer1" transform="translate(-11.641649,-261.54584)">
<g id="up-arrow" transform="matrix(3.77952604683,0,0,3.77952604683,-32.3583176601,-701.973378749)" style="stroke-width:0.264583">
<rect transform="matrix(0,1,1,0,0,0)" y="15.6104125977" x="254.931228638" height="3.70416641235" width="3.70416688919" id="rect4241" style="opacity:1;fill:none;fill-opacity:1;stroke:none;stroke-width:0.0099001;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" />
<path inkscape:connector-curvature="0" id="path4148" d="m 17.462495,256.25414 -1.058333,1.05833 h 2.116667 z" style="fill:currentColor;fill-rule:evenodd;stroke:none;stroke-width:0.0700043px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" class="ColorScheme-Text" />
</g>
<g id="down-arrow" transform="matrix(3.77952604683,0,0,-3.77952604683,-32.3583185612,1269.06505882)" style="stroke-width:0.264583">
<rect style="opacity:1;fill:none;fill-opacity:1;stroke:none;stroke-width:0.0099001;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" id="rect4162" width="3.70416712761" height="3.70416688919" x="254.931228638" y="15.6104125977" transform="matrix(0,1,1,0,0,0)" />
<path style="fill:currentColor;fill-rule:evenodd;stroke:none;stroke-width:0.0700043px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" d="m 17.462495,256.25414 -1.058333,1.05833 h 2.116667 z" id="path4164" inkscape:connector-curvature="0" class="ColorScheme-Text" />
</g>
<g id="right-arrow" transform="matrix(0,3.77952604683,-3.77952604683,0,1019.16083492,217.545882697)" style="stroke-width:0.264583">
<rect style="opacity:1;fill:none;fill-opacity:1;stroke:none;stroke-width:0.0099001;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" id="rect4168" width="3.70416688919" height="3.70416641235" x="254.931228638" y="15.6104125977" transform="matrix(0,1,1,0,0,0)" />
<path style="fill:currentColor;fill-rule:evenodd;stroke:none;stroke-width:0.0700043px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" d="m 17.462495,256.25414 -1.058333,1.05833 h 2.116667 z" id="path4170" inkscape:connector-curvature="0" class="ColorScheme-Text" />
</g>
<g transform="matrix(0,3.77952604683,3.77952604683,0,-951.877570149,217.545882697)" id="left-arrow" style="stroke-width:0.264583">
<rect transform="matrix(0,1,1,0,0,0)" y="15.6104125977" x="254.931228638" height="3.70416641235" width="3.70416688919" id="rect4174" style="opacity:1;fill:none;fill-opacity:1;stroke:none;stroke-width:0.0099001;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" />
<path inkscape:connector-curvature="0" id="path4176" d="m 17.462495,256.25414 -1.058333,1.05833 h 2.116667 z" style="fill:currentColor;fill-rule:evenodd;stroke:none;stroke-width:0.0700043px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" class="ColorScheme-Text" />
</g>
</g>
<g id="down-arrow" transform="matrix(1,0,0,-1,-1.4008293e-5,528.11874)">
<rect style="opacity:1;fill:none;fill-opacity:1;stroke:none;stroke-width:0.03741773;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" id="rect4162" width="3.7041671" height="3.7041669" x="254.93123" y="15.610413" transform="matrix(0,1,1,0,0,0)"/>
<path style="fill:currentColor;fill-rule:evenodd;stroke:none;stroke-width:0.26458335px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" d="m 17.462495,256.25414 -1.058333,1.05833 2.116667,0 -1.058334,-1.05833 z" id="path4164" inkscape:connector-curvature="0" class="ColorScheme-Text"/>
</g>
<g id="right-arrow" transform="matrix(0,1,-1,0,278.21454,249.90418)">
<rect style="opacity:1;fill:none;fill-opacity:1;stroke:none;stroke-width:0.03741773;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" id="rect4168" width="3.7041669" height="3.7041664" x="254.93123" y="15.610413" transform="matrix(0,1,1,0,0,0)"/>
<path style="fill:currentColor;fill-rule:evenodd;stroke:none;stroke-width:0.26458335px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" d="m 17.462495,256.25414 -1.058333,1.05833 2.116667,0 -1.058334,-1.05833 z" id="path4170" inkscape:connector-curvature="0" class="ColorScheme-Text"/>
</g>
<g transform="matrix(0,1,1,0,-243.28958,249.90418)" id="left-arrow">
<rect transform="matrix(0,1,1,0,0,0)" y="15.610413" x="254.93123" height="3.7041664" width="3.7041669" id="rect4174" style="opacity:1;fill:none;fill-opacity:1;stroke:none;stroke-width:0.03741773;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"/>
<path inkscape:connector-curvature="0" id="path4176" d="m 17.462495,256.25414 -1.058333,1.05833 2.116667,0 -1.058334,-1.05833 z" style="fill:currentColor;fill-rule:evenodd;stroke:none;stroke-width:0.26458335px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" class="ColorScheme-Text"/>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 5.5 KiB

After

Width:  |  Height:  |  Size: 5.7 KiB