WP8开发学习 - 网格布局Grid

最新推荐文章于 2024-05-24 22:23:19 发布

weixin_34290390

最新推荐文章于 2024-05-24 22:23:19 发布

阅读量103

点赞数

文章标签： shell

原文链接：http://www.cnblogs.com/waising/articles/3580157.html

版权

grid 控件介绍

Grid 控件是最灵活的布局面板，支持以多行和多列布局排列控件。您可以使用在 Grid 控件中立即声明的 RowDefinitions 和 ColumnDefinitions 属性指定 Grid 的行和列定义。可以通过使用 Column 和Row 附加属性，在 Grid 的特定单元格中定位对象。您可以使用自动或星号调整大小分配列或行内的空间。本快速入门前面已解释了自动和星号调整大小。使用 RowSpan 和 ColumnSpan 附加属性可以使内容跨多个行和列。

Grid 的子元素按其在标记或代码中出现的顺序绘制。因而，当各元素共享相同的坐标时，便可以获得分层的顺序（也称为 z 顺序）。

以下 XAML 演示如何创建三行两列的 Grid。第一行和第三行的高度刚好可以包含文本。第二行的高度填充剩余的可用高度。在可用容器宽度内平均分配各列的宽度。

 1 <Grid ShowGridLines="True" Margin="12,0,12,0">
 2     <Grid.RowDefinitions>
 3         <RowDefinition Height="auto" />
 4         <RowDefinition />
 5         <RowDefinition Height="auto" />
 6     </Grid.RowDefinitions>
 7     <Grid.ColumnDefinitions>
 8         <ColumnDefinition Width="*" />
 9         <ColumnDefinition Width="*" />
10     </Grid.ColumnDefinitions>
11     <TextBox Text="1st row 1st column" TextWrapping="Wrap" Grid.Column="0" Grid.Row="0" />
12     <TextBox Text="3rd row 1st column" TextWrapping="Wrap" Grid.Column="0" Grid.Row="2" />
13     <Button Content="1st row 2nd column" FontSize="17" Grid.Column="1" Grid.Row="0" />
14     <Button Content="3rd row 2nd column" FontSize="17" Grid.Column="1" Grid.Row="2" />
15 </Grid>

将生成与下图所描述的类似的输出

QS Layout GridPhone

Grid布局练习计算器Demo

布局文件MainPage.xaml

 1 <phone:PhoneApplicationPage
 2     x:Class="PhoneApp2.MainPage"
 3     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 4     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 5     xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
 6     xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
 7     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
 8     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
 9     mc:Ignorable="d"
10     FontFamily="{StaticResource PhoneFontFamilyNormal}"
11     FontSize="{StaticResource PhoneFontSizeNormal}"
12     Foreground="{StaticResource PhoneForegroundBrush}"
13     SupportedOrientations="Portrait" Orientation="Portrait"
14     shell:SystemTray.IsVisible="false">
15     <phone:PhoneApplicationPage.Background>
16         <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
17             <GradientStop Color="Black" Offset="0"/>
18             <GradientStop Color="#FFA82828" Offset="1"/>
19         </LinearGradientBrush>
20     </phone:PhoneApplicationPage.Background>
21 
22     <!--LayoutRoot 是包含所有页面内容的根网格-->
23     <Grid x:Name="LayoutRoot" Background="#FF302F42">
24         <Grid.RowDefinitions>
25             <RowDefinition Height="Auto"/>
26             <RowDefinition Height="*"/>
27         </Grid.RowDefinitions>
28 
29         <!--TitlePanel 包含应用程序的名称和页标题-->
30         <StackPanel Grid.Row="0" Margin="9,0,0,0" Height="117">
31             <TextBlock Text="计算器" FontFamily="楷体" Margin="22,17,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
32         </StackPanel>
33 
34         <!--ContentPanel - 在此处放置其他内容-->
35         <Grid x:Name="ContentPanel" Grid.Row="1" Margin="0,22,0,33">
36             <Grid.ColumnDefinitions>
37                 <ColumnDefinition />
38                 <ColumnDefinition />
39                 <ColumnDefinition />
40                 <ColumnDefinition />
41                 <ColumnDefinition />
42             </Grid.ColumnDefinitions>
43 
44             <Grid.RowDefinitions>
45                 <RowDefinition Height="63*" />
46                 <RowDefinition Height="170*" />
47                 <RowDefinition Height="119*" />
48                 <RowDefinition Height="117*" />
49                 <RowDefinition Height="119*" />
50                 <RowDefinition Height="117*" />
51             </Grid.RowDefinitions>
52 
53             <TextBlock Name="OperatorTxt" FontSize="50" Grid.Row="0" Grid.ColumnSpan="5" Margin="0,0,10,0" HorizontalAlignment="Right" VerticalAlignment="Top"></TextBlock>
54             <Border BorderBrush="Blue" Grid.Row="1" Grid.ColumnSpan="5">
55                 <TextBlock Name="calcResult"  FontSize="100"  HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0,0,10,0">0</TextBlock>
56             </Border>
57             <Button Name="B7" Tag="N" FontSize="40" Click="B_Click" Grid.Row="2" Grid.Column="0" Content="7"></Button>
58             <Button Name="B8" Tag="N" FontSize="40" Click="B_Click" Grid.Row="2" Grid.Column="1" Content="8"></Button>
59             <Button Name="B9" Tag="N"  FontSize="40" Click="B_Click" Grid.Row="2" Grid.Column="2" Content="9"></Button>
60 
61             <Button Name="B4" Tag="N" FontSize="40" Click="B_Click" Grid.Row="3" Grid.Column="0" Content="4"></Button>
62             <Button Name="B5" Tag="N" FontSize="40" Click="B_Click" Grid.Row="3" Grid.Column="1" Content="5"></Button>
63             <Button Name="B6" Tag="N" FontSize="40" Click="B_Click" Grid.Row="3" Grid.Column="2" Content="6"></Button>
64 
65             <Button Name="B1" Tag="N" FontSize="40" Click="B_Click" Grid.Row="4" Grid.Column="0" Content="1"></Button>
66             <Button Name="B2" Tag="N" FontSize="40" Click="B_Click" Grid.Row="4" Grid.Column="1" Content="2"></Button>
67             <Button Name="B3" Tag="N" FontSize="40" Click="B_Click" Grid.Row="4" Grid.Column="2" Content="3"></Button>
68             <Button Name="BResult" FontSize="40" Click="B_Click" Grid.Row="4" Grid.Column="4" Grid.RowSpan="2" Content="="></Button>
69 
70             <Button Name="B0" Tag="N" FontSize="40" Click="B_Click" Grid.Row="5" Grid.ColumnSpan="2" Grid.Column="0" Content="0"></Button>
71             <Button Name="BPoint" Tag="N" FontSize="40" Click="B_Click" Grid.Row="5" Grid.Column="2" Content="."></Button>
72 
73             <Button Name="BPlus" Tag="OP" FontSize="40" Click="B_Click" Grid.Row="2" Grid.Column="3" FontWeight="Bold" Content="+"></Button>
74             <Button Name="BMinus" Tag="OP" FontSize="40" Click="B_Click" Grid.Row="3" Grid.Column="3" FontWeight="Bold" Content="-"></Button>
75             <Button Name="BMulti" Tag="OP" FontSize="40" Click="B_Click" Grid.Row="4" Grid.Column="3" FontWeight="Bold" Content="*"></Button>
76             <Button Name="BDivision" Tag="OP" FontSize="40" Click="B_Click" Grid.Row="5" Grid.Column="3" FontWeight="Bold" Content="/"></Button>
77 
78             <Button Name="BBack" Tag="BC" FontSize="40" Click="B_Click" Grid.Row="2" Grid.Column="4" FontWeight="Bold" Content="←" Foreground="#FFDCC5C5"></Button>
79             <Button Name="BClear" Tag="BC" FontSize="40" Click="B_Click" Grid.Row="3" Grid.Column="4" Content="C"></Button>
80         </Grid>
81     </Grid>
82 
83 </phone:PhoneApplicationPage>

后台文件MainPage.xaml.cs

  1 using System;
  2 using System.Collections.Generic;
  3 using System.Linq;
  4 using System.Net;
  5 using System.Windows;
  6 using System.Windows.Controls;
  7 using System.Windows.Navigation;
  8 using Microsoft.Phone.Controls;
  9 using Microsoft.Phone.Shell;
 10 using PhoneApp2.Resources;
 11 
 12 namespace PhoneApp2
 13 {
 14     public partial class MainPage : PhoneApplicationPage
 15     {
 16         //保存上一个数值
 17         private string preNum="";
 18         string op = "";
 19         bool isResult = false;
 20         bool isOp = false;
 21         string zeroInfo = "";
 22 
 23         // 构造函数
 24         public MainPage()
 25         {
 26             InitializeComponent();
 27 
 28             // 用于本地化 ApplicationBar 的示例代码
 29             //BuildLocalizedApplicationBar();
 30         }
 31 
 32         private void B_Click(object sender, RoutedEventArgs e)
 33         {
 34 
 35             string tag = "";
 36             if (((Button)sender).Tag!=null){
 37                 tag = ((Button)sender).Tag.ToString();
 38             }
 39 
 40             string txt = ((Button)sender).Content.ToString();
 41 
 42             if (zeroInfo != "")
 43             {
 44                 calcResult.FontSize = 40;
 45                 if (txt != "C") return;
 46                 zeroInfo = "";
 47             }
 48             else
 49             {
 50                 calcResult.FontSize = 100;
 51             }
 52             //jisuan
 53             Calc(tag, txt);
 54         }
 55 
 56         private void Calc(string tag, string txt)
 57         {
 58             //点击数字
 59             if (tag == "N")
 60             {
 61 
 62                 if (txt!=".")
 63                 {
 64                     if (isResult) calcResult.Text = "0";
 65                     if ((calcResult.Text == "0") || (isOp)) calcResult.Text = "";
 66 
 67                     calcResult.Text = calcResult.Text + txt;
 68                 }
 69                 else
 70                 {
 71                     if (calcResult.Text.IndexOf(".") < 0 )
 72                        calcResult.Text = calcResult.Text + txt;
 73                 }
 74                 isOp = false;
 75             }
 76             else if (tag == "OP")
 77             {
 78                 preNum = calcResult.Text;
 79                 OperatorTxt.Text = calcResult.Text + " " + txt ;
 80                 op = txt;
 81                 isOp = true;
 82             }
 83             else if (tag == "BC")
 84             {
 85                 if (txt == "C")
 86                 {
 87                     OperatorTxt.Text = "";
 88                     calcResult.Text = "0";
 89                     op = "";
 90                     preNum = "";
 91                     isOp = false;
 92                     isResult = false;
 93                 }
 94                 else
 95                 {
 96                     if (!isResult) { 
 97                         if (calcResult.Text.Length == 1) {
 98                             calcResult.Text = "0";
 99                         }
100                         else
101                         {
102                             calcResult.Text = calcResult.Text.Substring(0, calcResult.Text.Length - 1);
103                         }
104                     }
105                 }
106             }
107             else
108             {
109                 Operator();
110             }
111         }
112 
113         //jisuan
114         private void Operator()
115         {
116             if (calcResult.Text != "0")
117             {
118                 if (calcResult.Text.Substring(calcResult.Text.Length - 1, calcResult.Text.Length) == ".")
119                 {
120                     calcResult.Text = calcResult.Text.Substring(0, calcResult.Text.Length);
121                 }
122             }
123             double pNum = 0;
124             if (!string.IsNullOrEmpty(preNum)) {
125                 pNum = double.Parse(preNum);
126             }
127              
128             double cResult = double.Parse(calcResult.Text);
129             double res = 0;
130 
131             if (op == "+")
132             {
133                 res = pNum + cResult; 
134             }
135             else if (op == "-")
136             {
137                 res = pNum - cResult; 
138             }
139             else if (op == "*")
140             {
141                 res = pNum * cResult; 
142             }
143             else if (op == "/")
144             {
145                 if (cResult != 0)
146                 {
147                     res = pNum / cResult;
148                 }
149                 else
150                 {
151                     zeroInfo = "除数不能为零";
152                 }
153             }
154 
155             if (string.IsNullOrEmpty(zeroInfo))
156             {
157                 calcResult.Text = Convert.ToString(res);
158             }
159             else
160             {
161                 calcResult.Text = zeroInfo;
162                 calcResult.FontSize = 40;
163             }
164             OperatorTxt.Text = "";
165             isResult = true;
166             //preNum = "";
167             isOp = false;
168         }
169 
170          //用于生成本地化 ApplicationBar 的示例代码
171         //private void BuildLocalizedApplicationBar()
172         //{
173         //    // 将页面的 ApplicationBar 设置为 ApplicationBar 的新实例。
174         //    ApplicationBar = new ApplicationBar();
175 
176         //    // 创建新按钮并将文本值设置为 AppResources 中的本地化字符串。
177         //    ApplicationBarIconButton appBarButton = new ApplicationBarIconButton(new Uri("/Assets/AppBar/appbar.add.rest.png", UriKind.Relative));
178         //    appBarButton.Text = AppResources.AppBarButtonText;
179         //    ApplicationBar.Buttons.Add(appBarButton);
180 
181         //    // 使用 AppResources 中的本地化字符串创建新菜单项。
182         //    ApplicationBarMenuItem appBarMenuItem = new ApplicationBarMenuItem(AppResources.AppBarMenuItemText);
183         //    ApplicationBar.MenuItems.Add(appBarMenuItem);
184         //}
185     }
186 }

View Code

附件源码下载

SmallCall.rar

转载于:https://www.cnblogs.com/waising/articles/3580157.html

weixin_34290390

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
WP8开发学习 - 网格布局Grid

grid 控件介绍Grid控件是最灵活的布局面板，支持以多行和多列布局排列控件。您可以使用在Grid控件中立即声明的RowDefinitions和ColumnDefinitions属性指定Grid的行和列定义。可以通过使用Column和Row附加属性，在Grid的特定单元格中定位对象。您可以使用自动或星号调整大小分配列或行内的空间。本快速入门前面已解释了自动和星号...
复制链接

扫一扫