欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

从新手小白到老手大白的成长之路第二弹-WPF之UI界面之Grid面板

程序员文章站 2022-03-22 14:21:09
废话不多说,接下来直接开始介绍WPF-UI界面-Grid面板 如图就是创建好了的一个WPF项目,整个界面被一个Window窗体包含起来,上面类似于什么什么网址什么的其实就相当于.net的命名空间,缺什么引用的时候,就会提示你缺少引用,那么只需要引用进来就行了。 x:Class=“滴滴滴”,这个“滴滴 ......

废话不多说,接下来直接开始介绍wpf-ui界面-grid面板

从新手小白到老手大白的成长之路第二弹-WPF之UI界面之Grid面板

如图就是创建好了的一个wpf项目,整个界面被一个window窗体包含起来,上面类似于什么什么网址什么的其实就相当于.net的命名空间,缺什么引用的时候,就会提示你缺少引用,那么只需要引用进来就行了。

x:class=“滴滴滴”,这个“滴滴滴”的内容就是所创建窗体的目录,比如这个就是我创建的mvvmtext项目,在views文件夹下的login视图。

title就是窗体最上方的标题,height和width就是窗体的高度和宽度了,这些都可以自己手动修改定义。

接下来进入正题,什么是grid,grid我理解的一个含义就是-单元格。对,就是excel的单元格,每个单元格里面都可以装一些我们需要的控件。但我们装控件前,必须要为它写一个结构,就比如说整体的一个行列,需要多少行,需要多少列。

从新手小白到老手大白的成长之路第二弹-WPF之UI界面之Grid面板

在这个grid里面,首先有grid.columndefinitions和grid.rowdefinitions,这两个的含义就是给这个grid定义2列3行的这样一个网格(一行就不用定义了,默认为一),在设置列和行的数量时,我们可以去定义第几列第几行的一个宽度和高度,*表示填充满剩下的空间,auto表示自动给空间一个刚好的空间,而数字+*的这种组合就是对应的比例,比如说我定义了3*,2*和4*,其意义就是对应的3:2:4的比例来分布大小。接着在grid里面放入我的控件,可以看到控件里面有grid.column和grid.row这两个属性,这两个的属性意思是这个控件所在的列与行,第一行第一列默认从0开始依次根据自己的需求来进行放入。horizontalalignment表示水平方向,这里代表控件在水平方向居中,意思就是当这个定义的单元格的行大于控件大小的高则控件在水平方向上的居中位置显示。verticalalignment则表示垂直方向上的位置了。今天简单的介绍了一下grid面板布局,在实际项目运用中,熟练掌握这最常用的grid就完全够用了,在初始布局时一定要先想好给每行每列对应的宽高值,用这个值来限定控件的大小,尽量不要手动去设置控件大小(当然有些控件是必须要去手动设置的如:button),一个grid里面可以放置多个grid,定义多个grid的宽高,所以,当有些比较复杂的ui时候,首先想好这个ui分成几行几列,然后每行每列是否里面还包含了有多行多列,这个时候就可以去用多个grid来做了。

最后一句忠告:初学者千万千万别拖控件啊,偷懒的效果是没用的。wpf界面必须要手把手的敲,拖控件简直是流氓行为。