none
使用Image控件显示图片出现图片模糊的情况 RRS feed

  • 问题

  • 使用Image的时候,发现图像模糊的情况, 排除了图片大小和图片本身的质量问题(我将它输出到文件中,在windows上打开显示正常),google了一下,发现之前WPF也有类似的问题,解答是这样的。

    在wpf中使用Image时,时常会出现图像模糊的情况,有两种方法可以解决这一问题:

      设置Image的SnapsToDevicePixels属性为true。

      <Image Source="images/OrderedList.png" Width="20" Height="20" SnapsToDevicePixels="True" />

      网上所能查到的方法大多是这种方法,然而有的时候,这种方法也不起作用,这时候我们可以试试下面这种方法。

      设置附加属性RenderOptions.BitmapScalingMode="NearestNeighbor"

      <Window RenderOptions.BitmapScalingMode="NearestNeighbor" />

      这个附加属性也可以放在window中,这样就对整个窗体的所有image对象都起作用了。”

    但是我发现在windows phone 8.1 中,Image找不到SnapsToDeviecePixel 以及 RenderOptions 这两个属性了,我该如何解决这个问题呢?

    谢谢~

    2014年11月25日 6:34

答案

  • 响应OnCompositionScaleChanged,发现Image控件不知何故CompositionScale 被变更为1.2 。用户设置为1,不知道为什么设备会改变了他
    • 已标记为答案 WillSu 2014年12月12日 7:09
    • 已编辑 WillSu 2014年12月12日 7:18
    2014年12月12日 7:09

全部回复

  • 更新一下问题

    我写了个最简单的demo 使用image控件显示图片就可以重现这个问题,

    demo在 https://onedrive.live.com/redir?resid=99FA80783EE47103!3769&authkey=!APaxNQoRzB7zKGI&ithint=file%2czip

    图片会有很明显的失真,如果保真的显示图片呢? 求助~


    • 已编辑 WillSu 2014年11月26日 1:49
    2014年11月26日 1:18
  • 你好,

    在Window Phone 8.1 RT 中,是不支持以上两种方式的,我们可以使用UseLayoutRounding 属性:

    #UIElement.UseLayoutRounding property
    http://msdn.microsoft.com/en-us/library/windows/apps/windows.ui.xaml.uielement.uselayoutrounding.aspx

    基于你的代码,加上UseLayoutRounding属性设置后,我在真机Lumia 1520上进行了测试:

    我截取了电脑屏幕的截图,在手机上测试,没有模糊的问题:


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    2014年11月26日 8:25
    版主
  • 感谢您的回答。

    我在Image控件添加了UseLayoutRounding 为false,对比PC上的显示,还是比PC上模糊,和不添加效果一样呀。


    2014年11月26日 10:37
  • 感谢您的回答。

    我在Image控件添加了UseLayoutRounding 为false,对比PC上的显示,还是比PC上模糊,和不添加效果一样呀。


    你好,

    如果你换一张高清图片进行测试,会得到怎样的结果,我这边发现你的图片不管如何都比较模糊,但是我自己这边的高清图片是正常的


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    2014年11月27日 9:38
    版主
  • Franklin 你好,

    这张图片在windows8.1 下用“windows照片查看器“打开的效果 和 同样的图片在windowsphone8.1 的照片中打开的效果对比,会发现 windowsphone8.1中显示的比windows8.1 中要来的模糊。  我不太明白为啥同一张图片显示效果会有这么大的差异。

    是否在Image控件内有对图片做了什么处理导致显示的效果有差别?

    2014年11月27日 9:42
  • Franklin 你好,

    这张图片在windows8.1 下用“windows照片查看器“打开的效果 和 同样的图片在windowsphone8.1 的照片中打开的效果对比,会发现 windowsphone8.1中显示的比windows8.1 中要来的模糊。  我不太明白为啥同一张图片显示效果会有这么大的差异。

    是否在Image控件内有对图片做了什么处理导致显示的效果有差别?

    你好,

    确实有一些差别,我在想各种图片查看软件(包括原生应用)都会对图片有一些优化显示,如果你在图片查看器中稍微放大一点这张PNG图片,会发现很明显的锯齿和模糊现象:



    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    2014年11月30日 11:45
    版主
  • 感谢您的答复。

    按我的理解,图片在使用其实际大小显示(不放大或者缩小)的时候,即使是不同设备,显示的效果也是差不多的。这张图片我将其放到Android 和 IOS的设备上显示,显示出来的效果和在windows平台下基本是一致的(至少没有肉眼能辨识出的差异) 只有在WP平台下明显比其他平台显示得模糊。

    如果你在图片查看器中稍微放大一点这张PNG图片,会发现很明显的锯齿和模糊现象”

    图片被放大或者缩小都会出现锯齿和模糊的现象,所以我们都是用实际大小来对比显示效果。是否Image控件在显示图片的时候,将图片略微的放大了呢?所以才比原图看起来模糊?

    2014年12月1日 1:10
  • 感谢您的答复。

    按我的理解,图片在使用其实际大小显示(不放大或者缩小)的时候,即使是不同设备,显示的效果也是差不多的。这张图片我将其放到Android 和 IOS的设备上显示,显示出来的效果和在windows平台下基本是一致的(至少没有肉眼能辨识出的差异) 只有在WP平台下明显比其他平台显示得模糊。

    如果你在图片查看器中稍微放大一点这张PNG图片,会发现很明显的锯齿和模糊现象”

    图片被放大或者缩小都会出现锯齿和模糊的现象,所以我们都是用实际大小来对比显示效果。是否Image控件在显示图片的时候,将图片略微的放大了呢?所以才比原图看起来模糊?


    你好,

    >>图片被放大或者缩小都会出现锯齿和模糊的现象,所以我们都是用实际大小来对比显示效果。是否Image控件在显示图片的时候,将图片略微的放大了呢?所以才比原图看起来模糊?

    这是有可能的,我们可以尝试缩放一下图像,再查看效果


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    2014年12月2日 8:28
    版主
  • 响应OnCompositionScaleChanged,发现Image控件不知何故CompositionScale 被变更为1.2 。用户设置为1,不知道为什么设备会改变了他
    • 已标记为答案 WillSu 2014年12月12日 7:09
    • 已编辑 WillSu 2014年12月12日 7:18
    2014年12月12日 7:09