winforms教程_C＃编程教程-用C＃编程高级Winforms

叁歲伎倆 2022-12-07 12:10 252阅读 0赞

winforms教程

## 在Winforms中使用控件-高级 **(** Using Controls in Winforms - Advanced **)** ##

![WinForm with ComboBox][]

In this C\# programming tutorial, I'll be concentrating on the advanced controls such as ComboBoxes, Grids, and ListViews and showing you the way you'll most likely use them. I'm not touching data and binding until a later tutorial.Let's begin with a simple control, a ComboBox.

在本C＃编程教程中，我将集中介绍ComboBoxes，Grids和ListViews等高级控件，并向您展示最有可能使用它们的方式。 在接下来的教程中，我不会涉及数据和绑定。让我们从一个简单的控件ComboBox开始。

## ComboBox Winform控件 **(** ComboBox Winform Control **)** ##

At the heart of a Combo is an items collection and the simplest way to populate this is drop a combo on the screen, select properties (if you can't see the properties windows, click View on the top Menu and then Properties Window), find items and click the ellipses button. You can then type in the strings, compile the program and pull the combo down to see choices.

组合的核心是项目集合，最简单的填充方法是在屏幕上放置一个组合，选择属性(如果看不到属性窗口，请单击顶部菜单上的查看，然后单击属性窗口)，查找项目，然后单击省略号按钮。 然后，您可以键入字符串，编译程序，然后下拉组合键以查看选择。

*  One
    
    之一
 *  Two
    
    二
 *  Three
    
    三

Now stop the program and add a few more numbers: four, five.. up to ten. When you run it you'll only see 8 because that's the default value of MaxDropDownItems. Feel Free to set it to 20 or 3 and then run it to see what it does.

现在，停止程序并添加更多数字：4、5 ..最多10。 运行它时，您只会看到8，因为这是MaxDropDownItems的默认值。 随意将其设置为20或3，然后运行它以查看其作用。

It's annoying that when it opens it says comboBox1 and you can edit it. That's not what we want. Find the DropDownStyle property and change DropDown to DropDownList.(It's a Combo!). Now there's no text and it's not editable. You can select one of the numbers but it always opens blank. How do we select a number to start with? Well it's not a property you can set at design time but adding this line will do that.

令人讨厌的是，当它打开时显示comboBox1，您可以对其进行编辑。 那不是我们想要的。 找到DropDownStyle属性，然后将DropDown更改为DropDownList。(这是一个Combo！)。 现在没有文本，并且不可编辑。 您可以选择其中一个数字，但始终会空白。 我们如何选择一个数字开头？ 嗯，这不是您可以在设计时设置的属性，但是添加此行即可。

> comboBox1.SelectedIndex =0;

> comboBox1.SelectedIndex = 0;

Add that line in the Form1() constructor. You have to view the code for the form (in the Solution Explorer, right click on From1.cs and click  . Find InitializeComponent(); and add that line immediately after this.

在Form1()构造函数中添加该行。 您必须查看表单的代码(在解决方案资源管理器中，右键单击From1.cs，然后单击“查看代码”。查找InitializeComponent()；并在此之后立即添加该行。

If you set the DropDownStyle property for the combo to Simple and run the program you'll get nothing. It won't select or click or respond. Why? Because at design time you must grab the lower stretch handle and make the whole control taller.

如果您将组合的DropDownStyle属性设置为Simple并运行该程序，您将一无所获。 它不会选择，单击或响应。 为什么？ 因为在设计时，您必须抓住较低的拉伸手柄并使整个控件更高。

## 源代码示例 **(** Source Code Examples **)** ##

*  Download the examples (zip code)
    
    下载示例(邮政编码)

**On the next page** : Winforms ComboBoxes Continued

**下一页** ：Winforms组合框续

## 看着组合框续 **(** Looking at ComboBoxes Continued **)** ##

![Working with a ComboBox][WinForm with ComboBox]

In example 2, I've renamed the ComboBox to combo, changed the combo DropDownStyle back to DropDown so it can be edited and added an Add button called btnAdd. I've double clicked the add button to create an event btnAdd\_Click() event handler and added this event line.

在示例2中，我将ComboBox重命名为combo，将组合DropDownStyle重新更改为DropDown，以便可以对其进行编辑并添加了一个名为btnAdd的添加按钮。 我双击添加按钮创建了一个事件btnAdd\_Click()事件处理程序，并添加了该事件行。

>   
> \{  
> \{  
> combo.Items.Add(combo.Text) ;  
> combo.Items.Add(combo.Text);  
> \}  
> \}

Now when you run the program, type in a new number, say Eleven and click add. The event handler takes the text you typed in (in combo.Text) and adds it to the Combo's items collection. Click on the Combo and we now have a new entry Eleven. That's how you add a new string to a Combo. To remove one is slightly more complicated as you have to find the index of the string you wish to remove then remove it. The method RemoveAt shown below is a collection method to do this. you just have to specify which item in the Removeindex parameter.

现在，当您运行该程序时，键入一个新数字，说11，然后单击添加。 事件处理程序将您键入的文本(在combo.Text中)添加到Combo的items集合中。 单击组合，我们现在有一个新条目“十一”。 这样便可以向Combo添加新字符串。 删除一个要稍微复杂一些，因为您必须先找到要删除的字符串的索引，然后再删除它。 下面显示的方法RemoveAt是执行此操作的收集方法。 您只需要在Removeindex参数中指定哪个项目即可。

> combo.Items.RemoveAt( RemoveIndex ) ;

> combo.Items.RemoveAt(RemoveIndex);

will remove the string at position RemoveIndex. If there are n items in the combo then the valid values are 0 to n-1. For 10 items, values 0..9.

将删除位置RemoveIndex处的字符串。 如果组合中有n个项目，则有效值为0到n-1。 对于10个项目，值0..9。

In the btnRemove\_Click method, it looks for the string in the text box using

在btnRemove\_Click方法中，它使用以下命令在文本框中查找字符串：

> int RemoveIndex = combo.FindStringExact( RemoveText ) ;

> int RemoveIndex = combo.FindStringExact(RemoveText);

If this doesn't find the text it returns -1 otherwise it returns the 0 based index of the string in the combo list. There's also an overloaded method of FindStringExact which lets you specify where you start the search from, so you can skip the first one etc if you have duplicates. This could be handy for removing duplicates in a list.

如果找不到文本，则返回-1，否则返回组合列表中字符串的从0开始的索引。 还有一个FindStringExact的重载方法，可让您指定从何处开始搜索，因此，如果有重复项，则可以跳过第一个等。 这对于删除列表中的重复项可能很方便。

Clicking btnAddMany\_Click() clears the text from combo then clears the contents of the combo Items collection then calls combo.AddRange( to add the strings from the values array. After doing this, it sets the combo's SelectedIndex to 0. This shows the first element in the combo. If you are doing addition or deletion of items in a ComboBox then it's best to keep track of which item is selected. Setting SelectedIndex to -1 hides the selected items.

单击btnAddMany\_Click()会从组合中清除文本，然后清除组合中Items集合的内容，然后调用combo.AddRange(从值数组中添加字符串。完成此操作后，它将组合的SelectedIndex设置为0。这显示第一个元素如果要在ComboBox中添加或删除项目，则最好跟踪选定的项目，将SelectedIndex设置为-1将隐藏选定的项目。

The Add Lots button clears the list and adds 10,000 numbers. I have added combo.BeginUpdate() and combo,EndUpdate() calls around the loop to prevent any flicker from Windows trying to update the control. On my three year old PC it takes just over a second to add 100,000 numbers into the combo.

“添加手数”按钮将清除列表并添加10,000个号码。 我在循环周围添加了combo.BeginUpdate()和combo，EndUpdate()调用，以防止Windows尝试更新控件时出现闪烁。 在我三岁的PC上，将100,000个数字添加到组合中仅需一秒钟的时间。

**On the next page** Looking at ListViews

**在下一页上**查看ListViews

## 在C＃Winforms中使用ListViews **(** Working with ListViews in C\# Winforms **)** ##

![The sample ListView and controls][]

This is a handy control for displaying tabular data without the complexity of a grid. You can display items as large or small icons, as a list of icons in a vertical list or most usefully as a list of items and subitems in a grid and that's what we'll do here.

这是一个方便的控件，用于显示表格数据，而无需网格的复杂性。 您可以将项目显示为大或小图标，垂直列表中的图标列表，或者最有用的形式显示为网格中的项目和子项目的列表，这就是我们将在此处进行的操作。

After dropping a ListView on a form click the columns property and add 4 columns. These will be TownName, X, Y and Pop. Set the text for each ColumnHeader. If you can't see the headings on the ListView (after you've added all 4), set the ListView's View Property to Details. If you view the code for this example then browse down to where it says Windows Form Designer code and expand the region you see the code that creates the ListView. It's useful to see how the system works and you can copy this code and use it yourself.

将ListView放到窗体上后，单击columns属性并添加4列。 这些将是TownName，X，Y和Pop。 设置每个ColumnHeader的文本。 如果您看不到ListView的标题(添加全部4个后)，请将ListView的View属性设置为Details。 如果您查看此示例的代码，然后向下浏览至显示Windows窗体设计器代码的位置并展开区域，您将看到创建ListView的代码。 查看系统的工作方式非常有用，您可以复制此代码并自己使用。

You can set the width for each column manually by moving the cursor over the header and dragging it. Or you can do it in the code visible after you expanded the form designer region. You should see code like this:

您可以通过将光标移到标题上方并拖动来手动设置每列的宽度。 或者，您可以在扩展表单设计器区域后，在可见的代码中执行此操作。 您应该看到如下代码：

For the population column, Changes in the code are reflected in the designer and vice versa. Note that even if you set the Locked property to true this only affects the designer and at run-time you can resize columns.

对于总体列，代码的更改反映在设计器中，反之亦然。 请注意，即使将Locked属性设置为true，这也只会影响设计器，并且在运行时可以调整列的大小。

ListViews also come with a number of dynamic properties. Click the (Dynamic Properties) and tick the property you want. When you set a property to be dynamic, it creates an XML .config file and adds it to Solution Explorer.

ListViews还具有许多动态属性。 单击(动态属性)，然后勾选所需的属性。 当您将属性设置为动态时，它将创建一个XML .config文件并将其添加到解决方案资源管理器。

Making changes at design time is one thing but we really need to do it when the program is running. A ListView is made up of 0 or more items. Each item (a ListViewItem) has a text property and a SubItems collection. The first column displays the Item text, the next column displays SubItem\[0\].text then SubItem\[1\].text and so on.

在设计时进行更改是一回事，但是我们确实需要在程序运行时进行更改。 ListView由0或多个项目组成。 每个项目(一个ListViewItem)都有一个text属性和一个SubItems集合。 第一列显示项目文本，第二列显示SubItem \[0\] .text，然后显示SubItem \[1\] .text，依此类推。

I've added a button to add a row and an edit box for the Town Name. Enter any name in the box and click Add Row. This adds a new row to the ListView with the town name put in the first column and the next three columns (SubItems\[0..2\] ) are populated with random numbers (converted to strings) by adding those strings to them.

我添加了一个按钮，为“城镇名称”添加一行和一个编辑框。 在框中输入任何名称，然后单击“添加行”。 这会将新的行添加到ListView中，并将城镇名称放在第一列中，随后的三列(SubItems \[0..2\])通过将这些字符串添加到随机数中(转换为字符串)来填充。

>   
> ListViewItem LVI = list.Items.Add(tbName.Text) ;  
> ListViewItem LVI = list.Items.Add(tbName.Text);  
> LVI.SubItems.Add( R.Next(100).ToString()) ; // 0..99  
> LVI.SubItems.Add(R.Next(100).ToString()); // 0..99  
> LVI.SubItems.Add( R.Next(100).ToString()) ;  
> LVI.SubItems.Add(R.Next(100).ToString());  
> LVI.SubItems.Add((( 10+R.Next(10))\*50).ToString());  
> LVI.SubItems.Add((((10 + R.Next(10))\* 50).ToString());

**On the next page** : Updating a ListView

**下一页** ：更新ListView

## 以编程方式更新ListView **(** Updating a ListView Programmatically **)** ##

![Right Clicking the ListView control][]

By default when a ListViewItem is created it has 0 subitems so these have to be added. So not only do you have to add ListItems to a ListView but you have to add ListItem.SubItems to the ListItem.

默认情况下，创建ListViewItem时，它有0个子项，因此必须添加这些子项。 因此，不仅必须将ListItems添加到ListView，而且还必须将ListItem.SubItems添加到ListItem。

## 以编程方式删除ListView项目 **(** Removing ListView Items programmatically **)** ##

Now set the ListView Multiselect property to false. We only want to select one item at a time though if you wish to remove more in one go it's similar except you have to loop through in reverse. (If you loop in normal order and delete items then the subsequent items are out of sync with the selected indexes).

现在将ListView Multiselect属性设置为false。 我们只想一次选择一个项目，但是如果您想一次性删除更多项目，则除了删除内容必须反向循环之外，其他操作都差不多。 (如果按正常顺序循环并删除项目，则后续项目与所选索引不同步)。

The right click menu doesn't work yet as we have no menu items to display on it. So right click PopupMenu (below the form) and you'll see Context Menu appear at the top of the form where the normal Menu editor appears. Click it and where it says Type Here, type Remove Item. The properties window will show a MenuItem so rename that to mniRemove. Double click this menu item and you should get menuItem1\_Click event handler code function. Add this code so it looks like this.

右键菜单尚不可用，因为我们没有菜单项可显示。 因此，右键单击PopupMenu(在窗体下方)，您将看到Context Menu出现在窗体顶部，其中普通的菜单编辑器出现。 单击它，并在显示“在此处键入”的地方键入“删除项目”。 属性窗口将显示一个MenuItem，因此将其重命名为mniRemove。 双击此菜单项，您将获得menuItem1\_Click事件处理程序代码功能。 添加此代码，使其看起来像这样。

If you lose sight of the Remove Item, just click the PopupMenu control on its own under the form in the form Designer. That will bring it back into view.

如果您看不到“删除项”，则只需单击窗体设计器中窗体下方的PopupMenu控件即可。 这将使它重新出现。

>   
> \{  
> \{  
> ListViewItem L = list.SelectedItems\[0\];  
> ListViewItem L = list.SelectedItems \[0\];  
> if (L != null)  
> 如果(L！= null)  
> \{  
> \{  
> list.Items.Remove(L) ;  
> list.Items.Remove(L);  
> \}  
> \}  
> \}  
> \}

However if you run it and don't add an item and select it, when you right click and get the menu and click Remove Item, it will give an exception because there is no selected item. That's bad programming, so here's how you fix it. Double click the pop-up event and add this line of code.

但是，如果您运行它而不添加项目并选择它，则在右键单击并获得菜单并单击“删除项目”时，由于没有选择的项目，因此会出现异常。 那是不好的编程，所以这是解决它的方法。 双击弹出事件，然后添加以下代码行。

>   
> \{  
> \{  
> mniRemove.Enabled = (list.SelectedItems.Count > 0) ;  
> mniRemove.Enabled =(list.SelectedItems.Count> 0);  
> \}  
> \}

It only enables the Remove Item menu entry when there is a selected row.

仅当有选定行时，才启用“删除项目”菜单项。

**On the next page**  **在下一页**

: Using The DataGridView

：使用DataGridView

## 如何使用DataGridView **(** How To Use a DataGridView **)** ##

![The Sample DataGridView and other controls][]

A DataGridView is both the most complex and the most useful component provided for free with C\#. It works with both data sources (i.e. data from a database) and without (ie data that you add programmatically). For the rest of this tutorial I'll show using it without Data Sources, For simpler display needs you may find a plain ListView more suitable.

DataGridView是C＃免费提供的最复杂和最有用的组件。 它既适用于数据源(即来自数据库的数据)，也适用于两种数据源(即以编程方式添加的数据)。 对于本教程的其余部分，我将展示如何在没有数据源的情况下使用它。对于更简单的显示需求，您可能会发现普通的ListView更合适。

## DataGridView可以做什么？ **(** What Can a DataGridView do? **)** ##

If you've used an older DataGrid control then this is just one of those on steroids: it gives you more built in column types, can work with internal as well as external data, more customization of display (and events) and gives more control over cell handling with freezing rows and columns.

如果您使用的是较旧的DataGrid控件，那么这只是类固醇中的一种：它为您提供了更多内置列类型，可以使用内部和外部数据，可以对显示(和事件)进行更多的自定义并提供更多的控件冻结行和列的单元格处理。

When you're designing forms with grid data, it's most usual to specify different column types. You might have checkboxes in one column, readonly or editable text in another, and of courses numbers. These column types are also usually aligned diferently with numbers generally right aligned so the decimal points line up. At the column level you can choose from Button, checkbox, ComboBox,Image, TextBox and Links. if those aren't enough you can defibe your own custom types.

当使用网格数据设计表单时，最通常的是指定不同的列类型。 一列中可能有复选框，另一列中可能有只读或可编辑的文本，还有课程编号。 这些列类型通常也与数字对齐，而数字通常右对齐，因此小数点对齐。 在列级别，可以从“按钮”，“复选框”，“组合框”，“图像”，“文本框”和“链接”中进行选择。 如果还不够，您可以定义自己的自定义类型。

The easiest way to add columns is by designing in the IDE. As we've seen before this just writes code for you and when you've done it a few times you may prefer to add the code yourself. Once you've done this a few times it provides you with insights into how to do it programmatically.

添加列的最简单方法是在IDE中进行设计。 正如我们之前所看到的那样，这只是为您编写代码，几次完成后，您可能希望自己添加代码。 完成几次后，它为您提供了有关如何以编程方式进行操作的见解。

Let's start by adding some columns, Drop a DataGridView on the form and click the little arrow in the top right hand corner. Then click Add Column. Do this three times. It will pop up an Add Column dialog where you set the name of the column, the text to display at the column top and lets you choose its type. The first column is YourName and and it's the default TextBox (dataGridViewTextBoxColumn). Set the Header Text to yourname as well. Make the second column Age and use a ComboBox. The third column is Allowed and is a CheckBox Column.

让我们从添加一些列开始，在窗体上放置一个DataGridView并单击右上角的小箭头。 然后单击添加列。 这样做三遍。 它将弹出一个“添加列”对话框，您可以在其中设置列的名称，要显示在列顶部的文本，并可以选择其类型。 第一列是YourName，它是默认的TextBox(dataGridViewTextBoxColumn)。 还将“标题文本”设置为您的姓名。 将第二列设为Age并使用ComboBox。 第三列是允许的，并且是复选框列。

After adding all three you should see a row of three columns with a combo in the middle one (Age) and a checkbox in the Allowed column. If you click the DataGridView then in the properties inspector you should locate columns and click (collection). This pops up a dialog where you can set properties for each column such as individual cell colors, tooltip text, width, minimum width etc. If you compile and run you'll notice you can change column widths and run-time. In the property inspector for the main DataGridView you can set AllowUser to resizeColumns to false to prevent that.

将所有三列相加后，您应该看到一行三列，中间有一个组合(年龄)，在“允许”列中有一个复选框。 如果单击DataGridView，则应在属性检查器中找到各列，然后单击(集合)。 这会弹出一个对话框，您可以在其中设置每列的属性，例如各个单元格的颜色，工具提示文本，宽度，最小宽度等。如果进行编译和运行，您会发现可以更改列的宽度和运行时间。 在主DataGridView的属性检查器中，可以将AllowUser的resizeColumns设置为false来防止这种情况。

**On the next page:**  **在下一页上：**

Adding rows to the DataGridView

向DataGridView添加行

## 以编程方式将行添加到DataGridView **(** Adding rows to the DataGridView Programmatically **)** ##

![Setting the Event Handler for the Leave event][]

We're going to add rows to the DataGridView control in code and ex3.cs in the examples file has this code. Starting by adding a TextEdit box, a ComboBox and a button to the form with the DataGridView on it. Set the DataGridView property AllowUserto AddRows to false. I use labels as well and called the combobox cbAges, the button btnAddRow and the TextBox tbName. I've also added a Close Button for the form and double clicked it to generate a btnClose\_Click event handler skeleton. Adding the word Close() there makes that work.

我们将通过代码向DataGridView控件添加行，示例文件中的ex3.cs包含此代码。 首先添加一个TextEdit框，一个ComboBox和一个带有DataGridView的窗体按钮。 将DataGridView属性AllowUserto AddRows设置为false。 我也使用标签，并称为组合框cbAges，按钮btnAddRow和文本框tbName。 我还为该表单添加了一个“关闭按钮”，并双击它以生成btnClose\_Click事件处理程序框架。 在此处添加单词Close()即可完成该工作。

By default the Add Row button enabled property is set false on start. We don't want to add any rows to the DataGridView unless there is Text in both the Name TextEdit box and the ComboBox. I created the method CheckAddButton and then generated a Leave event handler for the Name Text edit box by double clicking next to the word Leave in the Properties when it was displaying the events. The Properties box shows this in the picture above. By default the Properties box shows properties but you can see event handlers by clicking the lightning button.

默认情况下，“添加行按钮”启用的属性在启动时设置为false。 除非名称TextEdit框和ComboBox中都包含Text，否则我们不希望向DataGridView添加任何行。 我创建了CheckAddButton方法，然后通过在显示事件时双击“属性”中“离开”一词旁边的名称文本编辑框来生成“离开”事件处理程序。 “属性”框在上图中显示了这一点。 默认情况下，“属性”框显示属性，但是您可以通过单击闪电按钮来查看事件处理程序。

>   
> \{  
> \{  
> btnAddRow.Enabled = (tbName.Text.Length > 0 && cbAges.Text.Length > 0) ;  
> btnAddRow.Enabled =(tbName.Text.Length> 0 && cbAges.Text.Length> 0);  
> \}  
> \}

You could use have used the TextChanged event instead, though this will call the CheckAddButton() method for every keypress rather than when teh control is leaved i.e. when another control gains focus. On the Ages Combo I used the TextChanged event but selected the tbName\_Leave event handler instead of doubleclicking to create a new event handler.

您可以使用已经使用TextChanged事件来代替，尽管这将为每个按键调用CheckAddButton()方法，而不是在离开控件时(即在另一个控件获得焦点时)。 在Ages Combo上，我使用了TextChanged事件，但是选择了tbName\_Leave事件处理程序，而不是双击来创建一个新的事件处理程序。

Not all events are compatible because some events provide extra parameters but if you can see a previously generated handler then yes you can use it. It's mostly a matter of preference, you can have a separate event handler for every control that you are using or share event handlers (as I did) when they have a common event signature, i.e. the parameters are the same.

并非所有事件都兼容，因为某些事件提供了额外的参数，但是如果您可以看到以前生成的处理程序，那么可以使用它。 通常，这是一个优先事项，您可以为正在使用的每个控件拥有一个单独的事件处理程序，或者在它们具有相同的事件签名(即参数相同)时共享事件处理程序(就像我一样)。

I renamed the DataGridView component to dGView for brevity and double clicked the AddRow to generate an event handler skeleton. This code below adds a new blank row, obtains that rows index (it's RowCount-1 as it's just been added and RowCount is 0 based) and then accesses that row via its index and sets the values in the cells on that row for the columns YourName and Age.

为了简洁起见，我将DataGridView组件重命名为dGView，然后双击AddRow生成事件处理程序框架。 下面的代码添加一个新的空白行，获取该行的索引(刚添加时为RowCount-1，而RowCount基于0)，然后通过其索引访问该行并为该行的单元格中的列设置值您的姓名和年龄。

>   
> int RowIndex = dGView.RowCount - 1;  
> int RowIndex = dGView.RowCount-1;  
> DataGridViewRow R= dGView.Rows\[RowIndex\];  
> DataGridViewRow R = dGView.Rows \[RowIndex\];  
> R.Cells\["YourName"\].Value = tbName.Text;  
> R.Cells \[“ YourName”\]。Value = tbName.Text;  
> R.Cells\["Age"\].Value = cbAges.Text;  
> R.Cells \[“ Age”\]。Value = cbAges.Text;

**On the next page:** Container Controls

**在下一页：**容器控件

## 使用带有控件的容器 **(** Using Containers with Controls **)** ##

![Overlapping Panel and GroupBox][]

When designing a form, you should think in terms of containers and controls and which groups of controls should be kept together. In Western cultures anyway, people read from Top Left to Bottom Right so make it easier to read that way.

设计表单时，应考虑容器和控件以及应将哪些控件组放在一起。 无论如何，在西方文化中，人们从左上角到右下角阅读，因此更容易阅读。

A container is any of the controls that can contain other controls. Those found in the Toolbox include the Panel, FlowLayoutpanel, SplitContainer, TabControl and TableLayoutPanel. If you can't see the toolbox, use the View menu and you'll find it. Containers hold controls together and if you move or resize the container it will affect the positioning of the controls. Just move controls over the container in the Form Designer and it will recognize that the Container is now in charge.

容器是可以包含其他控件的任何控件。 在“工具箱”中找到的面板包括Panel，FlowLayoutpanel，SplitContainer，TabControl和TableLayoutPanel。 如果看不到工具箱，请使用“查看”菜单，您将找到它。 容器将控件放在一起，如果您移动容器或调整容器大小，则会影响控件的位置。 只需将控件移到表单设计器中的容器上，它将识别出容器现在由负责人。

## 面板和组框 **(** Panels and GroupBoxes **)** ##

A Panel is similar to a GroupBox but a GroupBox can't scroll but can display a caption and has a border by default. Panels can have borders but by default don't. I use GroupBoxes because they look nicer and this is important because:

面板类似于GroupBox，但是GroupBox无法滚动，但可以显示标题，并且默认情况下具有边框。 面板可以有边框，但默认情况下没有。 我使用GroupBoxes是因为它们看起来更好，这很重要，因为：

*  **Bolton's Law** \- Users will usually rate nice looking software with bugs higher than plain looking software without bugs!
    
    **博尔顿定律** ( **Bolton's Law)** \-与没有漏洞的普通软件相比，用户通常会对带有错误的美观软件给予更高的评价！

Panels are handy for grouping containers as well, so you might have two or more GroupBoxes on a Panel.

面板也方便将容器分组，因此面板上可能有两个或多个GroupBox。

**Here is a tip** for working with containers. Drop a Split Container on a form. Click the left panel then the right one. Now try and remove the SplitContainer from the form. It's difficult until you right click on one of the panels and then click Select SplitContainer1. Once it's all selected you can delete it. Another way that applies to all controls and containers is **hit the Esc Key** to select the parent.

**这是**使用容器**的技巧** 。 将拆分容器放在窗体上。 单击左侧面板，然后单击右侧面板。 现在尝试从表单中删除SplitContainer。 除非您右键单击其中一个面板，然后单击“选择SplitContainer1”，否则很难。 全部选中后，您可以将其删除。 应用于所有控件和容器的另一种方法是**按Esc键**以选择父级。

Containers can nest inside each other as well. Just drag a small one on top of a larger one and you'll see a thin vertical line briefly appear to show that one is now inside the other. When you drag the parent container the child is moved with it. Example 5 shows this. By default the light brown panel is not inside the container so when you click the move button the GroupBox is moved but the panel isn't. Now drag the panel over the GroupBox so it is completely inside the Groupbox. When you compile and Run this time, clicking the Move button moves both together.

容器也可以相互嵌套。 只需在较大的一个顶部拖动一个较小的顶部，您会看到一条细的垂直线短暂出现，表明其中一个位于另一个内部。 当您拖动父容器时，子容器随之移动。 示例5显示了这一点。 默认情况下，浅棕色面板不在容器内，因此当您单击移动按钮时，GroupBox会被移动，但面板不会。 现在，将面板拖到GroupBox上，使其完全位于Groupbox内部。 这次编译并运行时，单击“移动”按钮将两者一起移动。

**On the next page:** Using TableLayoutPanels

**在下一页：**使用TableLayoutPanels

## 使用TableLayoutPanels **(** Using TableLayoutPanels **)** ##

![Using a TableLayoutPanel][]

A TableLayoutpanel is an interesting container. It's a table structure organized like a 2D grid of cells where each cell contains just one control. You can't have more than one control in a cell. You can specify how the table grows when more controls are added or even if it doesn't grow, It seems modeled on an HTML table because cells can span columns or rows. Even the anchoring behavior of child controls in the container depends up on Margin and Padding settings. We'll see more about anchors on the next page.

TableLayoutpanel是一个有趣的容器。 它是一种表格结构，就像一个二维的单元格网格一样，其中每个单元格仅包含一个控件。 一个单元格中不能有多个控件。 您可以指定在添加更多控件或不添加控件时表格如何增长。由于单元格可以跨越列或行，因此它似乎是基于HTML表格建模的。 甚至子控件在容器中的锚定行为也取决于“边距”和“填充”设置。 我们将在下一页上看到有关锚的更多信息。

In example Ex6.cs, I've started with a basic Two Column Table and specified via the Control and Row Styles dialog box (select the control and click the little right pointing triangle located near the top right to see a list of tasks and click the last one) that the left column is 40% and the right column 60% of the width. It lets you specify column widths in absolute pixel terms, in percentage or you can just let it AutoSize. A quicker way to get to this dialog is just click the Collection next to Columns in the Properties Window.

在示例Ex6.cs中，我从一个基本的“两列表”开始，并通过“控件和行样式”对话框指定(选择控件，然后单击右上角附近的小右指向三角形以查看任务列表，然后单击“确定”。最后一个)，左列为宽度的40％，右列为宽度的60％。 它允许您以绝对像素为单位指定列宽(以百分比表示)，也可以将其设置为AutoSize。 进入此对话框的更快方法是，单击“属性”窗口中“列”旁边的“集合”。

I've added an AddRow button and left the GrowStyle property with its default AddRows value. When the table gets full it adds another row. Alternatively you can set its values to AddColumns and FixedSize so it can't grow anymore. In Ex6, when you click the Add Controls button, it calls the AddLabel() method three times and AddCheckBox() once. Each method creates an instance of the control and then calls tblPanel.Controls.Add() After the 2nd control is added the third controls causes the table to grow. The picture shows it after teh Add Control button has been clicked once.

我添加了一个AddRow按钮，并为其默认的AddRows值保留了GrowStyle属性。 当表满时，它将添加另一行。 另外，您可以将其值设置为AddColumns和FixedSize，使其不再增长。 在Ex6中，当您单击“添加控件”按钮时，它将调用AddLabel()方法三次，并调用一次AddCheckBox()。 每个方法都创建控件的一个实例，然后调用tblPanel.Controls.Add()添加第二个控件后，第三个控件使表增长。 图片显示了一次单击添加控件按钮后的情况。

In case you're wondering where the default values come from in the AddCheckbox() and AddLabel() methods that I call, the control was originally manually added to the table in the designer and then the code to create it and initialize it was copied from within this region. You'll find the initialization code in the InitializeComponent method call once you click the + to the left of the Region below:

如果您想知道默认值来自于我调用的AddCheckbox()和AddLabel()方法中，则该控件最初是在设计器中手动添加到表中的，然后复制了用于创建和初始化它的代码来自该区域内。 单击下面的Region左侧的+，即可在InitializeComponent方法调用中找到初始化代码：

> Windows Form Designer generated code

> Windows Form Designer生成的代码

**On the next page:** Some Common Properties you should know

**在下一页：**您应该知道的一些常用属性

## 您应该知道的通用控件属性 **(** Common Control Properties you should know **)** ##

![Using Anchors][]

You can select multiple controls at the same time by holding down the shift key when you select the second and subsequent controls, even controls of different types. The Properties window shows just those properties common to both, so you can set them all to the same size, color and text fields etc. Even the same event handlers can be assigned to multiple controls.

您可以在选择第二个及后续控件(甚至不同类型的控件)时按住Shift键，从而同时选择多个控件。 “属性”窗口仅显示这两个属性共有的属性，因此您可以将它们全部设置为相同的大小，颜色和文本字段等。甚至可以将相同的事件处理程序分配给多个控件。

## 锚定 **(** Anchors Aweigh **)** ##

Depending on the use, some forms will often end up being resized by the user. Nothing looks worse than resizing a form and seeing controls stay in the same position. All controls have anchors that let you "attach" them to the 4 edges so that the control moves or stretches when an attached edge is moved. This leads to the following behavior when a form is stretched from the right edge:

根据用途，某些表格通常最终会被用户调整大小。 没有什么比调整表单大小和看到控件保持相同位置更糟糕的了。 所有控件都有锚点，使您可以将它们“附加”到4个边上，以便在移动附加边时控件可以移动或拉伸。 从右边缘拉伸表单时，这导致以下行为：

1.  Control Attached to Left but not right. - It Doesn't move or stretch (bad!)
    
    控件附加到左，但不附加到右。 -它不会移动或伸展(不好！)
2.  Control attached to both left and right edges. It stretches when the form is stretched.
    
    控件附在左右两侧。 拉伸表单时会拉伸。
3.  Control attached to right edge. It moves when the form is stretched.
    
    控件连接到右边缘。 拉伸表单时它会移动。

For buttons like Close which are traditionally in the bottom right, behavior 3 is what is needed. ListViews and DataGridViews are best with 2 if the number of columns is enough to overflow the form and needs scrolling). The Top and Left anchors are the default. The Property Window includes a nifty little editor that looks like the England Flag. Just click any of the bars (two horizontal and two vertical) to set or clear the appropriate anchor, as shown in the picture above.

对于传统上位于右下角的“关闭”按钮，需要使用行为3。 如果列数足以使表单溢出并且需要滚动，则ListViews和DataGridViews最好使用2。 顶部和左侧锚是默认设置。 属性窗口包括一个漂亮的小编辑器，看起来像英格兰国旗。 只需单击任一条(两个水平和两个垂直)以设置或清除适当的锚点，如上图所示。

## 沿标签 **(** Tagging Along **)** ##

One property that doesn't get much mention is the Tag property and yet it can be incredibly useful. In the Properties Window you can only assign text but in your code you can have any value that descends from Object.

Tag属性是其中一个很少被提及的属性，但是它却非常有用。 在“属性”窗口中，您只能分配文本，但是在代码中，您可以具有任何从Object继承的值。

I've used Tag to hold an entire object while only showing a few of its properties in a ListView. For instance you might only want to show a Customer Name and number in a Customer Summary list. But right click on the selected customer and then open a form with all the customer's details. This is easy if when you build up the customer list by reading all customer's details in memory and assigning a reference to the Customer Class Object in the Tag. All controls have a Tag.

我使用Tag来容纳整个对象，而只在ListView中显示其一些属性。 例如，您可能只想在“客户摘要”列表中显示“客户名称”和号码。 但是，右键单击选定的客户，然后打开包含所有客户详细信息的表单。 如果您通过读取内存中所有客户的详细信息并在标记中分配对客户类对象的引用来建立客户列表，则这很容易。 所有控件都有一个标签。

**On the next page:**  **在下一页上：**

How to work with TabControls

如何使用TabControls

## 使用TabTabControls **(** Working With TabTabControls **)** ##

![Tbe Two Tabs TabControl][]

A TabControl is a handy way to save form space by having multiple tabs. Each tab can have an icon or text and you can select any tab and display its controls. The TabControl is a container but it only contains TabPages. Each TabPage is also a container that can have normal controls added to it.

TabControl是通过具有多个选项卡来节省表单空间的便捷方法。 每个选项卡可以具有图标或文本，您可以选择任何选项卡并显示其控件。 TabControl是一个容器，但仅包含TabPages。 每个TabPage也是一个可以向其中添加常规控件的容器。

In example x7.cs, I've created a two tab page panel with the first tab called Controls having three buttons and a checkbox on it. The second tab page is labeled Logs and used to display all the logged actions which includes clicking a button or toggling a check box. A method called Log() is called to log every button click etc. It adds the supplied string to a ListBox.

在示例x7.cs中，我创建了两个选项卡的页面面板，第一个选项卡名为Controls，上面有三个按钮和一个复选框。 第二个标签页标记为“日志”，用于显示所有已记录的操作，包括单击按钮或切换复选框。 调用Log()方法来记录每次按钮单击等情况。它将提供的字符串添加到ListBox。

I've also added two right click popup menus items to the TabControl in the usual way. First add a ContextMenuStrip to the form and set it in the ContextStripMenu property of the TabControl. The two menu choices are Add New Page and Remove This Page. However I've restricted the Page removal so only newly added tab pages can be removed and not the original two.

我还以通常的方式向TabControl添加了两个右键单击弹出菜单项。 首先将ContextMenuStrip添加到窗体，然后在TabControl的ContextStripMenu属性中进行设置。 这两个菜单选项是“添加新页面”和“删除此页面”。 但是，我限制了页面的删除，因此只能删除新添加的选项卡页面，而不能删除原来的两个页面。

## 添加新的标签页 **(** Adding a New Tab Page **)** ##

This is easy, just create a new tab page, give it a Text caption for the Tab then add it to the TabPages collection of the Tabs TabControl

这很容易，只需创建一个新的标签页，为它提供一个Tab标签的文本标题，然后将其添加到Tabs TabControl的TabPages集合中

>   
> newPage.Text = "New Page";  
> newPage.Text =“新页面”;  
> Tabs.TabPages.Add(newPage);  
> Tabs.TabPages.Add(newPage);

In the ex7.cs code I've also created a label and added that to the TabPage. The code was obtained by adding it in the Form designer to create the code then copying it.

在ex7.cs代码中，我还创建了一个标签并将其添加到TabPage。 通过在表单设计器中添加代码来创建代码，然后复制代码，即可获得代码。

Removing a page is just a matter of calling TabPages.RemoveAt(), using the Tabs.SelectedIndex to get the currently selected Tab.

删除页面仅需使用Tabs.SelectedIndex调用TabPages.RemoveAt()即可获取当前选定的Tab。

## 结论 **(** Conclusion **)** ##

In this tutorial we've seen how some of the more sophisticated controls work and how to use them. In the next tutorial I'm going to continue with the GUI theme and look at the background worker thread and show how to use it.

在本教程中，我们已经看到了一些更复杂的控件如何工作以及如何使用它们。 在下一个教程中，我将继续讨论GUI主题，并查看后台工作线程并显示如何使用它。

> 翻译自: [https://www.thoughtco.com/programming-advanced-winforms-in-c-958378][https_www.thoughtco.com_programming-advanced-winforms-in-c-958378]

winforms教程

[WinForm with ComboBox]: /images/20221123/a716dc361d7c4e2dae1f9979436c3a63.png
[The sample ListView and controls]: /images/20221123/e808db34f7874c9f9993ac5d5f909823.png
[Right Clicking the ListView control]: /images/20221123/475af6e8a07746bd96622993c49db0b2.png
[The Sample DataGridView and other controls]: /images/20221123/bdf5b2d3ea2c4edeb3864e8029504876.png
[Setting the Event Handler for the Leave event]: /images/20221123/9689ed7cf93c40259788c0e6121b37e2.png
[Overlapping Panel and GroupBox]: /images/20221123/3288f03a3e0046579a464f11245ca620.png
[Using a TableLayoutPanel]: /images/20221123/fd175ae150ee4e8ab7c45cd5173292c1.png
[Using Anchors]: /images/20221123/a2d70c72c1614467aec81269a15a3ec4.png
[Tbe Two Tabs TabControl]: /images/20221123/e563042f94dd48d59c192881e2e532d4.png
[https_www.thoughtco.com_programming-advanced-winforms-in-c-958378]: https://www.thoughtco.com/programming-advanced-winforms-in-c-958378