如何缩放图像以适合TitleView

时间:2018-11-04 17:33:49

标签: c# xamarin.forms navigationbar

我使用TitleView布局在导航栏中使用图像。但是有效...

我遇到根据导航栏的高度设置图像大小的问题。

<NavigationPage.TitleView>
    <StackLayout Orientation="Horizontal"
                 VerticalOptions="Center"
                 Spacing="10">

        <Image Source="flechegauche.png" BindingContext="{x:Reference TitleLabel}" HeightRequest="{Binding Height}"/>

        <Label x:Name="TitleLabel" Text="Evènements" FontSize="16" TextColor="White" 
               VerticalTextAlignment="Center" VerticalOptions="FillAndExpand"
               HorizontalTextAlignment="Center" HorizontalOptions="FillAndExpand" />

        <Image Source="filtre.png" HeightRequest="{OnPlatform iOS=60, Android=35, Default=40}"/>
        <Image Source="flechedroite.png" HeightRequest="{OnPlatform iOS=60, Android=35, Default=40}"/>

    </StackLayout>
</NavigationPage.TitleView>

如果我使用它,它将起作用:HeightRequest =“ {OnPlatform iOS = 60,Android = 35,Default = 40}”

但这无效:BindingContext =“ {x:参考TitleLabel}” HeightRequest =“ {Binding Height}”

为什么?!?仍然是将图像的高度与导航栏的高度链接(以确保图像正确适合)的最佳方法,不是吗?

我还尝试将“ Aspect”设置为“ AspectFit”,但没有任何改变。

2 个答案:

答案 0 :(得分:0)

我不知道为什么,但我发现了这个。 我创建了一个这样的转换器:

class dblMultiplier : IValueConverter, IMarkupExtension
{
    public double Multiplier { get; set; } = 1.0f;

    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return System.Convert.ToDouble(value) * Multiplier;
    }
    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotSupportedException("Only one way bindings are supported with this converter");
    }

    public object ProvideValue(IServiceProvider serviceProvider)
    {
        return this;
    }
}

我在 XAML 中使用此绑定:

<Image Source="flechegauche.png" HeightRequest="{Binding Source={x:Reference TitleLabel}, Path=Height, Converter={Helpers:dblMultiplier Multiplier=0.99}}"/>

转换器被调用两次。当标签的高度尚未固定时,默认值为 -1。计算布局时的第二个。所以它完美地工作。

但是如果我使用 1.0 而不是 0.99 的相同转换器,它就不起作用!!!图像的大小不适应......?!?很奇怪吧?

答案 1 :(得分:0)

好的,我找到了核心问题...

(1) 我的图像在第一次出现时(在计算布局之前)太大,因此没有显示用于缩放图像的标签,因此标签不能用于缩放图像,并且图片没有显示预期的尺寸!

所以,我做了一个转换器来在开始时强制一个小的默认值:

class dblMultiplier : IValueConverter, IMarkupExtension
{
    public double Multiplier { get; set; } = 1.0f;
    public double Default { get; set; } = double.NaN;

    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        double dvalue = System.Convert.ToDouble(value);

        if (dvalue < 0.0f && !double.IsNaN(Default) )
            return Default;

        return dvalue * Multiplier;
    }
    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotSupportedException("Only one way bindings are supported with this converter");
    }

    public object ProvideValue(IServiceProvider serviceProvider)
    {
        return this;
    }
}

我像这样更改了 XAML:

<Image Source="flechegauche.png" HeightRequest="{Binding Source={x:Reference TitleLabel}, Path=Height, Converter={Helpers:dblMultiplier Default=10}}"/>

(2) 我还必须确保标签不适合 TitleView 的整个高度。否则不会发生缩放。