Control content control of WPF introductory notes

First, the control class

　　Elements that interact with the user in WPF, or . All controls of elements that can receive focus and receive keyboard and mouse input inherit from the Control class.

1. Common properties:

1.1 Foreground: foreground brush/foreground color (text color)

1.2 Background: Background brush/background color

// Use RBG to set color 
Btn_1.Foreground = new SolidColorBrush(Color.FromRgb( 120 , 157 , 200 ));
 // Use color enumeration to set color 
Btn_1.Foreground = new SolidColorBrush(Colors.DarkGoldenrod);
 // Use system color enumBtn_1.Background 
= SystemColors.ActiveCaptionBrush;

1.3 FontFamily: set the font

When FontFamily is set to multiple values, if the first font does not exist, the second font is used and so on

<Button Name="Btn_1" FontFamily="Arial,Calibri,Cambria" >
     <Button.Content>
       this is button
     </Button.Content>
</Button>

Fonts installed on the system: Fonts.SystemFontFamilies

foreach (var item in Fonts.SystemFontFamilies)
{
    lstBox_Message.Items.Add(item.Source);
}    

Set the font property of any element, and the value of the property will be inherited downwards. If you set the font to the top-level element of the window, then all elements under the window will inherit this font

1.4 FontSize: font size

1.5 FontStyle: font style (italic)

1.6 FontWeight: font weight

1.7 FontStretch: The angle at which the font can be stretched

<StackPanel Orientation="Horizontal">
      <Button Name="Btn_1" BorderBrush="Black" BorderThickness="2" Content="Border"></Button>
      <Button Name="Btn_2" Content="FontStyle" FontStyle="Oblique" FontWeight="Black"></Button>
      <Button Name="Btn_3" Content="FontWeight" FontStyle="Oblique"></Button>
      <Button Name="Btn_4" Content="FontSize" FontSize="15"></Button>
      <Button Name="Btn_5" Content="Fimaly" FontFamily="Arial"></Button>
</StackPanel>

1.8 BorderThickness: the size of the border

1.9 BorderBrush: Border brush (border color)

<Button Name="Btn_1" BorderBrush="Black" BorderThickness="2">
       this is button
</Button>

1.10 Padding: padding

1.11 HorizontalContentAlignment: The position of the content in the horizontal direction

1.12 VerticalContentAlignment: The vertical position of the content

1.13 Template: Template

1.14 IsTabStop: whether to include a control in the tab navigation

1.15 TabIndex: Determines the order in which elements receive focus when the user uses the Tab key to navigate within the control

2. Content Control

　　A content control, which can contain a piece of content to display. Can only contain one (can only contain one child element). Unlike layout containers, layout containers can contain unrestricted child elements. Content controls all inherit from the ContentControl class

1. Content property

Conent only accepts a single object (of any type)

         < StackPanel > 
            <!-- Set the Content property directly --> 
            < Button Content = "button" Margin = "5" ></ Button > 
            <!-- Nest a child element --> 
            < Button Margin = "5" > 
                < TextBlock > this is TextBlock </ TextBlock > 
            </ Button > 
            <!-- Contains a layout element to nest multiple child elements --> 
            < Button Margin ="5" > 
                < StackPanel >
                    <Label BorderBrush="Black" BorderThickness="1">this is Label</Label>
                    <Label BorderBrush="Aquamarine" BorderThickness="1" >this is Label</Label>
                    <Label BorderBrush="Beige" BorderThickness="1">this is Label</Label>
                </StackPanel>
            </Button>
        </StackPanel>

2. Set the alignment and ToolTip

HorizontalContentAlignment: Horizontal alignment

VerticalContentAlignment: vertical alignment

ToolTip: When the mouse moves to the element, the prompt content is displayed

<Button Content="button" ToolTip="ToolTip case" Margin="5" HorizontalContentAlignment="Left" ></Button>

<Button Content="button" Margin="5" HorizontalContentAlignment="Right" ></Button>

3. Content control with title

　　3.1 GroupBox 

　　　　　　　　　　<GroupBox Header="GroupBox">
                    <StackPanel>
                        <RadioButton Margin="2">RadioButton1</RadioButton>
                        <RadioButton Margin="2">RadioButton2</RadioButton>
                        <RadioButton Margin="2">RadioButton3</RadioButton>
                    </StackPanel>
                </GroupBox>

　　3.2 TabItem 

 　　　　<TabControl>
            <TabItem Header="TabItem"></TabItem>
            <TabItem Header="GroupBox"></TabItem>
            <TabItem Header="Expander"></TabItem>
　　　　</TabControl>

　　3.3 Expander

　　　　　　　　　　<StackPanel>
                    <Expander Header="Expander">
                        <StackPanel>
                            <RadioButton Margin="2">RadioButton1</RadioButton>
                            <RadioButton Margin="2">RadioButton2</RadioButton>
                            <RadioButton Margin="2">RadioButton3</RadioButton>
                        </StackPanel>
                    </Expander>
                </StackPanel>