受約束佈局與不受約束佈局

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 鍵，它將從全屏模式退出。

列印頁面