安静且高效一点就好10

2020/11/12

---

前言

控件类的学习

---

#l 一、控件类

二、控件类

1.特殊容器

1）ScrollViewer
因为计算机屏幕的显示区域大小是固定的，如果我们要显示给用户看的内容，大大超出了计算机屏幕的最大显示区域、窗体、容器的限定显示页面，则超出的部分就会破坏原有的布局，这个时候我们就要使用类似于浏览器的那个滚动条的效果了。利用 ScrollViewer 控件可以方便地使应用程序中的内容具备滚动条功能。
对ScrollViewer总结:
a.在ScrollViewer控件中放置能滚动的元素，可以是实现了IScrollInfo接口的任意元素。
b.通过将ScrollViewer.CanContentScroll属性设置为true，告诉ScrollViewer控件其内容知道如何进行滚动。
c.当和ScrollViewer控件进行交互时(通过使用滚动条、鼠标轮和滚动方法等)，ScrollViewer控件通过IScrollInfo接口来调用元素的恰当方法。元素接着执行它自己的自定义滚动功能。
代码如下（示例）：

<Window x:Class="特殊容器.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:特殊容器"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
        </Grid.RowDefinitions>
    <ScrollViewer Grid.Row="1" Name="scollViewer1" Margin="10" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto"   >
        <!--让文字下拉-->
        <TextBox Height="270" Width="176" Name="textBox1" TextWrapping="Wrap">内容控件不仅包括基本控件，如标签、按钮以及工具提示；它们还包含特殊容器，这些容器可用于构造用户界面中比较大的部分区域。

　　首先介绍ScrollViewer控件，该控件直接继承自ContentControl类，提供了虚拟界面，允许用户围绕更大的元素滚动。与所有内容控件一样，ScrollViewer只能包含单个元素，虽然如此，你仍可在内部放置布局容器来保存自己需要的任意类型的元素。

　　此后将分析附加继承层中的另外三个控件：GroupBox、TabItem以及Expander。所有这些控件都继承自HeaderedContentControl类，HeaderedContentControl又继承自ContentControl类。HeaderedContentControl类的作用十分简单，它表示包含单一元素内容(存储在Content属性中)和单一元素标题(存储在Header属性中)的容器。正是由于添加了标题，才使HeaderedContentControl与前面章节介绍的内容控件区别开来。重申一次，可使用标题和或内容的布局容器，将内容封装在HeaderedContentControl中。</TextBox>
    </ScrollViewer>       
            <Button Content="button1" Height="20" Width="50" Click="Button_Click"></Button>
    </Grid>
    
</Window>

2）GroupBox
　GroupBox是特殊容器中最控件中最简单的一个。它显示为具有圆角和标题的方框
　代码如下（示例）：

<Window x:Class="Controls.GroupBoxDemo"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="GroupBoxDemo" Height="300" Width="300">
    <Grid>
        <GroupBox Header="A GroupBox Test" Padding="5" Margin="5" VerticalAlignment="Top">
            <StackPanel>
                <RadioButton Margin="3">One</RadioButton>
                <RadioButton Margin="3">Two</RadioButton>
                <RadioButton Margin="3">Three</RadioButton>
                <Button  Margin="3">Save</Button>
            </StackPanel>
        </GroupBox>
    </Grid>
</Window>

3）TabItem
TabItem表示TabControl控件中的一页。TabItem类添加的唯一有意义的属性是IsSelected，该属性只是选项卡(tab)当前是否显示在TabControl控件中。下面是创建简单示例：
代码如下（示例）：

<Window x:Class="特殊容器.Tabltem"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:特殊容器"
        mc:Ignorable="d"
        Title="Tabltem" Height="300" Width="300">
    <TabControl >
        <TabItem Header="Tab One">
            <StackPanel>
                <CheckBox Margin="3">Setting One</CheckBox>
                <CheckBox Margin="3">Setting Two</CheckBox>
                <CheckBox Margin="3">Setting Three</CheckBox>
                <Button Content="Button" Click="Button_Click"/>
            </StackPanel>
        </TabItem>
        <TabItem Name="tabltem" Header="TabTwo"></TabItem>
    </TabControl>
</Window>

3）Expander
最奇特的具有标题的内容控件是Expander控件。它封装了一块内容，通过单击小箭头按钮可以显示或隐藏所包含的内容。
　　使用Expander控件是十分简单的——只需在该控件内部包装希望使其能够折叠的内容。通常，每个Expander控件开始时都是折叠的，但可在标记中(或代码中)通过设置IsExpanded属性来改变这种行为。下面是一个简单Expander示例：
代码如下（示例）：

<Window x:Class="特殊容器.Expander"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:特殊容器"
        mc:Ignorable="d"
        Title="Expander" Height="300" Width="300">
    <StackPanel>
       <Expander Margin="5" Padding="3" Header="Region One" />
        <Expander Margin="5" Padding="3" Header="Region Two">
            <ScrollViewer Height="50" >
                <TextBlock TextWrapping="Wrap"> 在WPF程序中使用Expander控件是非常合适的，因为WPF鼓励使用流式布局模型，从而可以很方便地处理会大幅增大或缩小的内容区域。

　　如果要使其他控件与Expander同步，可处理Expanded和Collapsed事件。这些事件的名称并未表明其含义，这些事件正好在显示或隐藏内容前触发。这两个事件为实现延迟加载提供一种有用的方法。例如，如果创建Expander控件中的内容非常耗时，可能会直到要显示时才检索这些内容。或者可能希望在显示之前更新内容。无论哪种情况，都可以通过响应Expanded事件来执行相应的工作。　

　　
            </ScrollViewer>
        </Expander>
    </StackPanel>
</Window>
``
## 2.读入数据

<font color=#999AAA >代码如下（示例）：
```c
data = pd.read_csv(
    'https://labfile.oss.aliyuncs.com/courses/1283/adult.data.csv')
print(data.head())

2.各种文本控件

1）Label：文本显示控件，快速获取少量数据。

2. TextBox：文本显示，与Lable类似，但Lable不可用户不可在界面编辑，TextBox默认用户可编辑，也可设置为只读。

3. 基础控件TextBlock：
   TextBox控件的文本如果有多行显示，那么我们可以通过设置TextWrapping使文本自动换行。如果多行显示不完全，可以设置VerticalScrollBarVisibility属性为Auto增加滚动条来显示文本。

FontFamily=" 字体
“FontSize=” 字号"
FontWeight=“设置文本粗细”
Foreground=“前景色(字体颜色)”
TextAlignment=“文本内容的水平对齐方式，默认值为left”
TextTrimming=“获取或设置在内容超出内容区域时要采用的文本剪裁行为,默认值为None”

代码如下（示例）：

 <TextBlock Text="北方的春晨"                                 
                   FontFamily=" 宋体" FontSize=" 16" 
                   FontWeight="Bold" Foreground="Red" 
                    TextAlignment="Left"
                   TextTrimming="WordEllipsis"   ></TextBlock>

4）PasswordBox控件主要作用就是用户输入密码时，显示为"*"
代码如下（示例）：

        <PasswordBox Height="20" Width="70" HorizontalAlignment="Left" Margin="310,120,0,0" VerticalAlignment="Top"/>

下面介绍一些常用的基础控件:

1)CheckBox：bool，选择按钮，默认不选择，通过IsChecked="True"使其默认选择，Indeterminate达到选择按钮模糊。
2)RadioButton：与CheckBox类似，一般用于单选。
3)DatePicker：日期控件，选择日期。
4)Calendar：日历控件，选择日期。
5)ToolBar：工具条，是一组通常在功能上相关的命令或控件的容器，在ToolBar中可添加button、textbox、image、comboBox等等控件。
6)TreeViewStyle：树形控件，可在其中添加节点。

3.列表控件

1）ListBox控件
代码如下（示例）：

           <ListBox Width="60" Height="40">
            <ListBoxItem>a</ListBoxItem>
            <ListBoxItem>b</ListBoxItem>
            <ListBoxItem>c</ListBoxItem>
        </ListBox>  

这里可以省略Item使用，这里还介绍一个SelectionChanged事件
代码如下（示例）：

  <ListBox Width="60" Height="40" SelectionChanged="listBox_SelectionChanged">
            <Label>a</Label>
            <Label>b</Label>
            <Label>c</Label>
        </ListBox>        

三、元素绑定基础介绍

1,这里我们先通过一个案例来对元素绑定做一个简单的介绍

数据绑定在事件中应用非常广泛，可以有效地减少代码量，那么什么是数据绑定？说的简单就是从源对象提取一些信息，将其用于设置目标对象的属性，这里有一点需要注意，目标属性需要是依赖属性(Dependency Property)，而源对象可以是任何内容。
数据绑定可以分为元素到元素的绑定和元素到非元素对象的绑定。但是这里只对元素到元素的绑定做一个介绍
代码如下（示例）：

  <Window x:Class="将元素绑定到一起.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:将元素绑定到一起"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525" Loaded="Window_Loaded">
<Grid>       
        <StackPanel Grid.Row="0">
            <Slider Name="slider1" Margin="5" Maximum="100" Value="10" TickPlacement="Both" TickFrequency="1" ></Slider>
            <!-- FontSize="{Binding ElementName=slider1,Path=Value,Mode=TwoWay}"-->
            <TextBlock  Foreground="{Binding ElementName=listBox1,Path=SelectedItem.Tag}" Name="textBlock1" Text="Simple Text" Margin="10" TextWrapping="Wrap" />
            <Button Content="Bing" Click="Button_Click"/>
            <Button Content="Cancel Bing" Click="Button_Click_1"/>
            <ListBox Margin="3" Height="auto" Name="listBox1">
                <ListBoxItem Tag="Blue">Blue</ListBoxItem>
                <ListBoxItem Tag="DarkBlue">Dark Blue</ListBoxItem>
                <ListBoxItem Tag="LigntBlue">Lignt Blue</ListBoxItem>                
            </ListBox>
            <TextBox Margin="3" Text="{Binding ElementName=textBlock1,Path=FontSize,Mode=TwoWay}" />
        </StackPanel>   
    </Grid>
</Window>

通过调试以上代码我们可以发现滑动滚动条，可以改变字体的颜色。而这里的目标对象就是字体，源对象就是我们的滚动条。而使用Binding ElementName可以知道我们和那个目标对象进行绑定.

通过改变滑动条的值可以改变文本值，ElementName=sldFontSize 表示绑定的源对象为上面的滑动条，Path=Value 表示源对象的属性为滑动条的值，Mode=TwoWay 表示使用双向绑定。这里有四种绑定模式
OneWay
当源属性变化时更新目标属性

TwoWay
当源属性变化时更新目标属性，并且当目标属性变化时更新源属性

OneTime 最初根据源属性值设置目标属性，然后后续其它改变均被忽略。必要时可以减少开销
OneWayToSource
与OneWay相同，但是方向相反

Default
此类绑定依赖于目标属性，既可以双向，也可以是单向，为默认值

---

总结

这篇文章对基本的控件以及元素绑定进行了一个初步的了解