受约束布局与不受约束布局

Silverlight 中的布局始终以两种模式之一发生，要么是受约束的，要么是不受约束的。受约束布局是指容器强制指定宽度或高度的一种布局。例如，Web 浏览器通常使用 CSS 始终确定 Silverlight 插件的整体尺寸。

一些重要特性包括：

顶级元素的布局在水平和垂直方向上都受到约束。无论它生成什么布局，最终都必须得到浏览器强制指定的大小结果。
某些元素最终会采用**不受约束**的布局，这意味着这些元素可以自由选择自己的大小。例如，垂直**StackPanel**内的元素在垂直方向上不受约束。
StackPanel 会根据需要为它们提供尽可能大的高度。事实上，即使没有足够的空间，它也会这样做。它会告诉元素它们拥有所需的高度，然后裁剪任何不适合的部分。
大多数 Silverlight 用户界面包含这两种布局样式的混合。无论其父级是否施加约束，**StackPanel**始终会在堆叠方向上执行**不受约束**的布局。当高度或宽度设置为**Auto**时，Grid 行或列也是如此。

假设您有一个元素，它位于一个强制指定固定水平宽度的容器内。默认情况下，您的元素将被拉伸以填充空间。如果将对齐方式设置为左、右或居中，则会删除约束。

元素将只占用它需要的宽度。当然，您可以使用固定宽度或高度引入约束。

不受约束的布局有时称为**适合内容**，因为不受约束的元素的大小通常由其内容决定。
适合内容是 Silverlight 布局中的一个重要概念。它使布局能够根据显示的信息自适应调整。

序号	控件和描述
1	GridSplitter 约束可以来自包含的浏览器，也可以来自设计中的固定尺寸。但是，有时让用户施加约束也很有用。
2	ScrollViewer 某些用户界面最终需要显示比可用空间容纳的更多信息。对此的一种常见解决方案是提供一个可滚动区域。Silverlight 使用 ScrollViewer 使这变得非常容易。
3	Border 在布局用户界面时，另一个需要牢记的有用元素是 Border。

全屏模式

Silverlight 插件能够接管整个屏幕。您可以在辅助类上设置一个属性以进入全屏模式。但是，出于安全目的，有一些约束。为了防止网站能够随意接管屏幕，并执行一些恶意操作，例如伪造提示以获取用户的密码。

要进入全屏模式，您需要从应用程序对象获取 Host.Content 属性，并将它的 IsFullScreen 属性设置为 true。

让我们来看一个简单的示例，它切换属性，以便它在全屏和正常模式之间来回切换。

<UserControl x:Class = "FullScreenExample.MainPage" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" 
   xmlns:d = "http://schemas.microsoft.com/expression/blend/2008" 
   xmlns:mc = "http://schemas.openxmlformats.org/markup-compatibility/2006" 
   mc:Ignorable = "d" 
   d:DesignHeight = "300" d:DesignWidth = "400">
   
   <Border BorderBrush = "Gray" BorderThickness = "4" CornerRadius = "30" Padding = "20"> 
	
      <Border.Background> 
         <LinearGradientBrush StartPoint = "0,0" EndPoint = "0,1"> 
            <GradientStop Offset = "0" Color = "Wheat" /> 
            <GradientStop Offset = "1" Color = "BurlyWood" />
         </LinearGradientBrush> 
      </Border.Background> 
		
      <Grid x:Name = "LayoutRoot"> 
         <Button x:Name = "fullScreenButton" HorizontalAlignment = "Center" 
            VerticalAlignment = "Center" FontSize = "30" Width = "300" 
            Height = "100" Content = "Go Full Screen" Click = "Button_Click" /> 
      </Grid> 
		
   </Border> 
	
</UserControl>

这是一段 C# 代码，它启动从全屏返回到正常的操作。您可以通过处理**Host.Content**对象的**FullScreenChanged**事件来了解何时发生这种情况。

using System; 
using System.Windows; 
using System.Windows.Controls;  

namespace FullScreenExample { 

   public partial class MainPage : UserControl { 
	
      public MainPage() { 
         InitializeComponent();  
         App.Current.Host.Content.FullScreenChanged += Content_FullScreenChanged; 
      }
	  
      void Content_FullScreenChanged(object sender, EventArgs e) { 
		
         if (Application.Current.Host.Content.IsFullScreen) { 
            fullScreenButton.Content = "Return to Normal"; 
         } else { 
            fullScreenButton.Content = "Go Full Screen";
         } 
      }
	  
      private void Button_Click(object sender, RoutedEventArgs e) { 
         var content = Application.Current.Host.Content; 
         content.IsFullScreen = !content.IsFullScreen; 
      } 
		
   } 
}

编译并执行上述代码后，您将看到以下输出。

当用户点击**进入全屏**按钮时，它将切换到全屏模式。

请注意，按钮的文本已更改。现在显示**返回正常**。如果再次点击它或按 Escape 键，它将从全屏模式退出。

打印页面