WPF-5:空间与布局

来自《深入浅出WPF》(刘铁猛)读书笔记

程序的本质是“数据+算法”--用户输入原始数据,算法处理原始数据并显示结果数据。这个时候就要考虑到GUI啦。

Windows GUI开发历史,分为四个阶段:WinAPI时代-》封装时代-》组件化时代-》WPF时代。

我们现在需要建立这样一个概念:WPF中是数据驱动UI,数据是核心。主动的;UI从属于数据并表达数据,是被动的。

WPF把那些能够展示数据,响应用户操作的UI元素称之为控件(Control)。控件所展示的数据,我们称之为“数据内容”;控件在响应用户操作后会执行自己的一些方法或以事件的形式通知应用程序,我们称之为控件的行为或算法内容。WPF中的控件扮演者双重角色,是个非常抽象的概念--Control是数据和行为的载体,而无需具有固定的形象。总之,在WPF中谈论控件,我们关注的应该是抽象的数据和行为而不是控件的具体形象。

常用的控件有:

1)布局控件:可容纳多个控件或嵌套其他布局控件,用于在UI上组织和排列控件,如Grid,StackPanel,DockPanel,他们拥有共同的父类panel;

2) 内容控件:只能容纳一个其他控件或布局控件作为他的内容,如Window,Button,共同的父类为ContentControl;

3)带标题内容的控件:GroupBox,TabItem,共同的父类:HeaderedContentControl;

4)条目控件:可以显示一列数据,一般情况下这列数据类型相同,如ListBox,ComboBox,共同基类ItemsControl;

5)带标题条目控件:相当于一个条目控件加上一个标题显示区,如TreeViewItem,MenuItem,共同的基类是HeaderedItemsControl;

6)特殊内容控件:如textBox,Image等;

控件对应到XAML文档里就是标签,按照大家对标签语言的理解,控件的内容就应该是标签的内容,子级控件就应该是标签的子级元素。标签的内容就是夹在起始标签和结束标签间的代码。

换句话说,XAML标签的内容区域专门映射了控件的内容属性。有些控件的内容是一个集合,如StackPanel的内容属性是Children,ListBox内容属性是Items,为这类控件添加内容时一样可以省去内容属性的标签,如:为一个StackPanel添加三个TextBox和一个Button时:

<StackPanel Background="Gray">
    <StackPanel.Children>
        <TextBox Margin="5">
        <TextBox Margin="5">
        <Button Content="OK" Margin="5">
    </StackPanel.Children>
</StackPanel>

简化后的代码是:

<StackPanel Background="Gray">
    <TextBox Margin="5">
    <TextBox Margin="5">
    <Button Content="OK" Margin="5">
</StackPanel>

ContentControl族:

    1)均派生自ContentControl类;

    2)内容属性的名称为Content;

    3)只能由单一元素充当其内容;

HeaderedContentControl族:

    1)HeadredContentControl是ContentControl类的派生类;

    2)用于显示带标题的数据;

    3)除了用于显示主体内容区域外,还具有一个显示标题的区域;

    4)内容属性为Content和Header;

    5)无论Content还是Header都只能容纳一个元素作为其内容;

ItemsControl族:

    1)用于显示类表化的数据;

    2)内容属性为Items或ItemsSource;

HeaderedItemsControl族:

    1)用于显示列表化的数据,同时可以显示一个标题;

    2)内容属性:Items,ItemsSource,Header;

Decorator族:

    1)均派生自Decorator类;

    2)起UI装饰作用;

    3)内容属性为Child;

    4)只能由单一元素充当内容;

TextBlock与TextBox:

    TextBlock:只能显示文本,不能编辑,称之为静态文本;可以使用丰富的印刷级的格式控制标记显示专业的排版效果;内容属性为Inlines,也保留一个名为Text属性,当简单显示一个字符串时,可以使用这个属性;

    TextBox:允许用户编辑,内容时简单的字符串,属性为Text;

Shape族:

    用于2D图形绘制;

    无内容属性;

    使用Fill属性设置填充,使用Stroke属性设置边线;

Panel族:

    均派生自Panel抽象类;

    主要功能是控制UI布局;

    内容属性为Child;

    内容可以是多个元素,Panel元素控制他们的布局;


UI布局:

    WPF设计师工作量最大的两部分就是布局和动画,布局是静态的,动画是动态的,用户体验就是用户在这动静之中与软件功能产生交互时的感受。

    每个布局元素都有自己的特点,既有自己的优点,长处,也有自己的缺点和短处。

    WPF布局理念:布局元素的嵌套;

    1)Grid:网格;

    2)StackPanel:栈式面板;

    3)Canvas:画布;

    4)DockPanel:泊靠式面板;

    5)WrapPanel:自动折行面板

Grid:只定义行和列的个数还远远不够,还需要设置行的高度,列的宽度;

    默认单位为pixel,所以px可以省略;其他单位也会被转换成像素并显示在Grid边缘处;

    值的设置:绝对值(double数值加单位后缀);比例值(double数值后加一个星号“*”);自动值:字符串Auto;如果没有显示指定行高或列宽时,默认值就是1*,1*又可以简写为*;如果使用Auto,控件会把行列撑到合适的宽度和高度;如果行列中没有控件,则行高和列宽均为0;行列都是从0开始计数;

    指定一个控件在某行,就为这个控件的标签添加Grid.Row="行编号",若行编号为0(即控件处于首行)则可省略这个Attribute;控件在某列也于此类似;若控件需要跨多个行列,则使用Grid.RowSpan=''行数"和Grid.ColumnSpan="列数"两个Attribute。

    依控件所处环境而被容器附加上的属性就叫附加属性;

StackPanel:

    适合:同类元素需要紧促排列;移除其中的元素后能够自动补缺的布局或动画;

    3个属性:Orientation,HorizontalAlignment,VerticalAlignment

Canvas:

    当控件被放置在Canvas里时就会被附加上Canvas.x和Canvas.y属性;

    适合:一经设计不会有改动的小型布局;艺术性比较强的布局;需要大量使用纵横坐标进行绝对点定位的布局;依赖于纵横坐标的动画;

DockPanel:

    有一个bool类型的属性LastChildFill,默认值为True,当为true时,DockPanel内最后一个元素的DockPanel.Dock属性值会被忽略,这个元素会把DockPanel内部所有剩余空间填满,这也正好解释了为什么Dock枚举类型没有Fill这个值。

WrapPanel:

    内部采用流式布局。在流延伸的方向上,WrapPanel会排列尽可能多的空间,排不下的控件将会新起一行或一列继续排列;

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值