Xamrin XamSVG在Android上形成:一些图像没有在Marshmallow中显示

时间:2017-02-28 15:50:34

标签: android svg xamarin.forms

部分用户将其设备升级为Marshmallow。自那次升级以来,我的应用程序只显示了一些SVG图像。

以下是我在Lollipop和Marshmallow版本的Android上测试的示例应用程序的MainPage的XAML代码:

    <?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:TestXamSVGMarshmallow"
             xmlns:svg="clr-namespace:XamSvg.XamForms;assembly=XamSvg.XamForms"
             x:Class="TestXamSVGMarshmallow.MainPage">
  <StackLayout>
    <svg:SvgImage Svg="res:Views.Images.Connect" HeightRequest="40" HorizontalOptions="Center" VerticalOptions="Center"/>
    <svg:SvgImage Svg="res:Views.Images.LoadMeasurement" HeightRequest="40" HorizontalOptions="Center" VerticalOptions="Center"/>
    <svg:SvgImage Svg="res:Views.Images.SendData" HeightRequest="40" HorizontalOptions="Center" VerticalOptions="Center"/>
    <svg:SvgImage Svg="res:Views.Images.SendEMail" HeightRequest="40" HorizontalOptions="Center" VerticalOptions="Center"/>
  </StackLayout>
</ContentPage>

以下是一个带Lollipop的设备和另一个运行Marshmallow的设备的结果: SVG on Lollipop and Marshmallow

唯一接受的图像是&#34; SendData&#34;。

以下是一个正在运行的SVG文件(SendData.svg)和另一个无法正常工作的示例(Connect.svg)

的SendData:

<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     width="30.001px" height="30.002px" viewBox="0 0 30.001 30.002" style="enable-background:new 0 0 30.001 30.002;"
     xml:space="preserve">
<g>
    <path d="M27.798,12.362l-2.9-2.9l-7.479,7.479c-0.472,0.47-1.241,0.47-1.712-0.002l-2.712-2.712c-0.471-0.47-0.471-1.24,0-1.712
        l7.478-7.477l-2.961-2.962C17.042,1.605,17.197,1.165,17.86,1.1l10.925-1.094c0.661-0.065,1.149,0.422,1.082,1.083l-1.093,10.924
        C28.708,12.677,28.269,12.834,27.798,12.362z M24.658,13.782l4.308,4.308c0.726,0.727,0.726,1.916,0,2.643l-8.724,8.725
        c-0.727,0.727-1.917,0.727-2.643,0L0.674,12.533c-0.726-0.728-0.726-1.916,0-2.644l8.723-8.723
        c0.727-0.727,1.917-0.727,2.643-0.001L16.174,5.3l-0.919,0.92l-3.36-3.36l-9.527,9.527l15.025,15.026l9.527-9.528l-3.184-3.183
        L24.658,13.782z M4.593,8.195c0.088,0.09,0.231,0.089,0.32,0l2.791-2.79c0.088-0.09,0.088-0.231,0-0.32
        c-0.089-0.089-0.231-0.089-0.32,0L4.593,7.876C4.505,7.964,4.504,8.107,4.593,8.195z M23.943,23.111
        c-0.365-0.364-0.958-0.363-1.321,0c-0.365,0.365-0.365,0.957,0.001,1.322c0.363,0.364,0.956,0.364,1.32,0
        C24.307,24.068,24.307,23.477,23.943,23.111z"/>
</g>
</svg>

Connect.svg

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="580px" height="580px" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="nonzero" clip-rule="nonzero" viewBox="0 0 5800 5800" xmlns:xlink="http://www.w3.org/1999/xlink">
    <title>graph_connection icon</title>
    <desc>graph_connection icon from the IconExperience.com I-Collection. Copyright by INCORS GmbH (www.incors.com).</desc>
        <path id="curve28" fill="#000000" d="M1900 2800l2000 0 0 200 -2000 0 0 -200zm-900 -600c387,0 700,313 700,700 0,387 -313,700 -700,700 -387,0 -700,-313 -700,-700 0,-387 313,-700 700,-700zm0 200c-276,0 -500,224 -500,500 0,276 224,500 500,500 276,0 500,-224 500,-500 0,-276 -224,-500 -500,-500zm3800 -200c387,0 700,313 700,700 0,387 -313,700 -700,700 -387,0 -700,-313 -700,-700 0,-387 313,-700 700,-700zm0 200c-276,0 -500,224 -500,500 0,276 224,500 500,500 276,0 500,-224 500,-500 0,-276 -224,-500 -500,-500z"/>
</svg>

提前感谢您的支持。

1 个答案:

答案 0 :(得分:1)

感谢great information page,我终于想通了。

经过多次尝试,看起来XamSvg硬件加速并不像图像太大也太小,这肯定是由于代表SVG文本文件中的值的deigits数量。

以下是结论,一切都是使用Inkscape 0.92完成的:

  • 调整SVG大小以调整大小约300 px(文件 - &gt;文档属性/自定义大小)
  • In&#34; Scale&#34;文档属性组,将Scale x设置为1.0(Viewbox大小必须与文档大小相同)
  • 对于每条路径,确保&#34;相对模式&#34;并未全部检查&#34;变换(Shift + Ctrl + M)&#34;物业
  • 将图像保存为&#34;优化SVG&#34;清洁图像。使用Inkscape,如SVG optimizing guide部分&#34; 清理和优化SVG文件&#34;