WPF (6) Introduction to content controls with titles in WPF

WPF (6) Introduction to content controls with titles in WPF

Introduction to StackPanel, WarpPanel, DockPanel, Grid, Canvas use of Five layout containers in the article of the WPF-XAML layout control, this gives us a general idea of where containers can be used. Today, let's take a look at three headers in WPF, GroupBox, TabControl, and Expander.

I. GroupBox controls

This control can be called a group control. You can put a series of controls that have been packaged with layout controls into a group. For example, you can put the controls in RadioButton, you can group the single-choice buttons without setting GroupName. This GroupBox is a control with rounded corners and a label and content, which is like this:

 

Creating a GroupBox is that simple. Okay, this is the use of GroupBox. Of course, the Header can use more complex logic. Note: When I first started using WPF, I used GroupBox for the layout of the logon box. I found that tags cannot be placed again after I put a tag. After thinking about the layout control StackPanel on the GroupBox control, there is no problem in putting multiple controls. Therefore, when you place Multiple widgets, You need to place the layout controls.

Ii. TabControl Control

TabItem is a page in TabControl. You need to add the pages in a TabControl by yourself. The default tab is a string, for example, Tab 1. See what TabControl looks like.

 

The tab can be a string or an image. Next, we can change the text on TAB 1 to an image. View the actual results

 

Only adding images cannot meet the actual design requirements. The TabControl in WPF can also be used as a combination of images and texts. Look

 

This is the default mode. You can select the Top of the bar and set it to the side display. You can set the TabStripPlacement attribute in four modes: Left, Right, Bottom, Top (default ).

 

3. Expander Control

The Expander control is an extensible control. Its content is hidden by default. It does not show all information on the interface, just like the help interface, if you want to know what kind of things, you can expand the Expander. The default style of the system is not very good. We can use custom templates to improve the style. First, let's take a look at the use of the Expander control.

 

I have defined four Expender and the expanded content uses four different color annotations. They are different ways of expansion. Note that ExpandDirection is used to control the Expansion direction, and the content is embedded in its own things. This is so simple. Finally, let's take a look at the program results.

 

The basic usage of the three controls has been briefly introduced here. You should know how to use the three content controls with titles. In fact, it will be very easy after you perform the operations again. WPF is the core of programming back to the data driver mode. Next we will go to data-driven Learning and get to know Binding.