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

时间:2019-04-25 09:04:45

标签: xaml uwp uwp-xaml

我有一个类似的模型:

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

和一个ListView DataTemplate

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

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

更清楚的是,当image属性为水平时,ImageEx将加载一个占位符1。当image属性为垂直时,ImageEx将加载一个占位符2。

如何执行此操作。请告诉我。

1 个答案:

答案 0 :(得分:1)

  

更清楚的是,当image属性为水平时,ImageEx将加载一个占位符1。当image属性为垂直时,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>