Шаблон кнопки не отображает изображение четко

Question

Вот мой шаблон кнопки,

<Microsoft_Windows_Themes:ButtonChrome 
   x:Name="Chrome" 
   Background="{TemplateBinding Background}" 
   BorderBrush="{TemplateBinding BorderBrush}" 
   RenderDefaulted="{TemplateBinding IsDefaulted}" 
   RenderMouseOver="{TemplateBinding IsMouseOver}" 
   RenderPressed="{TemplateBinding IsPressed}">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <Image 
               Source="{TemplateBinding ImageSource}" 

               RenderOptions.BitmapScalingMode="NearestNeighbor"

               SnapsToDevicePixels="True"

               HorizontalAlignment="Center"
               VerticalAlignment="Center"
              Stretch="None"
               />
        <ContentPresenter 
            Grid.Column="1"
            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
            Margin="{TemplateBinding Padding}" 
            VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
            SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" 
            RecognizesAccessKey="True"/>
    </Grid>
</Microsoft_Windows_Themes:ButtonChrome>

Теперь вы можете видеть по этому вопросу Мои изображения размыты на Stackru, который я пытался..

RenderOptions.BitmapScalingMode="NearestNeighbor"

На всех уровнях, сетки, хрома... и пробовал различные комбинации SnapsToDevicePixels, но изображения просто не будут отображаться правильно. Я установил Stretch=None, изображение выравнивается по центру, но почему оно растягивается автоматически?

вот выход и его очень расстраивает.

http://akashkava.com/blog/wp-content/uploads/2009/12/BadButton.PNG

Фактический размер изображения составляет 16x16, но я кое-как выяснил, используя Windows Maginifier, что независимо от того, что я делаю, изображение на самом деле пытается визуализировать как 20x20, для больших изображений оно даже обрезает правую и нижнюю части. Я думаю, что изображение должно отображаться правильно 16x16, когда Stretch=None, кто-нибудь может прояснить, в чем здесь проблема?

Answer 1

Это известная проблема с wpf, которую Microsoft не исправила. Единственный способ обойти это - отрегулировать размер, чтобы он не заканчивался дробной частью пикселя в размере.

Answer 2

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

Answer 3

Измените размер изображения, и все будет в порядке.

Answer 4

Я создал стиль кнопки и изменил шаблон элемента управления, придав ему собственную высоту.

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

В свой корневой элемент (т. Е. Главное окно) добавьте это свойство: UseLayoutRounding="True",

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

Обратите внимание - некоторые из эффектов округления макета эффектов могут иметь точную компоновку:

• ширина и / или высота элементов могут увеличиваться или уменьшаться не более чем на 1 пиксель

• размещение объекта может перемещаться не более чем на 1 пиксель

• центрированные элементы могут быть вертикально или горизонтально от центра не более чем на 1 пиксель

Более подробная информация находится здесь: http://blogs.msdn.com/text/archive/2009/08/27/layout-rounding.aspx

Answer 5

Если вы думаете, что ваше изображение 16x16, но WPF, кажется, думает, что оно 20x20, то у вас, вероятно, есть проблема с DPI в изображении. Ваше изображение PNG? Вместо этого сохраните его в формате jpg и посмотрите, как это выглядит.

Ссылка: http://www.hanselman.com/blog/BeAwareOfDPIWithImagePNGsInWPFImagesScaleWeirdOrAreBlurry.aspx