WP7 Silverlight App Scalability Scalability

Question

I'm writing a number of WP7 apps right now that need absolute sizing, depending on display device. What this means that the app size needs to be 656 (w) by 480 (h), which is perfect for WP7 with both shell:SystemTray.IsVisible="True" and shell:ApplicationBar IsVisible="True". From a possible 800 x 480, both those bars used take 144, so I'm good on that front.

On a PC, I'd use a larger version of that size need, like 720x540.

However, if iPhone->iPad is any indication of possible revenue streams for MSFT (as well as Ballmer re-investing in the tablet business), I'm going to make the assumption that we'll see a tablet-sized unit come out soon enough for the WP7 OS.

Also, there may be a 400x240 resolution of WP7 to come out.

What I'd like is for my apps to be immediately available to different sized devices, based on those dimensions above (656 (w) by 480 (h), or a scaled version of that) - rather than having to just change a single set of values to re-release an app. Note: I don't use a <Grid/> or <StackPanel/> - and I can't. Every single thing in the app is absolutely positioned and this is on purpose.

So the question here is - is there some value that I can read about the screen resolution size of the device my app is running on? I've looked through the reference, but couldn't find anything like this.

Answer 1

That is possible by using a Canvas of the size you like to work for and then apply a zoom by changing the value of ScaleX and ScaleY. The best way to do that is by using databinding it to a property that is calculated at runtime. But keep in mind that you probably will keep the correct ratio so scale the X and Y the same amount. When the value is smaller then 1 it will scale down and it will scale up when the value is bigger then 1. And also keep in mind that pixel-based stuf will become more pixelated.

<Canvas x:Name="canvas" Background="#FFFFFFFF" Width="656" Height="480">
    <Canvas.RenderTransform>
        <ScaleTransform ScaleX="1" ScaleY="1"/>
    </Canvas.RenderTransform>
    <Button Content="OK"/>
</Canvas>

Answer 2

From what I hear, tablet (slate) style devices will run a full version of Windows 7 (not Windows Phone 7) but with an addtional software layer on top for better/simpler/easier use in the slate context.

WP7 devices will be coming out with HVGA screens (480x320) and Microsoft have explicitly stated that there won't be any other sizes in the future. (They've learnt the lesson of trying to support multiple screen sizes.) This means that you won't need to worry about 400x240.

In answer to your actual question:
You can get the size of the screen by accessing the RenderSize of the RootVisual, like so:

var size = App.Current.RootVisual.RenderSize;

var msg = string.Format("Height: {0}\r\nWidth: {1}", size.Height, size.Width);

MessageBox.Show(msg, "size", MessageBoxButton.OK);

If the device is rotated it still gives the dimensions from a portrait orientation.

Please note. This is based on my tests in the emulator & not tested on different devices with different size screens.

Answer 3

You can determine the available display size with:-

var width = Application.Current.Host.Content.ActualWidth;
var height = Application.Current.Host.Content.ActualHeight;

These remain the same despite the orientation. Using the dimensions of the RootVisual would probably work as well but if for bizare reason the RootVisual has a fixed size then that won't work.

The ActualWidth and ActualHeight properties above are designed specifically to inform the application of the size of viewport being provided by the host device.