Мои изображения размыты! Почему WPF SnapsToDevicePixels не работает?

Я использую некоторые изображения в моем приложении WPF.

XAML:

<Image Name="ImageOrderedList"
       Source="images/OrderedList.png"
       ToolTip="Ordered List"
       Margin="0,0,5,5"
       Width="20"
       Height="20"
       SnapsToDevicePixels="True"
       MouseUp="Image_MouseUp"
       MouseEnter="Image_MouseEnter"
       MouseLeave="Image_MouseLeave" />

Но они кажутся нечеткими.

Почему эта SnapsToDevicePixels="True"линия не предотвращает эту проблему?

Возможно, вы захотите попробовать новое свойство, доступное сейчас в WPF4 . Оставьте RenderOptions.BitmapScalingModeна HighQuality или просто не объявить.

Ближайший сосед работал для меня, за исключением того, что это приводило к резким растровым изображениям при увеличении приложения. Это также, похоже, не исправило каких-либо глюков, когда иконки странным образом изменяли размеры.

На корневом элементе (т.е. главного окна) добавить это свойство: UseLayoutRounding="True".

Свойство, ранее доступное только в Silverlight, теперь исправило все проблемы с размером растрового изображения. :)

Вместо того, чтобы использовать SnapsToDevicePixels, я вместо этого использовал, RenderOptions.BitmapScalingModeи они теперь хороши и четки!

XAML:

<Image Name="ImageOrderedList"
       Source="images/OrderedList.png"
       ToolTip="Ordered List"
       Margin="0,0,5,5"
       Width="20"
       Height="20"
       RenderOptions.BitmapScalingMode="NearestNeighbor"
       MouseUp="Image_MouseUp"
       MouseEnter="Image_MouseEnter"
       MouseLeave="Image_MouseLeave" />

+1 для Зака ​​Петерсона

Я использую .Net 3.5 sp1, и это выглядит как самое простое решение для большого количества нечетких изображений. Нет ничего сложного в том, чтобы указать RenderOptions на месте, но для сторонних компонентов имеет смысл стиль в ресурсе уровня приложения:

 <Style TargetType="{x:Type Image}">
    <Setter
        Property="RenderOptions.BitmapScalingMode"
        Value="NearestNeighbor" />
 </Style>

Хорошо работало, когда AvalonDock начал рендерить размытые иконки.

Использование UseLayoutRounding="True"корневого окна работает во многих случаях, но я столкнулся с проблемой при использовании элемента управления ленты WPF . Мое приложение использует контекстные вкладки, которые отображаются в зависимости от того, что делает пользователь, и когда я установил UseLayoutRoundingдля True, контекстная вкладка не будет отображаться, и изображение RibbonButton также не будет отображаться. Также приложение зависает на много секунд и вентилятор процессора начинает петь.

Использование RenderOptions.BitmapScalingMode="NearestNeighbor"на моем изображении исправило проблемы рендеринга изображения (размытое и обрезанное изображение) и полностью совместимо с использованием контекстных вкладок ленты.

RenderOptions.BitmapScalingMode = "NearestNeighbor" работает хорошо большую часть времени. Тем не менее, время от времени вы будете получать графические сбои (в моем случае 4 из 5 изображений выглядели нормально, но у пятого были небольшие искажения на правом краю). Я исправил это, увеличив правое поле элемента управления изображением на 1.

Если это по-прежнему не помогает, попробуйте элемент управления Bitmap, о котором упоминает EugeneZ. Это замена для управления изображением, и до сих пор он работал довольно хорошо для меня. См. Http://blogs.msdn.com/dwayneneed/archive/2007/10/05/blurry-bitmaps.aspx

Убедитесь, что вы сохранили изображение в том же DPI, в котором работает ваше приложение WPF, в некоторых форматах изображения эта информация хранится в виде метаданных. Я не знаю, решает ли это проблему, но у меня есть некоторые проблемы из-за этого, когда изображения, размер которых увеличен до 100%, стали больше или меньше, чем ожидалось.

Может быть что-то похожее.

используйте UseLayoutRounding = True для самого верхнего элемента в вашем приложении

Я считаю, что это ошибка (или, по крайней мере, так было). Посетите эту страницу поддержки электронной почты Microsoft, чтобы узнать, как это исправить.

Я обнаружил, что RenderOptions.BitmapScalingMode = "NearestNeighbor" не работает для меня. Я использую Windows XP x32 с DirectX 9.0c. Поскольку фактический рендеринг для WPF выполняется с помощью DirectX, это может оказать влияние. У меня действительно включено сглаживание для XP со следующими записями реестра:

[HKEY_LOCAL_MACHINE \ SOFTWARE \ Microsoft \ Avalon.Graphics] "MaxMultisampleType" = dword: 00000004 "EnableDebugControl" = dword: 00000001

Однако отключение с этими настройками не влияет на изображения. Я думаю, что это влияет только на 3D Viewports.

Наконец, я обнаружил, что размытие происходит как с текстом TextBlocks, так и с изображениями. И размывание происходит только для некоторых текстовых блоков и изображений, а не для всех.

Я обнаружил, что никакая комбинация предложенных обходных путей не излечит мою, казалось бы, случайную проблему с размытым изображением. Я, как и многие другие, не могу перейти на .net 4, чтобы использоватьUseLayoutRendering свойство.

Что я нашел для работы:

• Убедитесь, что размеры вашего [оригинального] изображения кратны 2. Это, кажется, предотвращает некоторые странные проблемы с масштабированием изображения.
• Иногда я также обнаружил, что настройка полей на пикселях или 2 может предотвратить проблему.

Когда я прочитал вопрос, моей первой мыслью было то, что вы слишком сильно взорвали изображение, но, похоже, это не тот случай, когда вы смотрите на изображение вашего приложения.

Вторая мысль - это цветовая палитра, но с черным как один из цветов, который не отображается правильно, это не так вероятно.

Если вы можете полностью исключить два выше, я в настоящее время в тупике.

В качестве эксперимента вы можете попробовать другие графические форматы, но PNG должен быть в порядке. Мне придется еще немного подумать, чтобы придумать лучший ответ.

Я пытался использовать RenderOptions.BitmapScalingMode = HighQuality, похоже, это вызывает некоторые проблемы в Windows 8.1, поэтому я попытался запустить их через инструмент под названием PngOut.exe

http://advsys.net/ken/utils.htm

Что уменьшает заголовок png, а также уменьшает размер, но без изменения качества изображения.

И теперь все мои изображения идеальны! :-)