共用方式為

HOW TO：針對自動配置使用格線

  • 發行項

更新：2007 年 11 月

本範例說明如何使用自動配置模式下的格線來建立可當地語系化的應用程式。

使用者介面 (UI) 的當地語系化是一項費時的處理程序。除了翻譯文字以外，當地語系化人員通常還需要重新調整項目的大小和位置。在過去，每當 UI 需要顯示新的語言就必須進行調整。現在，Windows Presentation Foundation (WPF) 的功能可以減少您需要對所設計項目進行的調整工作。這種使應用程式的大小和位置更容易調整的撰寫方法稱為 auto layout。

下列可延伸標記語言 (XAML) 範例會示範使用格線調整部分按鈕和文字的位置。請注意，儲存格的高度和寬度都設為 Auto，因此包含影像按鈕的儲存格會隨影像調整大小。因為 Grid 項目可以隨其內容調整大小，所以以自動配置方法設計可以當地語系化的應用程式時相當有用。

範例

下列範例顯示如何使用格線。

<Grid Name="grid" ShowGridLines ="false">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>

<TextBlock Margin="10, 10, 5, 5" Grid.Column="0" Grid.Row="0" FontSize="24">Grid
</TextBlock>
<TextBlock Margin="10, 10, 5, 5" Grid.Column="0" Grid.Row="1" FontSize="12"  
    Grid.ColumnSpan="2">The following buttons and text are positioned using a Grid.
</TextBlock>  
<Button Margin="10, 10, 5, 5" Grid.Column="0" Grid.Row="2" Background="Pink" 
    BorderBrush="Black" BorderThickness="10">Button 1
</Button>
<TextBlock Margin="10, 10, 5, 5" Grid.Column="1" Grid.Row="2" FontSize="12" 
   VerticalAlignment="Center" TextWrapping="WrapWithOverflow">Sets the background 
   color.
</TextBlock>  
<Button Margin="10, 10, 5, 5" Grid.Column="0" Grid.Row="3" Foreground="Red">
   Button 2
</Button>
<TextBlock Margin="10, 10, 5, 5" Grid.Column="1" Grid.Row="3" FontSize="12" 
   VerticalAlignment="Center" TextWrapping="WrapWithOverflow">Sets the foreground 
   color.
</TextBlock>  
<Button Margin="10, 10, 5, 5" Grid.Column="0" Grid.Row="4">
   <Image Source="data\flower.jpg"></Image>
</Button>
<TextBlock Margin="10, 10, 5, 5" Grid.Column="1" Grid.Row="4" FontSize="12" 
   VerticalAlignment="Center" TextWrapping="WrapWithOverflow">Adds an image as 
   the button's content.
</TextBlock>
</Grid>

下圖顯示程式碼範例的輸出。

格線

格線範例

注意事項：

如需上述範例取自的完整程式碼範例，請參閱可當地語系化應用程式的格線範例。

請參閱

工作

HOW TO：使用自動配置建立按鈕

概念

使用自動配置概觀