Changing/Updating 图片在 XAML

Question

我在 Xamarin UWP 应用程序中更新图像时遇到问题。首先，我想说我在这个问题上看到了多个其他线程，但是 none 已经能够解决我的困境并且很多非常已经过时了。

这是我的场景：我正在使用三个图像，分别命名为 green.png、red.png 和 gray.png。我在我的 Xamarin 应用程序中显示一个图像，并且根据我关联的 .cs 文件中调用的特定浮点数，我想将图像更改为另一种颜色。因此，例如，如果浮点数低于 15，我希望图像为红色。

这是我目前显示我的图片的方式没有更改它们的代码，即这段代码工作正常并且我的图片出现在应用程序中：

<Image Source="{pages:ImageResource BLE.Client.Pages.red.png}" Opacity="0.6"/>

它们当前存储在与 XAML 文件本身相同的目录中。我知道 Android 上有一个 Resources 文件夹，但我没有看到 UWP 的任何等效项，所以我以这种方式加载我的图像。

我尝试基于另一个 post 执行此操作的方法是：

<Image Source="{Binding HeadColor, StringFormat='pages:ImageResource BLE.Client.Pages.\{0\}.png', Mode=TwoWay}" Opacity="0.6"/>

这应该起作用的方式取决于我的浮点数的值，我在我的 .cs 文件中使用了字符串 HeadColor 并对其执行了 OnPropertyChanged。它总是包含字符串“green”、“red”或“gray”，并且使用这种方法它应该将自己插入到图像位置字符串中。然而，这不起作用。

作为参考，以下是我在 .cs 文件中更新 HeadColor 字符串的方法：

private string _HeadColor;
public string HeadColor {get => _HeadColor; set {_HeadColor = value; OnPropertyChanged("HeadColor");}}
...
if (SensorAvgValue > 15) {_HeadColor = "green";}
else                     {_HeadColor = "red";}
RaisePropertyChanged(() => HeadColor);

我也尝试过使用 IValueConverter，但这也不起作用。

所以，总而言之，我的问题是如何最好地动态更改我想使用的图像。它们都具有相同的维度和相同的目录，唯一的区别是它们的名称“green.png”、“red.png”和“gray.png”。有没有更好的方法来 call/load 图片？

谢谢！

Answer 1

这对我来说适用于 iOS - 我没有要测试的 UWP 环境，但它应该可以正常工作。我的 iOS 资源

中有两张图片“reddot.png”和“greendot.png”

<StackLayout Padding="20,50,20,50">
    <Image Source="{Binding HeadColor, StringFormat='\{0\}dot.png'}" Opacity="0.6"/>
    <Button Clicked="ChangeColor" Text="Click!!" />
</StackLayout>

code-behind

public partial class MainPage : ContentPage, INotifyPropertyChanged
{
    private string headColor = "red";

    public string HeadColor
    {
        get
        { 
          return headColor; 
        }
        set 
        {
            headColor = value;
            OnPropertyChanged();
        }
    }

    public MainPage()
    {
        InitializeComponent();

        this.BindingContext = this;
    }

    protected void ChangeColor(object sender, EventArgs args)
    {
        if (HeadColor == "red")
        {
            HeadColor = "green";
        }
        else
        {
            HeadColor = "red";
        }
    }
}

Changing/Updating 图片在 XAML

Changing/Updating Image in XAML

xamarin

xamarin.forms

uwp

uwp-xaml

xamarin.uwp