Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Images are not sharp in selected TabItem

I have a TabControl. The header of each TabItem contains a StackPanel with an icon and a Label.

<TabControl>
  <TabItem>
    <TabItem.Header>
      <StackPanel Orientation="Horizontal">
        <Image Source="/LoginPanel;component/Icons/icoLogin.ico"</Image>
        <Label VerticalContentAlignment="Center">Login</Label>
        </StackPanel>
      </TabItem.Header>
    </TabItem.Header>
    <!--some further code here-->
  <TabItem>
  <!--some further code here-->
<TabControl>

Each icon in each non-selected TabItem is displayed as expected. The Icon in the currently selected TabItem is somewhat cloudy. If I switch to another Tab, the de-selected Tab-Icon becomes clear; the new selected Icon becomes cloudy.

I already tried the following to solve this:

SnapsToDevicePixels="True"

but nothing happens

or

Width="32" Height="32"

or

Stretch="None"

to prevent scaling. All of this without any effect. Can some please give me a hint? Thanks in advance

like image 220
Matthias Avatar asked Mar 23 '11 05:03

Matthias


2 Answers

This works for me:

<Image Source="/LoginPanel;component/Icons/icoLogin.ico"
       RenderOptions.BitmapScalingMode="NearestNeighbor"</Image>
like image 126
Markus Avatar answered Oct 09 '22 09:10

Markus


Consider setting 'RenderOptions.EdgeMode' to 'Aliased' too.

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

See Image in WPF getting blury here on SO.

like image 37
Jens Avatar answered Oct 09 '22 10:10

Jens