Изображение в WPF становится размытым

Question

Я разрабатываю приложение в WPF с использованием C #. Я помещаю изображения в WrapPanel и показываю внутри сетки еще одну границу, а также использую изображения в кнопках. Проблема в том, что мой контроль над изображениями теряет качество. Я не могу разместить свое изображение здесь, поэтому я просто описываю здесь.

Я использовал SnapsToDevicePixels="True" для изображений, но все равно выглядит размытым.

Обновлен:

Здесь я поделился изображением ниже:

Answer 1

Я думаю, что Маркус сказал, что это единственный способ решить вашу проблему и попытаться добавить еще одно свойство RenderOptions.EdgeMode="Aliased" для каждого изображения, которое я имею в виду:

<Image Source="/LoginPanel;component/Icons/icoLogin.ico"
       RenderOptions.BitmapScalingMode="NearestNeighbor"
       RenderOptions.EdgeMode="Aliased"/>

если вы все еще не можете решить свою проблему, вы можете обратиться к этому http://blogs.msdn.com/b/dwayneneed/archive/2007/10/05/blurry-bitmaps.aspx, чтобы создать собственный класс Bitmap и применить его ко всем изображениям, которые создают проблемы для вас.

Вы также можете видеть это Вопрос переполнения стека

Answer 2

SnapsToDevicePixels не работает для растровых изображений.

Параметры NearestNeighbor на самом деле преобразуют растровое изображение и в итоге будут отличаться от исходного растрового изображения.

В WPF 4 для решения этой проблемы введено свойство " UseLayoutRounding " в FrameworkElement.

Устанавливая для этого свойства значение True для корневого элемента, например Window, выравнивает дочерние элементы по краям пикселей.

<Window UseLayoutRounding="True">...</Window>

Answer 3

Это работает для меня

<Image Source="/LoginPanel;component/Icons/icoLogin.ico"
       RenderOptions.BitmapScalingMode="NearestNeighbor"</Image>

Установите RenderOptions.BitmapScalingMode = "NearestNeighbor" для каждого изображения. В качестве альтернативы см. Этот вопрос здесь, на StackOverflow.

Edit:
Вот мой пример кода

<Window x:Class="MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="661">
    <WrapPanel>
        <Button VerticalAlignment="Center">
            <Image Source="/WpfApplication1;component/icoChip32x32.ico"
               RenderOptions.BitmapScalingMode="NearestNeighbor" Stretch="None"></Image>
        </Button>
        <Button VerticalAlignment="Center">
            <Image Source="/WpfApplication1;component/icoChip32x32.ico"
                   RenderOptions.BitmapScalingMode="NearestNeighbor" Stretch="None"></Image>
        </Button>

        <Button VerticalAlignment="Center">
            <Image Source="/WpfApplication1;component/Presentation-Edit.png"
               RenderOptions.BitmapScalingMode="NearestNeighbor" Stretch="None"></Image>
        </Button>
        <Button VerticalAlignment="Center">
            <Image Source="/WpfApplication1;component/Presentation-Edit.png"
                   RenderOptions.BitmapScalingMode="NearestNeighbor" Stretch="None"></Image>
        </Button>
    </WrapPanel>
</Window>

И вот мой результат:

Answer 4

Используйте UseLayoutRounding = "True" свойство для родительского элемента, если изображение используется в качестве содержимого.В вашем случае это кнопка.

Answer 5

Я столкнулся с проблемой размытости фоновых изображений, вызванной масштабированием, и решение оказалось намного проще, чем вы думаете. Хотя вначале я задавался вопросом, масштабируется ли он до размера текстуры с степенью двойки, масштабирование фактически соответствует соотношению System DPI (96): Image DPI (72, по умолчанию для многих редакторов). Если вы настроите изображение на 96 DPI, оно будет отображаться с точностью до пикселя при настройках Windows по умолчанию.

РЕДАКТИРОВАТЬ: пробовал изображение с высокой контрастностью деталей, и оно слегка смягчается.

Answer 6

У меня была та же проблема, но в моем случае я скачал иконки и обнаружил, что у них тоже неправильный DPI ... 110,56 и 116, хх и 95,99 и т. Д. *

Когда я изменил DPI на 96 для всех, все было хорошо!

Answer 7

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

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

UseLayoutRendering = true с SnapToDevicePixels = false, должно решить эту проблему.Вам также необходимо установить его на уровне главного окна, чтобы вычисления каскадно доходили до уровня изображения.

Вы можете попробовать это, создав простое приложение WPF с одним окном и ваши изображения.Установка поля изображения на что-то глупое (10.452, 0.736, 0, 0) приведет к размытию.Это прекращается, когда UseLayoutRendering = true на изображении.

Если после установки InitializeComponent () затем снова установить поле в конструкторе вашего окна, оно будет размытым независимо от того, установлено ли на изображении значение UseLayoutRendering = true, посколькуВычисления для выравнивания с пикселями на экране были сделаны до того, как вы переместили изображение в местоположение, которое не соответствует этим.

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

Растяжение / сжатие изображения по сравнению с его исходным размером также может привести к проблемам размытия.