您的位置: 首页  >  文章  >  Windows Phone 7 布局与大小

Windows Phone 7 布局与大小

分类: 文章 • 2024-01-26 14:02:28

 

Windows Phone 7 布局与大小 

1、整体的布局

 



    

  1. 代码  
    2. 

  2.  
    3. 

  3. 
<phone:PhoneApplicationPage   

    4. 

  4. 
    x:Class="SilverlightCornersAndEdges.MainPage" 

    5. 

  5. 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 

    6. 

  6. 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 

    7. 

  7. 
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone" 

    8. 

  8. 
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone" 

    9. 

  9. 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 

    10. 

  10. 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 

    11. 

  11. 
    FontFamily="{StaticResource PhoneFontFamilyNormal}" 

    12. 

  12. 
    FontSize="{StaticResource PhoneFontSizeNormal}" 

    13. 

  13. 
    Foreground="{StaticResource PhoneForegroundBrush}" 

    14. 

  14. 
    SupportedOrientations="PortraitOrLandscape" Orientation="Portrait" 

    15. 

  15. 
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768" 

    16. 

  16. 
    shell:SystemTray.IsVisible="True"> 

    17. 

  17.  
    18. 

  18. 
    <!--LayoutRoot contains the root grid where all other page content is placed--> 

    19. 

  19. 
    <Grid x:Name="LayoutRoot" Background="Transparent"> 

    20. 

  20. 
        <Grid.RowDefinitions> 

    21. 

  21. 
            <RowDefinition Height="Auto"/> 

    22. 

  22. 
            <RowDefinition Height="*"/> 

    23. 

  23. 
        </Grid.RowDefinitions> 

    24. 

  24.  
    25. 

  25. 
        <!--TitlePanel contains the name of the application and page title--> 

    26. 

  26. 
        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28"> 

    27. 

  27. 
            <TextBlock x:Name="ApplicationTitle" Text="CORNERS AND EDGES" Style="{StaticResource PhoneTextNormalStyle}"/> 

    28. 

  28. 
            <TextBlock x:Name="PageTitle" Text="main page" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/> 

    29. 

  29. 
        </StackPanel> 

    30. 

  30.  
    31. 

  31. 
        <!--ContentPanel - place additional content here--> 

    32. 

  32. 
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> 

    33. 

  33. 
            <TextBlock Text="Top-Left" 

    34. 

  34. 
                       VerticalAlignment="Top" 

    35. 

  35. 
                       HorizontalAlignment="Left" /> 

    36. 

  36.  
    37. 

  37. 
            <TextBlock Text="Top-Center" 

    38. 

  38. 
                       VerticalAlignment="Top" 

    39. 

  39. 
                       HorizontalAlignment="Center" /> 

    40. 

  40.  
    41. 

  41. 
            <TextBlock Text="Top-Right" 

    42. 

  42. 
                       VerticalAlignment="Top" 

    43. 

  43. 
                       HorizontalAlignment="Right" /> 

    44. 

  44.  
    45. 

  45. 
            <TextBlock Text="Center-Left" 

    46. 

  46. 
                       VerticalAlignment="Center" 

    47. 

  47. 
                       HorizontalAlignment="Left" /> 

    48. 

  48.  
    49. 

  49. 
            <TextBlock Text="Center" 

    50. 

  50. 
                       VerticalAlignment="Center" 

    51. 

  51. 
                       HorizontalAlignment="Center" /> 

    52. 

  52.  
    53. 

  53. 
            <TextBlock Text="Center-Right" 

    54. 

  54. 
                       VerticalAlignment="Center" 

    55. 

  55. 
                       HorizontalAlignment="Right" /> 

    56. 

  56.  
    57. 

  57. 
            <TextBlock Text="Bottom-Left" 

    58. 

  58. 
                       VerticalAlignment="Bottom" 

    59. 

  59. 
                       HorizontalAlignment="Left" /> 

    60. 

  60.  
    61. 

  61. 
            <TextBlock Text="Bottom-Center" 

    62. 

  62. 
                       VerticalAlignment="Bottom" 

    63. 

  63. 
                       HorizontalAlignment="Center"  /> 

    64. 

  64.  
    65. 

  65. 
            <TextBlock Text="Bottom-Right" 

    66. 

  66. 
                       VerticalAlignment="Bottom" 

    67. 

  67. 
                       HorizontalAlignment="Right" /> 

    68. 

  68. 
        </Grid> 

    69. 

  69. 
    </Grid> 

    70. 

  70.       
    71. 

  71.     <!-- Sample code showing usage of ApplicationBar  
    72. 

  72. 
    <phone:PhoneApplicationPage.ApplicationBar> 

    73. 

  73. 
        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True"> 

    74. 

  74. 
            <shell:ApplicationBarIconButton x:Name="appbar_button1" IconUri="/Images/appbar_button1.png" Text="Button 1"></shell:ApplicationBarIconButton> 

    75. 

  75. 
            <shell:ApplicationBarIconButton x:Name="appbar_button2" IconUri="/Images/appbar_button2.png" Text="Button 2"></shell:ApplicationBarIconButton> 

    76. 

  76. 
            <shell:ApplicationBar.MenuItems> 

    77. 

  77. 
                <shell:ApplicationBarMenuItem x:Name="menuItem1" Text="MenuItem 1"></shell:ApplicationBarMenuItem> 

    78. 

  78. 
                <shell:ApplicationBarMenuItem x:Name="menuItem2" Text="MenuItem 2"></shell:ApplicationBarMenuItem> 

    79. 

  79. 
            </shell:ApplicationBar.MenuItems> 

    80. 

  80. 
        </shell:ApplicationBar> 

    81. 

  81. 
    </phone:PhoneApplicationPage.ApplicationBar> 

    82. 

  82. 
    --> 

    83. 

  83.  
    84. 

  84.  
    85. 

  85. 
</phone:PhoneApplicationPage> 

    86. 



HorizontalAlignment 水平布局属性


HorizontalAlignment 垂直布局属性


Margin 边缘布局属性


Padding 填充属性


2、大小的设定


 


Windows Phone 7 布局与大小 


xaml


 




    

  1. 代码  
    2. 

  2.  
    3. 

  3. 
<phone:PhoneApplicationPage   

    4. 

  4. 
    x:Class="SilverlightWhatSize.MainPage" 

    5. 

  5. 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 

    6. 

  6. 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 

    7. 

  7. 
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone" 

    8. 

  8. 
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone" 

    9. 

  9. 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 

    10. 

  10. 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 

    11. 

  11. 
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768" 

    12. 

  12. 
    FontFamily="{StaticResource PhoneFontFamilyNormal}" 

    13. 

  13. 
    FontSize="{StaticResource PhoneFontSizeNormal}" 

    14. 

  14. 
    Foreground="{StaticResource PhoneForegroundBrush}" 

    15. 

  15. 
    SupportedOrientations="PortraitOrLandscape" Orientation="Portrait" 

    16. 

  16. 
    shell:SystemTray.IsVisible="True"> 

    17. 

  17.  
    18. 

  18. 
    <!--LayoutRoot is the root grid where all page content is placed--> 

    19. 

  19. 
    <Grid x:Name="LayoutRoot" Background="Transparent"> 

    20. 

  20. 
        <Grid.RowDefinitions> 

    21. 

  21. 
            <RowDefinition Height="Auto"/> 

    22. 

  22. 
            <RowDefinition Height="*"/> 

    23. 

  23. 
        </Grid.RowDefinitions> 

    24. 

  24.  
    25. 

  25. 
        <!--TitlePanel contains the name of the application and page title--> 

    26. 

  26. 
        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28"> 

    27. 

  27. 
            <TextBlock x:Name="ApplicationTitle" Text="SILVERLIGHT WHAT SIZE" Style="{StaticResource PhoneTextNormalStyle}"/> 

    28. 

  28. 
            <TextBlock x:Name="PageTitle" Text="main page" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/> 

    29. 

  29. 
        </StackPanel> 

    30. 

  30.  
    31. 

  31. 
        <!--ContentPanel - place additional content here--> 

    32. 

  32. 
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0" 

    33. 

  33. 
              SizeChanged="ContentPanel_SizeChanged"> 

    34. 

  34. 
            <TextBlock Name="txtblk" 

    35. 

  35. 
                       HorizontalAlignment="Center" 

    36. 

  36. 
                       VerticalAlignment="Center" /> 

    37. 

  37. 
        </Grid> 

    38. 

  38. 
    </Grid> 

    39. 

  39.    
    40. 

  40. 
    <!--Sample code showing usage of ApplicationBar--> 

    41. 

  41. 
    <!--<phone:PhoneApplicationPage.ApplicationBar> 

    42. 

  42. 
        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True"> 

    43. 

  43. 
            <shell:ApplicationBarIconButton IconUri="/Images/appbar_button1.png" Text="Button 1"/> 

    44. 

  44. 
            <shell:ApplicationBarIconButton IconUri="/Images/appbar_button2.png" Text="Button 2"/> 

    45. 

  45. 
            <shell:ApplicationBar.MenuItems> 

    46. 

  46. 
                <shell:ApplicationBarMenuItem Text="MenuItem 1"/> 

    47. 

  47. 
                <shell:ApplicationBarMenuItem Text="MenuItem 2"/> 

    48. 

  48. 
            </shell:ApplicationBar.MenuItems> 

    49. 

  49. 
        </shell:ApplicationBar> 

    50. 

  50. 
    </phone:PhoneApplicationPage.ApplicationBar>--> 

    51. 

  51.  
    52. 

  52. 
</phone:PhoneApplicationPage> 

    53. 



cs


 




    

  1. 代码  
    2. 

  2.  
    3. 

  3. using System;  
    4. 

  4. using System.Collections.Generic;  
    5. 

  5. using System.Linq;  
    6. 

  6. using System.Net;  
    7. 

  7. using System.Windows;  
    8. 

  8. using System.Windows.Controls;  
    9. 

  9. using System.Windows.Documents;  
    10. 

  10. using System.Windows.Input;  
    11. 

  11. using System.Windows.Media;  
    12. 

  12. using System.Windows.Media.Animation;  
    13. 

  13. using System.Windows.Shapes;  
    14. 

  14. using Microsoft.Phone.Controls;  
    15. 

  15.  
    16. 

  16. namespace SilverlightWhatSize  
    17. 

  17. {  
    18. 

  18.     public partial class MainPage : PhoneApplicationPage  
    19. 

  19.     {  
    20. 

  20.         // Constructor  
    21. 

  21.         public MainPage()  
    22. 

  22.         {  
    23. 

  23.             InitializeComponent();  
    24. 

  24.         }  
    25. 

  25.  
    26. 

  26.         private void ContentPanel_SizeChanged(object sender, SizeChangedEventArgs e)  
    27. 

  27.         {  
    28. 

  28. 
            txtblk.Text = String.Format("ContentPanel size: {0}\n" +  

    29. 

  29.                                         "TitlePanel size: {1}\n" +  
    30. 

  30.                                         "LayoutRoot size: {2}\n" +  
    31. 

  31.                                         "MainPage size: {3}\n" +  
    32. 

  32.                                         "Frame size: {4}",  
    33. 

  33.                                         e.NewSize,  
    34. 

  34.                                         new Size(TitlePanel.ActualWidth, TitlePanel.ActualHeight),  
    35. 

  35.                                         new Size(LayoutRoot.ActualWidth, LayoutRoot.ActualHeight),  
    36. 

  36.                                         new Size(this.ActualWidth, this.ActualHeight),  
    37. 

  37.                                         Application.Current.RootVisual.RenderSize);  
    38. 

  38.  
    39. 

  39.         }  
    40. 

  40.     }  
    41. 

  41. } 
    42. 



 


本文转自linzheng 51CTO博客，原文链接:http://blog.51cto.com/linzheng/1079250








															

																					

								

									相关推荐