2017-02-28 54 views
2

部分用戶將其設備升級爲棉花糖。自升級以來,我的應用只顯示一些SVG圖像。XamSVG for Android上的Xamarin表單:某些圖像未在棉花糖中顯示

這是我在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> 

這裏與棒棒糖一個設備,另一種運行棉花糖的結果: SVG on Lollipop and Marshmallow

唯一被接受的圖像是「SendData」。

下面是例如一個工作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> 

非常感謝您的支持。

+0

在我開發的另一個應用程序中,我注意到它非常慢。我看到很多消息「OpenglRenderer:路徑太大而無法渲染成紋理,這導致我採取以下解決方法:在AndroidManifest.xml中將屬性android:hardwareAccelerated =」false「添加到」Application「節點。解決方法 –

+1

也可以使用LAYER_TYPE_NONE,LAYER_TYPE_SOFTWARE的SetLayerType禁用特定視圖上的硬件加速https://developer.android.com/reference/android/view/View.html#setLayerType(int,android.graphics.Paint) – Softlion

回答

1

感謝這great information page,我終於想通了。

經過很多次嘗試,看起來硬件加速的XamSvg不喜歡太大和太小的圖像,這當然是由於表示SVG文本文件中值的精度數量。

這裏有結論,一切都是用Inkscape的0.92完成:

  • 調整的SVG,以大小約爲300像素(文件 - >文檔屬性/自定義大小)
  • 在「比例」組將文檔屬性的Scale x設置爲1.0(Viewbox的大小必須與文檔的大小相同)
  • 對於每個路徑,確保「相對模式」沒有在所有的「Transform(Shift + Ctrl + M) 「屬性
  • 使用Inkscape將圖像保存爲」Optimized SVG「來清理圖像如SVG optimizing guide中「 清潔和優化SVG文件」部分所述。