XAML 使用 DependencyProperty 将图像属性设置为值答案

【问题标题】：XAML set image property to values using DependencyPropertyXAML 使用 DependencyProperty 将图像属性设置为值
【发布时间】：2019-04-25 09:04:45
【问题描述】：

我有一个这样的模型：

{
    "images": [{
        "image_url": "..........",
        "orientation": "horizontal"
    },
    {
        "image_url": "...............",
        "orientation": "vertical"
    }]
}

和一个 ListView 数据模板

<DataTemplate x:DataType="model:ImageItem">
    <controls:ImageEx Source="{x:Bind cover_image_url}" PlaceholderSource="" PlaceholderStretch="Uniform"/>
</DataTemplate>

现在，我希望 ImageEx 控件的 PlaceholderSource 属性与 orientation 一起更改。

更清楚一点，当图像属性为水平时，ImageEx 将加载占位符 1。当图像属性为垂直时，ImageEx 将加载占位符 2。

如何做到这一点。请给我看。

【问题讨论】：

你只是想通过图片切换PlaceholderSourceorientation属性，对吧？
几乎是的，有什么办法吗，尼科？
好的，请检查以下代码。

标签： xaml uwp uwp-xaml

【解决方案1】：

更清楚一点，当图像属性为水平时，ImageEx 将加载占位符 1。当图像属性为垂直时，ImageEx 将加载占位符 2。

您可以使用IValueConverter 接口来处理，使用转换器类将不同的消息类型转换为ImageEx 的不同PlaceholderSource。您可以参考以下 ImageConverter。

public class ImageConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        object img = null;

        switch (value.ToString())
        {
            case "horizontal":
                img = new BitmapImage(new Uri("ms-appx:///Assets/holder1.png"));
                break;
            case "vertical":
                img = new BitmapImage(new Uri("ms-appx:///Assets/holder2.png"));
                break;
            default:
                break;
        }

        return img;
    }

    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        throw new NotImplementedException();
    }
}

Xaml

<Page.Resources>
        <local:ImageConverter  x:Key="Converter"/>
</Page.Resources>

       ......

<DataTemplate x:DataType="model:ImageItem">
    <controls:ImageEx Source="{x:Bind cover_image_url}" PlaceholderSource="{x:Bind orientation,Converter={StaticResource Converter}}" PlaceholderStretch="Uniform"/>
</DataTemplate>

【讨论】：