Study with Me WPF (3): WPF Control Basics

Source: Internet
Author: User

Introduction to WPF Controls

With an introduction to the previous XAML language, we know that XAML is a tree structure, and that WPF controls, as part of the entire XAML tree, are also a tree-shaped structure. Let's look at a simple example.

<Button.Content> <DockPanel> <image source="F:\01.Code\01.MyCode\WpfApplication1\WpfApplication1\Resources\. jpg"Width=" -"/> <textblock text="Red"Foreground="Red"Verticalalignment="Center"></TextBlock> <textblock text="Green"Foreground="Green"Verticalalignment="Center"/> <textblock text="Blue"Foreground="Blue"Verticalalignment="Center"/> </DockPanel> </Button.Content>

Interface Display effect

A friend who has not been exposed to WPF may be amazed at how much content there is in a button. We can view the inheritance relationship of the button class through Vs's Object Browser:


FrameworkElement is the presentation base class for all WPF interface elements (FrameworkElement inherits from Uielement->object), Button inherits ContentControl, Allows the button to have a container control with the characteristics that allow the button to have a content, and this content can be another

A device or a control, as to what is specific inside, depends entirely on what you want. This is also the charm of WPF, any control is a tree structure, and each level of the tree structure can be freely customized, theoretically we can customize any level of style, to achieve any of the interface we want to show the effect.

WPF Control Classifications

Above we talked about the button inherited from ContentControl, it should be said to belong to a content control, the following our system of WPF control classification, according to my own understanding, we have two classification methods.

First, according to the control of the inheritance characteristics of classification

Let's take a look at the inheritance relationship between the entire WPF interface element class:

    • Panel: Layout controls, including canvas, DockPanel, StackPanel, and so on, can hold more than one basic control (control) or nested other layout controls. For the layout of the overall interface, the controls under the panel will be explained in the next article.
    • Control: Basic Controls
    • ContentControl: A content control whose content can only be a basic control or layout control, typically uses a layout control as its content, and then uses multiple basic spaces in the layout space to achieve complex interface effects under which basic controls have a label, Button, Tooltip.
    • Headercontentcontrol: Content control with caption, inherited from ContentControl, adds a header property on ContentControl basis. The underlying controls are TabItem, GroupBox, etc.
    • ItemsControl: A multi-entry control under which basic controls have a ListBox, menu, and so on
    • Headeritemscontrol: Inherited from ItemsControl, added header property, under which controls are MenuItem, TreeViewItem, toolbar, etc.
    • TextBox: Basic text input control.
    • TextBlock, Image: directly inherit from the Frameworkelemet base class, belonging to the most common basic control.

Ii. classification According to the sensory characteristics of the control

The sensory properties Here I define is to stand in the perspective of an ordinary user, can see, perceive things. Here, WPF controls fall into two categories:

1. Basic controls: controls that users can see and interact with, such as buttons, input boxes, and so on, mainly cover the control, TextBlock, and image sections above

2, Layout control: The user is not aware of, but the system interface layout has a decisive role in the container class control, mainly covers the above panel and its sub-class parts

The article will be described in a later description by this classification method.

WPF Control Properties

From the above, we know that all the controls (basic controls, container controls) inherit from the base class FrameworkElement, which defines most of the properties that WPF controls use, and we first introduce the properties that these WPF controls have (common red). The subsequent introduction of the common basic controls is followed by an introduction to the unique properties.

  • ActualHeight: Gets the rendering height of this element.
  • ActualWidth: Gets the rendering width of the secondary element.
  • BindingGroup: Gets or sets the System.Windows.Data.BindingGroup used for the element
  • ContextMenu: Gets or sets the context menu for the element, usually the mail menu.
  • Cursor : Gets or sets the cursors that appear when the mouse pointer hovers over this element
  • DataContext: Gets or sets the data context in which the element participates in data binding.
  • Defaultstylekey: Gets or sets the key that is used to reference the style of this control when the theme style is used or defined.
  • FlowDirection: Gets or sets the flow direction of text and other UI elements in any parent element that controls their layout. is an enumeration value. The default value is System.Windows.FlowDirection.LeftToRight
  • FocusVisualStyle: Gets or sets a property that supports customizing the appearance, effect, or other style characteristics that apply to this element when the keyboard focus is captured on this element
  • Forcecursor: Gets or sets a value that indicates whether this element should force the UI to render the cursor in the manner declared by the cursor property.
  • Height: Gets or sets the recommended height of the element.
  • HorizontalAlignment: Gets or sets the horizontal alignment feature that is applied to this element when it is formed in a parent element, such as a panel or item control.
  • InputScope: Gets or sets the input context used by this element
  • IsInitialized: Gets a value that indicates whether this element has been initialized.
  • IsLoaded: Gets a value that indicates whether this element is loaded for rendering.
  • Language: Gets or sets the localization/globalization language information that applies to an element
  • LayoutTransform: Gets or sets the graphic conversion method that should be applied to this element when the layout is executed.
  • Logicalchildren: Gets an enumerator for the logical child elements of this element.
  • margin: Gets or sets the margin of the element. The recognition value is a System.Windows.Thickness that all properties are equal to 0 (0).
  • maxheight: Gets or sets the maximum height constraint for an element.
  • MaxWidth: Gets or sets the maximum width constraint for the element.
  • minheight: Gets or sets the minimum height constraint for the element.
  • MinWidth: Gets or sets the minimum width constraint for the element.
  • Name: Gets or sets the identity name of the element. The name provides a reference so that after the markup element is constructed by the XAML processor during processing, the background code can reference the element.
  • Overridesdefaultstyle: Gets or sets a value that indicates whether this element incorporates style attributes from a theme style.
  • Parent: Gets the logical parent element of this element.
  • Resources: Gets or sets a locally defined resource dictionary.
  • Style: Gets or sets the style used by this element when it is rendered.
  • Tag: Gets or sets an arbitrary object value that can be used to store custom information about this element.
  • TemplatedParent: Gets a reference to the template parent of this element. If this element is not created from a template, this property is not relevant
  • ToolTip: Gets or sets the ToolTip object that is displayed for this element in the UI.
  • Triggers: Gets a collection of triggers that are established directly on this element or established in child elements.
  • VerticalAlignment: Gets or sets the vertical alignment feature that is applied to this element when it is combined in a parent element, such as a panel or item control.
  • Visualchildrencount: Gets the number of visual child elements within this element.
  • Width : Gets or sets the width of the element.

Where read-write properties (attributes with Get or set descriptions) can be used in XAML, read-only properties (only properties that are described) are available in the background code only.

WPF Control Declarations

Explain the use of WPF controls with a simple button definition

1. Declaring in XAML

You can find the button control from the Toolbox and drag it directly onto the form, then generate a XAML statement in the appropriate location, and personally recommend the use of handwritten XAML to make sure that the control appears where you want it.

<button height= "width=" name= "MyButton"/>

This statement declares a button object with the name MyButton, a height of 30, and a width of 120, which we can access and use directly in the background code, such as:

MyButton. height=25; The height of the button object can be modified to 25.

2, in the background. Declaration in CS Code


Next we will learn how to use the basic controls such as label, TextBLock, Button, TextBox, and so on in WPF.

Study with Me WPF (3): WPF Control Basics

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.