电子商城网站开发价格,北京做网站的网络公司,seo网站快速,杨中市网站建设Windows phone的页面布局方式一般是依赖布局控件实现的#xff0c;而布局控件有三种Grid#xff0c;StackPanel和Canvas Grid是网格布局方式#xff0c;相当于一个表格#xff0c;有行和列#xff0c;新建一个Windows phone项目#xff0c;打开MainPage.xaml#xff0c;…Windows phone的页面布局方式一般是依赖布局控件实现的而布局控件有三种GridStackPanel和Canvas Grid是网格布局方式相当于一个表格有行和列新建一个Windows phone项目打开MainPage.xaml页面呈现内容的核心代码如下 Grid x:NameLayoutRoot BackgroundTransparent Grid.RowDefinitions RowDefinition HeightAuto/ RowDefinition Height*/ /Grid.RowDefinitions !--TitlePanel contains the name of the application and page title-- StackPanel x:NameTitlePanel Grid.Row0 Margin12,17,0,28 TextBlock x:NameApplicationTitle TextMY APPLICATION Style{StaticResource PhoneTextNormalStyle}/ TextBlock x:NamePageTitle Textpage name Margin9,-7,0,0 Style{StaticResource PhoneTextTitle1Style}/ /StackPanel !--ContentPanel - place additional content here-- Grid x:NameContentPanel Grid.Row1 Margin12,0,12,0/Grid /Grid 看到代码中用的了两种布局方式Grid和StackPanel这也是windows phone最常用的两种布局方式在布局中Canvas不常用当然这不代表他没用在一些xaml绘制logo那Canvas在核实不过了Grid和StackPanel无法将之取代。 1、Grid 看下面的代码 Grid x:NameLayoutRoot BackgroundTransparent Grid.RowDefinitions RowDefinition HeightAuto/ RowDefinition Height*/ /Grid.RowDefinitions !--TitlePanel contains the name of the application and page title-- StackPanel x:NameTitlePanel Grid.Row0 Margin12,17,0,28 TextBlock x:NameApplicationTitle TextMY APPLICATION Style{StaticResource PhoneTextNormalStyle}/ TextBlock x:NamePageTitle TextGrid Margin9,-7,0,0 Style{StaticResource PhoneTextTitle1Style}/ /StackPanel !--ContentPanel - place additional content here-- Grid x:NameContentPanel Grid.Row1 Margin12,0,12,0 Grid.RowDefinitions RowDefinition/ RowDefinition/ RowDefinition/ /Grid.RowDefinitions Grid.ColumnDefinitions ColumnDefinition/ ColumnDefinition/ ColumnDefinition/ /Grid.ColumnDefinitions TextBlock Textleft top/ TextBlock Grid.Column1 Textcenter top/ TextBlock Grid.Column2 Textright top/ TextBlock Grid.Row1 Textleft center/ TextBlock Grid.Row1 Grid.Column1 Textcenter center/ TextBlock Grid.Row1 Grid.Column2 Textright center/ TextBlock Grid.Row2 Textleft bottom/ TextBlock Grid.Row2 Grid.Column1 Textcenter bottom/ TextBlock Grid.Row2 Grid.Column2 Textright bottom/ /Grid /Grid 运行效果如下图 在name为ContentPanel的Grid中加入三行三列Grid.RowDefinitions也是一个容器在内部放几个RowDefinition就表明Grid有几行Grid.ColumnDefinitions中放几个ColumnDefinition就有几列看还有就是RowDefinition只是用来定义列的列中的内容不是直接放在RowDefinition标签下而是放在Grid标签下通过Grid.Row和Grid.Column来定义内容属于哪一行哪一列默认是第0行第0列所以如果是放在0行Grid.Row可以不用写如果是放在0列Grid.Column不用写就想上面的代码。 Grid中RowDefinition能够定义Height属性表示高度不能定义宽度ColumnDefinition能够定义Width表示宽度不能定义高度所以最终的宽度和高度是两者共同决定的 Height和Width属性是枚举类型可以有三个选项填入具体是就是固定的高或宽填入Auto关键字就是根据行和咧中的子空间的高和宽决定一最大的为准填入星号*就是占据剩余部分比如我第一行Height填入100升入两行诗*则表明第一行为100二三行平分Grid剩余的部分比如Grid的Height是500那剩余的部分就是400而三行每行200. 实际中很少出现特别正规的行列分布往往有的子控件要跨行或跨列Grid.RowSpan表示跨行Grid.ColumnSpan表示跨列 看下面的代码 Grid x:NameContentPanel Grid.Row1 Margin12,0,12,0 Grid.RowDefinitions RowDefinition/ RowDefinition/ RowDefinition/ /Grid.RowDefinitions Grid.ColumnDefinitions ColumnDefinition/ ColumnDefinition/ ColumnDefinition/ /Grid.ColumnDefinitions TextBlock Grid.RowSpan2 VerticalAlignmentCenter Textleft top/ TextBlock Grid.Column1 Textcenter top/ TextBlock Grid.Column2 Textright top/ TextBlock Grid.Row1 Grid.Column1 Textcenter center/ TextBlock Grid.Row1 Grid.Column2 Textright center/ TextBlock Grid.Row2 Textleft bottom/ TextBlock Grid.Row2 Grid.ColumnSpan2 HorizontalAlignmentCenter Grid.Column1 Textcenter bottom/ /Grid 运行效果如下图 2、StackPanel StackPanel是一个比较简单的容器可以将子控件进行横排或竖排默认是竖排不能同时横排和竖排如果是想实现横排和竖排一起出现的效果就要使用子控件嵌套活着布局控件嵌套 Orientation属性是一个枚举类型Horizontal表示横排Vertical表示竖排 看下面的代码和运行效果 Grid x:NameContentPanel Grid.Row1 Margin12,0,12,0 Grid.RowDefinitions RowDefinition Height100/ RowDefinition/ /Grid.RowDefinitions StackPanel OrientationHorizontal TextBlock Textleft Width100/ TextBlock Textcenter Width100/ TextBlock Textright Width100/ /StackPanel StackPanel OrientationVertical Grid.Row1 TextBlock Texttop Height100/ TextBlock Textcenter Height100/ TextBlock Textbottom Height100/ /StackPanel /Grid 3、Canvas Canvas是画布布局方式是一个绝对定位的布局控件他是以左上角0,0为标准将子控件摆放到其中用Cancas.eft和Cancas.Right决定距离左上角的偏移量可以是负值如果出现控件重叠的状况可以通过Canvas.Zindex属性控制Zindex大的会覆盖小的 看下面代码和运行效果 Canvas TextBlock Canvas.Left0 Canvas.Top10 Texttextblock1/ StackPanel Canvas.ZIndex2 Canvas.Left0 Canvas.Top10 BackgroundRed TextBlock Texthello/ /StackPanel TextBlock Canvas.Left100 Canvas.Top100 Texttextblock2/ TextBlock Canvas.Left300 Canvas.Top300 Texttextblock3/ /Canvas 另外每个控件都有布局的属性Margin之类的接下来的文章中将介绍不同控件的用法和属性会介绍布局属性今天的内容中有关布局属性不是很明白的童鞋不用急   我的新浪微博昵称是“马蔬菜”希望大家多关注谢谢  转载于:https://www.cnblogs.com/xiaogeer/archive/2012/04/03/2430749.html