添加LayoutOptions后Xamarin Forms SVG图像(FFImageLoading)丢失

时间:2019-07-04 08:57:04

标签: xaml svg xamarin.forms ffimageloading

在我的Xamarin Forms项目中,我应该显示几个SVG图像。

因此,我使用Xamarin.Forms.FFImageLoading.Svg.Forms NuGet包。

XAML看起来像这样:

<Grid
                                                                    Margin="0"
                                                                    ColumnSpacing="0">
                                                                    <Grid.ColumnDefinitions>
                                                                        <ColumnDefinition Width="90*"/>
                                                                        <ColumnDefinition Width="10*"/>
                                                                    </Grid.ColumnDefinitions>
                                                                    <local:LetterSpacingLabel
                                                                    FontSize="14"
                                                                    TextColor="#1F1F1F"
                                                                    FontFamily="{StaticResource Bliss2-Regular}"
                                                                    LetterSpacing="0.1"
                                                                    VerticalTextAlignment="Center"
                                                                    Grid.Column="0"
                                                                    Text="{Binding Name}"/>
                                                                    <ffimageloadingsvg:SvgCachedImage
                                                                    Grid.Column="1"
                                                                    Source="{Binding StateIconPath}"/>
                                                                </Grid>

并且图像将按原样显示。

但是我希望它更小,所以我添加这样的LayoutOptions:

<ffimageloadingsvg:SvgCachedImage
                                                                        HorizontalOptions="Center"
                                                                        VerticalOptions="Center"
                                                                        Grid.Column="1"
                                                                        Source="{Binding StateIconPath}"/>

之后,它不再显示的图像。

对这个问题有什么解决办法吗?

谢谢。

[编辑]

这是我正在使用的.svg文件:

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 23.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<svg version="1.0" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     viewBox="0 0 22 22" style="enable-background:new 0 0 22 22;" xml:space="preserve">
<style type="text/css">
    .st0{fill:#CE2D46;}
</style>
<path id="Pfad_73" class="st0" d="M11,0C4.9,0,0,4.9,0,11s4.9,11,11,11c6.1,0,11-4.9,11-11c0,0,0,0,0,0C22,4.9,17.1,0,11,0z
     M12.4,18.6c0,0.7-0.6,1.3-1.3,1.3h-0.2c-0.7,0-1.3-0.6-1.3-1.3v-0.2c0-0.7,0.6-1.3,1.3-1.3h0.2c0.7,0,1.3,0.6,1.3,1.3V18.6z
     M12.4,14.2c0,0.8-0.7,1.3-1.4,1.3c-0.7,0-1.2-0.6-1.3-1.3V4.9c0-0.8,0.7-1.3,1.4-1.3c0.7,0,1.2,0.6,1.3,1.3V14.2z"/>
</svg>

2 个答案:

答案 0 :(得分:0)

为您的列宽设置9 *和1 *
   

为图像添加高度和宽度:

答案 1 :(得分:0)

@RobertHaslinger

在这种情况下,您可以添加填充或边距,以减少图像尺寸并保持响应速度

<ffimageloadingsvg:SvgCachedImage Margin ="8" .....>