Windows Phone 7 布局与大小

1、整体的布局

代码

< phone:PhoneApplicationPage
x:Class ="SilverlightCornersAndEdges.MainPage"
xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone ="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell ="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d ="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc ="http://schemas.openxmlformats.org/markup-compatibility/2006"
FontFamily ="{StaticResource PhoneFontFamilyNormal}"
FontSize ="{StaticResource PhoneFontSizeNormal}"
Foreground ="{StaticResource PhoneForegroundBrush}"
SupportedOrientations ="PortraitOrLandscape" Orientation ="Portrait"
mc:Ignorable ="d" d:DesignWidth ="480" d:DesignHeight ="768"
shell:SystemTray.IsVisible ="True" >

<!-- LayoutRoot contains the root grid where all other page content is placed -->
< Grid x:Name ="LayoutRoot" Background ="Transparent" >
< Grid.RowDefinitions >
< RowDefinition Height ="Auto" />
< RowDefinition Height ="*" />
</ Grid.RowDefinitions >

<!-- TitlePanel contains the name of the application and page title -->
< StackPanel x:Name ="TitlePanel" Grid.Row ="0" Margin ="12,17,0,28" >
< TextBlock x:Name ="ApplicationTitle" Text ="CORNERS AND EDGES" Style ="{StaticResource PhoneTextNormalStyle}" />
< TextBlock x:Name ="PageTitle" Text ="main page" Margin ="9,-7,0,0" Style ="{StaticResource PhoneTextTitle1Style}" />
</ StackPanel >

<!-- ContentPanel - place additional content here -->
< Grid x:Name ="ContentPanel" Grid.Row ="1" Margin ="12,0,12,0" >
< TextBlock Text ="Top-Left"
VerticalAlignment ="Top"
HorizontalAlignment ="Left" />

< TextBlock Text ="Top-Center"
VerticalAlignment ="Top"
HorizontalAlignment ="Center" />

< TextBlock Text ="Top-Right"
VerticalAlignment ="Top"
HorizontalAlignment ="Right" />

< TextBlock Text ="Center-Left"
VerticalAlignment ="Center"
HorizontalAlignment ="Left" />

< TextBlock Text ="Center"
VerticalAlignment ="Center"
HorizontalAlignment ="Center" />

< TextBlock Text ="Center-Right"
VerticalAlignment ="Center"
HorizontalAlignment ="Right" />

< TextBlock Text ="Bottom-Left"
VerticalAlignment ="Bottom"
HorizontalAlignment ="Left" />

< TextBlock Text ="Bottom-Center"
VerticalAlignment ="Bottom"
HorizontalAlignment ="Center" />

< TextBlock Text ="Bottom-Right"
VerticalAlignment ="Bottom"
HorizontalAlignment ="Right" />
</ Grid >
</ Grid >

<!-- Sample code showing usage of ApplicationBar
<phone:PhoneApplicationPage.ApplicationBar>
<shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
<shell:ApplicationBarIconButton x:Name="appbar_button1" IconUri="/Images/appbar_button1.png" Text="Button 1"></shell:ApplicationBarIconButton>
<shell:ApplicationBarIconButton x:Name="appbar_button2" IconUri="/Images/appbar_button2.png" Text="Button 2"></shell:ApplicationBarIconButton>
<shell:ApplicationBar.MenuItems>
<shell:ApplicationBarMenuItem x:Name="menuItem1" Text="MenuItem 1"></shell:ApplicationBarMenuItem>
<shell:ApplicationBarMenuItem x:Name="menuItem2" Text="MenuItem 2"></shell:ApplicationBarMenuItem>
</shell:ApplicationBar.MenuItems>
</shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>
-->


</ phone:PhoneApplicationPage >

HorizontalAlignment 水平布局属性

HorizontalAlignment  垂直布局属性

Margin  边缘布局属性

Padding 填充属性

2、大小的设定

xaml

代码

< phone:PhoneApplicationPage
x:Class ="SilverlightWhatSize.MainPage"
xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone ="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell ="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d ="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc ="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable ="d" d:DesignWidth ="480" d:DesignHeight ="768"
FontFamily ="{StaticResource PhoneFontFamilyNormal}"
FontSize ="{StaticResource PhoneFontSizeNormal}"
Foreground ="{StaticResource PhoneForegroundBrush}"
SupportedOrientations ="PortraitOrLandscape" Orientation ="Portrait"
shell:SystemTray.IsVisible ="True" >

<!-- LayoutRoot is the root grid where all page content is placed -->
< Grid x:Name ="LayoutRoot" Background ="Transparent" >
< Grid.RowDefinitions >
< RowDefinition Height ="Auto" />
< RowDefinition Height ="*" />
</ Grid.RowDefinitions >

<!-- TitlePanel contains the name of the application and page title -->
< StackPanel x:Name ="TitlePanel" Grid.Row ="0" Margin ="12,17,0,28" >
< TextBlock x:Name ="ApplicationTitle" Text ="SILVERLIGHT WHAT SIZE" Style ="{StaticResource PhoneTextNormalStyle}" />
< TextBlock x:Name ="PageTitle" Text ="main page" Margin ="9,-7,0,0" Style ="{StaticResource PhoneTextTitle1Style}" />
</ StackPanel >

<!-- ContentPanel - place additional content here -->
< Grid x:Name ="ContentPanel" Grid.Row ="1" Margin ="12,0,12,0"
SizeChanged ="ContentPanel_SizeChanged" >
< TextBlock Name ="txtblk"
HorizontalAlignment ="Center"
VerticalAlignment ="Center" />
</ Grid >
</ Grid >

<!-- Sample code showing usage of ApplicationBar -->
<!-- <phone:PhoneApplicationPage.ApplicationBar>
<shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
<shell:ApplicationBarIconButton IconUri="/Images/appbar_button1.png" Text="Button 1"/>
<shell:ApplicationBarIconButton IconUri="/Images/appbar_button2.png" Text="Button 2"/>
<shell:ApplicationBar.MenuItems>
<shell:ApplicationBarMenuItem Text="MenuItem 1"/>
<shell:ApplicationBarMenuItem Text="MenuItem 2"/>
</shell:ApplicationBar.MenuItems>
</shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar> -->

</ phone:PhoneApplicationPage >

cs

代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Microsoft.Phone.Controls;

namespace SilverlightWhatSize
{
public partial class MainPage : PhoneApplicationPage
{
// Constructor
public MainPage()
{
InitializeComponent();
}

private void ContentPanel_SizeChanged( object sender, SizeChangedEventArgs e)
{
txtblk.Text = String.Format( " ContentPanel size: {0}\n " +
" TitlePanel size: {1}\n " +
" LayoutRoot size: {2}\n " +
" MainPage size: {3}\n " +
" Frame size: {4} " ,
e.NewSize,
new Size(TitlePanel.ActualWidth, TitlePanel.ActualHeight),
new Size(LayoutRoot.ActualWidth, LayoutRoot.ActualHeight),
new Size( this .ActualWidth, this .ActualHeight),
Application.Current.RootVisual.RenderSize);

}
}
}

转载于:https://www.cnblogs.com/linzheng/archive/2011/01/28/1947274.html