[翻译]WP7 QuickStart-第八篇-屏幕方向

原文地址：http://create.msdn.com/en-US/education/quickstarts/Screen_Orientations

 

【译者注:这篇文章是翻译自微软官方的WP7 QuickStart的第八篇，讲述WP下的处理横屏和纵屏切换的技巧。部分内容加入了自己的理解和表达习惯。而翻译此系列的主要目的一是为了练习英语，二是让自己作为一个 BI开发者对WP7的开发有一个了解。部分翻译不当的地方望各位高人指出批评指正】

 

此篇主要描述Windows Phone的Silverlight对横屏和竖屏的支持技巧。

 

其中主要阐述以下内容：

屏幕方向

滚动技巧

Grid布局技巧

 

屏幕方向

Windows Phone支持下面几种方式：

纵向

左向水平

右向水平

用户可以很简单的更改设备的方向。当在模拟器中测试你的应用的时候，可以通过单击模拟器工具栏的方向切换按钮实现。方向按钮是一个带箭头的矩形来显示屏幕的方向。

在屏幕纵向的时候，页面的方向是纵向的所以页面的高度要大于宽度。

无论是左向横向和右向横向，状态栏和应用程序栏仍然是在屏幕的边缘的。左向横向，状态栏在左面，右向横向的时候，状态栏在右侧。【译者注：关于应用程序栏和状态栏参考本文末尾的译注。】

屏幕纵向是默认支持的，所以当屏幕横向的时候需要额外写些代码。不能只指定左向或者右向的横向，如果需要支持屏幕横向，那么就需要对这两种横向都支持。如果需要程序支持横向或者纵向，需要设置SupportedOrientations属性为PortraitOrLandscape，在XAML里和代码里设置都可以。

显示横屏和纵屏的内容有很多方式。其中的两个技巧就是通过滚动和Grid布局。

 

滚动技巧

这个技巧需要在ScrollViewer控件中使用StackPanel，适用于需要显示列表数据或者一个控件接着一个控件显示的情况。StackPanel允许将其内部的控件一个接一个地显示，ScrollViewer控件允许转屏的过程中当控件超出屏幕的时候在StackPanel中显示滚动条。

这个技巧按如下方式操作。

1.更改SupportedOrientations属性为PortraitOrLandscape。

2.替换Grid为ScrollViewer和StackPanel。

代码演示：

XAML  

<ScrollViewer x:Name="ContentGrid" Grid.Row="1" VerticalScrollBarVisibility="Auto">

<!--You must apply a background to the StackPanel control or you

will be unable to pan the contents.-->

<StackPanel Background="Transparent" >

<!--Adding various controls and UI elements.-->

<Button Content="This is a Button" />

<Rectangle Width="100" Height="100" Margin="12,0"

HorizontalAlignment="Left" Fill="{StaticResource PhoneAccentBrush}"/>