如何处理针对Windows Store应用和WP7，WP8，WPF的可移植类库中的图像? [英] How do I work with images in a portable class library targeting Windows Store Apps and WP7,WP8,WPF?

问题描述

我正在针对第一个PCL进行工作:WSA(Windows应用商店)，WPF，WP7，WP8.我们可以说这是一种Rolerdex应用程序，您有联系人，他们有联系人详细信息和图像. (不是，但是我无法提供有关该应用程序的详细信息，因此我使用的是一个非常简单的示例).这是我的一些问题:)

I am working on a first PCL that targets : WSA (Windows Store Application), WPF,WP7,WP8. We can say that it is a rolerdex kind of application, you have contacts , they have contact details and images. (it's not, but I can't give details about the application, so I am using a very simple example instead). Here are some of my questions :)

1. 我应该在PCL中保存图像吗?

如果是:

1. 如何引用该图像在WSA中使用?
2. 当在不同项目中使用时，如何最好地通过比例尺限定符等解决缩放问题?

我不使用数据库，也不从外部服务下载图像-我想将图像(实际上不是很多)保存在本地，应用程序或PCL中.

I am not using a database and the images are not downloaded from an external service- I would like to keep the images (not many really) locally, in the app or in the PCL.

我只想显示图像.而已.这是静态的Rolerdex，您无法添加新成员.我只想显示5个人数及其图像(在PCL中).如果它是Windows Store应用程序，如何引用图像?

I just want to display images. That's it. It's a static rolerdex, you can't add new people. I just want to display 5 number of people and their image (in the PCL). How do I reference the images if it's a Windows Store Application?

我有一个绑定，并且在PCL中将DataContext设置为ViewModel. ViewModel聚合要从模型中显示的数据.我绑定的属性是MyImage.忽略其他平台，Uri会是什么样?其他一切都很好.

I have a binding and the DataContext is set to a ViewModel in the PCL. The ViewModel aggregates the data to be displayed from the models. The property I've bound against is MyImage. Ignoring the other platforms, how would the Uri look like? Everything else works fine.

我真的只希望对这三个问题有所帮助，尽管我非常感谢所有答案！

I really just want help with these three questions, although I really appreciate all the answers!!!

推荐答案

在很多情况下，图像是特定于平台的.他们需要适应设备本身的尺寸和DPI，并且需要与应用程序的外观和风格相适应.对于这些情况，我可能会让View自行决定向用户显示哪些图像，可能基于ViewModel提供的某种状态/模式.

For a lot of cases, images are platform-specific. They need to cater for size and DPI of the device itself, and would need to fit in with the look and feel of the application. For these situations, I would have the View itself decide what images to show to the user, probably based on some sort of state/mode provided by the ViewModel.

但是，在某些情况下，例如，在邮件应用程序中显示发件人缩略图的情况下，图像需要来自ViewModel.在这些情况下，我让ViewModel返回某种与平台无关的图像概念(例如byte [])，然后让特定于平台的项目将其转换为其UI堆栈可以理解的内容(在XAML中，将是一个ImageSource.)

However, these are cases where the images need to come from the ViewModel, for example, in the case of the sender thumbnails that get displayed in mail applications. In these cases, I have the ViewModel return some sort of a platform-agnostic concept of an image (such as byte[]), and then have the platform-specific projects convert that into something that their UI stack understands (in XAML, this would be a ImageSource).

代码看起来像这样:

便携式项目:

using System.IO;
using System.Reflection;

namespace Portable
{
    public class ViewModel
    {
        private byte[] _image = LoadFromResource("Image.png");

        public byte[] Image
        {
            get { return _image; }
        }

        private static byte[] LoadFromResource(string name)
        {
            using (Stream stream = typeof(ViewModel).GetTypeInfo().Assembly.GetManifestResourceStream("Portable." + name))
            {
                MemoryStream buffer = new MemoryStream();
                stream.CopyTo(buffer);

                return buffer.ToArray();
            }
        }
    }
}

注意:您将需要删除或添加GetTypeInfo()，具体取决于目标平台.

Note: You will need to remove or add GetTypeInfo() depending on the platforms you are targeting.

在这里，我们正在读取嵌入式资源(属性"->构建操作"->嵌入式资源")，但是您可以想象这来自网络或其他地方.

Here we're reading from an embedded resource (Properties -> Build Action -> Embedded Resource), but you could imagine this coming from the network, or somewhere else.

Windows应用商店应用项目: 在Windows Store应用中，您将有一个值转换器，可以从byte []-> ImageSource:

Windows Store app project: In the Windows Store app, you would have a value converter to convert from byte[] -> ImageSource:

using System;
using System.IO;
using Windows.Storage.Streams;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Media.Imaging;

namespace App
{
    public class ByteToImageSourceValueConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, string language)
        {
            InMemoryRandomAccessStream s = new InMemoryRandomAccessStream();

            byte[] bytes = (byte[])value;
            Stream stream = s.AsStreamForWrite();
            stream.Write(bytes, 0, bytes.Length);
            stream.Flush();
            stream.Seek(0, SeekOrigin.Begin);


            BitmapImage source = new BitmapImage();
            source.SetSource(s);

            return source;           

        }

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

在视图后面的代码中，设置DataContext:

In the code behind of the View, set the DataContext:

DataContext = new ViewModel();

然后在View自身中绑定到ViewModel.Image属性，并设置转换器:

Then in the View itself binding to the ViewModel.Image property, and set the converter:

<Page.Resources>
    <local:ByteToImageSourceValueConverter x:Name="ImageConverter"/>
</Page.Resources>

<Grid >
    <Image HorizontalAlignment="Left" Height="242" Margin="77,10,0,0" VerticalAlignment="Top" Width="278" Source="{Binding Image, Converter={StaticResource ImageConverter}}"/>

</Grid>

这篇关于如何处理针对Windows Store应用和WP7，WP8，WPF的可移植类库中的图像?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！