[SOLVED] pixel align on windows phone 8 devices

pixel align on windows phone 8 devices

I am trying to display a simple fullscreen bitmap on WP8 device (Lumia 920).

It has 1280x768 screen, using ScaleFactor 160 and virtual resolution of 800x480.

Here is the result of displaying black/white checkerboard bitmap (It is blurred):

Source image
Screenshot
Cropped zoomed fragment (note this should be Black&White checkerboard, not DarkGray/LightGray, see that the text pixels are much more white

And, obviously, UseLayoutRounding is True everywhere.

So, um, is it possible to pixel-align the bitmap on high-res Windows Phone 8 devices?

UPDATE: checked on 800x480 emulator (with 800x480 image) - perfectly crisp. 1280x768 emulator - blurred, same as on the device :/

Also, opening Web page with checkerboard background (note: 1280x768 image) with viewport width=device-width results in the same blurred image. Does that mean there is no way to get crisp fullscreen image on Lumia except using Direct3D?

XAML:

<phone:PhoneApplicationPage 
    x:Class="PhoneRt.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    shell:SystemTray.IsVisible="True" UseLayoutRounding="True">
    <Canvas x:Name="LayoutRoot">
        <TextBlock x:Name="button">aaa</TextBlock>
        <Image x:Name="viewport" UseLayoutRounding="True" Canvas.Left="0" Canvas.Top="0" Width="480" Height="800"></Image>
    </Canvas>
</phone:PhoneApplicationPage>

Zoomed fragment:

enter image description here

Solution

I played a bit around with it in the emulator. First I thought it's because you set the image in code behind but it actually seems that the system tray is the culprit.

System tray off -> nice and crisp.
System tray on -> gray in gray.

It could be that the pixels that get cut off from the app space by the systray mess up the scaling. If you set the system tray to be a little bit transparent the user can't see that and the screen real estate is larger. For me that made the checkerboard graphics crisp and black and white.

Try

shell:SystemTray.Opacity="0.99"

in your XAML file.