深入浅出WPF-05.控件与布局
阅读原文时间:2023年07月12日阅读:1

控件与布局

突出特点:1、专门的UI设计语言XAML,无需像MFC那样使用编程语言设计UI。2、前几代在UI和数据交互方面是由消息Message到控件事件,始终是把UI控件放在主导位置而把数据放在了次要位置,用UI驱动数据的改变。WPF在事件驱动的基础上引入了数据驱动的概念,让数据作为主导位置。UI的主要作用就是数据展示,故而数据是核心,WPF正是这样的。

以后的WPF学习,一定要树立一种观念,UI是作为数据的展示,数据才是核心。UI要由数据进行驱动,UI只是数据的表达。

在WPF中,何为控件?我们把那些能够展示数据、响应用户操作的UI元素称之为控件。控件所展示的数据,称之为控件的数据内容,控件在响应用户的操作后,会执行自己的一些方法或者以事件Event的形式通知应用程序,这些称之为控件的行为或者算法内容。所以,控件就是数据和行为的载体,而无需强调调试的长相。

我们将常用的控件大致分为6类:

  • 布局控件:可以容纳多个控件或者嵌套其他布局控件,比如Grid、StackPanel、DockPanel等。他们共同的父类是Panel

  • 内容控件:只能容纳一个其他控件或者布局控件作为他的内容。Window、Button等。他们共同的父类是ContentControl,只能由单一元素充当其内容

    <StackPanel>
        <Button Width="163" Height="93" Click="Button_Click_1" Margin="10">
            <Button Content="Button" Width="91" Height="42" Click="Button_Click"/>
        </Button>
        <Button Width="163" Height="93" Click="Button_Click_1" Margin="10">
            <TextBlock Text="TextBlock"/>
        </Button>
        <Button Width="163" Height="93" Margin="10">
            <Image Source="avatar2.png"/>
        </Button>
    </StackPanel>

    Button控件中只能包含一个其他控件,如果需要包含多个,需要将多个控件放入一个布局中进行实现。

    <Button Width="163" Height="93" Margin="10">
        <StackPanel Orientation="Horizontal">
            <TextBlock Text="TextBlock" VerticalAlignment="Center"/>
            <Image Source="avatar2.png"/>
        </StackPanel>
    </Button>
  • 带标题的内容控件:相当于一个内容控件,但是可以加一个标题Header。标题部分也可以是一个控件或者布局。共同的父类HeaderedContentControl。内容属性为Content和Header。无论是Content还是Header,都只能容纳一个元素作为其内容。

    Expander,GroupBox,HeaderedContentControl,TabItem

  • 条目控件:可现实一列数据,一般情况下这列的数据类型相同。ListBox,ComboBox,主要用于展示集合类型的数据,共同父类ItemsControl。内容属性是Items或者ItemSource。每种ItemsControl都有自己对应的条目容器Item Container。

    Menu(MenuItem),MenuBase,ContextMenu(MenuItem),ComboBox(ComboBoxItem),ItemsControl,ListBox(ListBoxItem),ListView(ListViewItem),Tabcontrol(TabItem),TreeView(TreeViewItem),Selector,StatusBar(StatusBarItem)

  • 带标题的条目控件:相当于在条目控件上增加了一个标题显示区域。这类控件往往用于显示层级关系的数据。TreeViewItem、MenuItem、ToolBar三种,结点显示在Header区域,子级结点则显示在条目控件区域。共同父类HeaderedItemsControl。内容属性:Items,ItemsSource,Header

  • 特殊内容控件:这些控件比较独立

    起装饰作用的Decorator族。Border可以为一组控件增加边框。ViewBox可以对组织在一起的内容进行自由缩放。内容属性是Child,只能由单以元素充当内容。

    TextBlock可以容纳自由控制格式的文本,只能显示不能编辑。TextBox只能容纳一个字符串,不需要太多的格式显示,但是可以编辑。

    Image容纳图片。

    Shape族:用于装饰,没有具体的内容。使用属性Fill进行填充,使用Stroke属性设置边线。

    Panel族:主要控制UI的布局,内容可以是多个元素。Canvas,Grid,DockPanel,TabPanel,UniformGrid,WrapPanel等