【WPF】一、 基本控件的簡介

WPF一直都是斷斷續續的使用。偶爾用到一下。可是每次間隔比較長，須要從新學習，就寫了這篇日誌。之後有問題，看這個就能夠了解各大概，而後針對細節再另外想辦法。

微軟的東西真心好，若是什麼都不懂，能夠直接用控件快速上手，若是有高級要求，能夠調底層的庫，本身實現。

默承認以看到的控件

一、Border 放到其餘控件內部，給其餘控件畫邊框，其餘容器必須支持雙標籤。

二、Button 按鈕，按鈕用圖片應該設置內容爲Image,而不能設置BackGroud爲Image,若是隻設置背景，按鈕鼠標通過樣式還在

            <Button>
                <Image Source="\images\btn.jpg"></Image>
            </Button>
    

圖片按鈕

 

三、Calendar 日曆

四、Canvas 畫布控件，用來畫圖的。也能夠用來作容器用。子控件根據left/right和top/bottom來獲取相對與canvas邊界的定位。

    <Canvas >
        <Button Content="確認" Canvas.Left="305" Canvas.Top="83" Width="75"/>
        <TextBox Height="23" Canvas.Left="180" Canvas.Top="83" Width="120"/>
    </Canvas>

Canvas作容器

 

五、Checkbox 複選框

<CheckBox Margin="5" Click="點擊事件">是否須要驗證碼</CheckBox>

CheckBox

 

六、Combobox 下拉列表框

七、ContentControl 內容控件。button、checkbox等的基類。通常控件都是現實Text中的文本，這個控件顯示Content屬性中的文本。

八、DataGrid 顯示錶格數據。水很深。詳情見MSDN：https://msdn.microsoft.com/en-us/library/system.windows.controls.datagrid(VS.100).aspx

九、DataPicker 日期選擇控件，帶日曆。

十、DockPanel 停靠佈局容器。子控件就像一個個船，定義DockPanel.Dock屬性表示向上/下/左/右靠過去。如VS的佈局方式大體以下：

<DockPanel>
        <!--停靠佈局，讓菜單欄和工具欄位於窗口頂部-->
        <Menu DockPanel.Dock="Top">
            <MenuItem Header="文件(F)">
                <!--菜單項爲MenuItem，文字使用屬性 Header-->
                <MenuItem Header="新建">
                    <MenuItem Header="項目"></MenuItem>
                    <MenuItem Header="文件"></MenuItem>
                    <MenuItem Header="從現有代碼建立項目"></MenuItem>
                </MenuItem>
                <MenuItem Header="打開"></MenuItem>
                <MenuItem Header="起始頁"></MenuItem>
                <Separator />
                <MenuItem Header="添加"></MenuItem>
                <Separator />
                <MenuItem Header="關閉"></MenuItem>
                <MenuItem Header="關閉解決方案"></MenuItem>
            </MenuItem>
            <MenuItem Header="編輯"></MenuItem>
            <MenuItem Header="視圖"></MenuItem>
            <MenuItem Header="項目"></MenuItem>
            <MenuItem Header="生成"></MenuItem>
        </Menu>
        <ToolBarTray DockPanel.Dock="Top">
            <ToolBar>
                <!--ToolBar和StatusBar就是一個容器-->
                <Button Content="&lt;-"></Button>
                <Button Content="-&gt;"></Button>
                <Separator />
                <Button Content="新建項目"></Button>
                <Button Content="打開文件"></Button>
                <Button Content="保存"></Button>
                <Button Content="所有保存"></Button>
                <Separator />
                <Button Content="撤銷"></Button>
                <Button Content="重作"></Button>
            </ToolBar>
            <ToolBar>
                <Button Content="註釋"></Button>
                <Button Content="取消對選中行的註釋"></Button>
                <Separator />
                <Button Content="在當前標籤切換書籤"></Button>
                <Button Content="將插入符號移動到上一書籤"></Button>
            </ToolBar>
           </ToolBarTray>

            <StatusBar DockPanel.Dock="Bottom" Height="20">
            <TextBlock Text="已保存的項      行 41     列 54    字符 53    Ins"></TextBlock>
        </StatusBar>
        <TextBox DockPanel.Dock="left" Text="工具箱" Width="100"></TextBox>
        <TextBox DockPanel.Dock="left" Text="MainWindow.xaml" Width="400"></TextBox>
        <TextBox DockPanel.Dock="left" Text="解決方案資源管理器"></TextBox>
    </DockPanel>

DockPanel

 

十一、DocumentViewer

十二、Ellipse 實心橢圓

1三、Expander 下拉框

1四、Frame 是一種支持導航的內容控件

<Frame NavigationUIVisibility="Hidden" HorizontalContentAlignment="Left" VerticalContentAlignment="Top" Content="{Binding Page}"></Frame>

不顯示導航，而且內容是一個Page控件，用了綁定語法

 

1五、Grid 網格佈局控件。內部分兩部分：

<Grid.RowDefinitions>和<Grid.ColumnDefinitions>定義行列，行列的寬高有兩種表示方法，按尺寸和比例。按比例，表示方式是加 數字+*，計算方式是，以下面的例子，三個列的尺寸比是1:1:2。尺寸和比例能夠混用，會先將尺寸扣除，剩下的按比例顯示。

控件部分須要指定所在行列，能夠設置跨行（Grid.RowSpan屬性）和跨列（Grid.ColumnSpan屬性）。

<Grid>
        <Grid.RowDefinitions>
            <!--定義行，每一個RowDefinition都是一行-->
            <RowDefinition Height="*"/>
            <RowDefinition Height="*"/>
            <RowDefinition Height="2*"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <!--定義列，每個ColumnDefinition都是一列-->
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="2*"/>
        </Grid.ColumnDefinitions>
        <Button Content="Button" Grid.Column="0" Grid.Row="0" HorizontalAlignment="Left" VerticalAlignment="top" Width="75" />
        <Button Content="Button" Grid.Column="0" Grid.Row="1" HorizontalAlignment="Left" VerticalAlignment="top" Width="75"/>
        <Button Content="Button" Grid.Column="0" Grid.Row="2" HorizontalAlignment="Left" VerticalAlignment="top" Width="75" />
        <Button Content="Button" Grid.Column="1" Grid.Row="0" HorizontalAlignment="Left" VerticalAlignment="top" Width="75" />
        <Button Content="Button" Grid.Column="1" Grid.Row="1" HorizontalAlignment="Left" VerticalAlignment="top" Width="75"/>
        <Button Content="Button" Grid.Column="1" Grid.Row="2" HorizontalAlignment="Left" VerticalAlignment="top" Width="75" />
    </Grid>

Grid

 

1六、GridSplitter 分割線

1七、GroupBox 具備標題的容器盒子

1八、Image 圖片控件 source屬性設置圖片路徑

1九、Label 文本標籤 不支持換行 Content屬性內爲顯示的文本

20、ListBox 列表選擇組件，能夠橫向也能夠豎向，能獲取選中值。可以使用Separator控件作分隔符。

2一、ListView 列表視圖。分視圖顯示方式（ <ListView.View>，裏面放ViewBase類型的控件，如GridView控件，只能放一個）和數據源（ <ListView.ItemsSource>）兩個部分。若是隻是顯示數據的，單用GridView就好了，因此這個經常使用與一個數據源，存在多個View的狀況。提供右鍵菜單。由於涉及後臺代碼，在這裏，不提供demo，能夠參考微軟的demo：http://download.microsoft.com/download/B/2/5/B25C4C6A-97FE-4014-9D4B-B39607BA9A12/wpf_samples/ListViewCustomView.exe。

2二、MediaElement 播放視頻音頻，默認是界面上什麼都沒有，須要再代碼中調用Play()方法纔會播放。

2三、Menu 菜單欄，通常放在頂部，如vs頂部，標題下面那排。

2四、PasswordBox 密碼輸入框。輸入內容顯示爲*******

2五、ProgressBar 進度條。value屬性表示進度，範圍0-100

2六、RadioButton 單選按鈕

2七、Rectangle 實心矩形

2八、RichTextBox 富文本輸入框

2九、ScrollBar 滾動條。沒見過單獨用的，通常都直接再外面套一個ScrollViewer

30、ScrollViewer 帶滾動條的容器。

<ScrollViewer HorizontalAlignment="Stretch"  Name="MapscrollViewer" VerticalAlignment="Stretch" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" >
    <ScrollViewer.Content>
        <Image Name="Map"></Image>
    </ScrollViewer.Content>
</ScrollViewer>

ScrollViewer中展現圖片

小細節，ScrollViewer的大小和ScrollViewer.Content的大小不一致，存在間隔。

 

3一、Separtor 豎向分隔線，能夠用於ToolBar中分隔按鈕組。

3二、Slider 滑動條，當用戶關注相對大小，而不是具體的數字時使用。經常使用語音量控制等。

3三、StackPanel 堆疊容器。子控件每一個都佔一行或一列。Orientation屬性設置橫向Horizontal和豎向Vertical

3四、StatusBar 狀態欄，通常放在底部，顯示各類狀態信息，如VS下面那排。

3五、TabControl tab選項卡和對應容器

3六、TextBlock 文本塊  Text屬性爲顯示內容，TextWrapping="Wrap"表示換行顯示文本。

3七、TextBox 文本框，基本控件，沒什麼好解釋的

<TextBlock Name="coordinate" HorizontalAlignment="Stretch" VerticalAlignment="Bottom"></TextBlock>

TextBox

 

3八、ToolBar 工具欄，單獨用時獨佔一行。

3九、TolBarPanel 繼承自StackPanel，工具欄容器。

40、ToolBarTray 工具欄集合，當有多個工具欄時使用。內部的ToolBar再也不獨佔一行。

4一、TreeView 樹形視圖。

  <TreeView>
    <TreeViewItem Header="經常使用WPF控件" IsExpanded="True">
      <TreeViewItem Header="指針" />
      <TreeViewItem Header="Border" />
      <TreeViewItem Header="Button" />
      <TreeViewItem Header="CheckBox" />
      <TreeViewItem Header="ComboBox" />
      <TreeViewItem Header="Grid" />
      <TreeViewItem Header="Image" />
      <TreeViewItem Header="Label" />
    </TreeViewItem>
    <TreeViewItem Header="全部WPF控件" IsExpanded="True">
      <TreeViewItem Header="指針" />
      <TreeViewItem Header="Border" />
      <TreeViewItem Header="Button" />
      <TreeViewItem Header="Canvas" />
      <TreeViewItem Header="CheckBox" />
      <TreeViewItem Header="ComboBox" />
      <TreeViewItem Header="ContentControl" />
      <TreeViewItem Header="DockPanel" />
      <TreeViewItem Header="Grid" />
      <TreeViewItem Header="Image" />
      <TreeViewItem Header="Label" />
    </TreeViewItem>
    <TreeViewItem Header="常規" />
  </TreeView>

TreeView

 

4二、Viewbox 主要爲子控件提供拉伸，縮放等功能。感受沒什麼卵用，子控件都有Stretch屬性控制拉伸的。

4三、WebBrowser 內置Web瀏覽器（IE內核，不裝IE不能用）

4四、WindowsFormsHost 這個裏面支持WinForm控件。

4五、WrapPanel 包裹塊裝元素的容器。子控件是一塊一塊的，從左往右排列，若是超過右邊框，則換行；超過下邊界，則隱藏。

    <WrapPanel Height="291" Width="542">
        <Calendar/>
        <Calendar/>
        <Calendar/>
        <Calendar/>
    </WrapPanel>

WrapPanel

 

默認不能看到的控件

一、文檔

DocumentViewerBase 提供用於顯示固定內容或流動內容（分別由 System.Windows.Documents.FixedDocument 或 System.Windows.Documents.FlowDocument 表示）的查看器的基類。

DocumentPageView 表示已分頁 System.Windows.Documents.DocumentPage 的視區。

FlowDocumentPageViewer 表示一個用於在固定查看模式下查看流內容的控件，該模式一次顯示一頁內容。

FlowDocument 用高級文檔功能（如分頁和列）承載流內容和設置流內容格式。 定義一個文檔，文檔樣式。