SteuerelementeControls

Windows Presentation Foundation (WPF)Windows Presentation Foundation (WPF)umfasst viele der allgemeinen Benutzeroberflächen Komponenten, die in nahezu jeder Windows-Anwendung verwendet werden, z Button. Labelb. Menu,, ListBox TextBox, und.Windows Presentation Foundation (WPF)Windows Presentation Foundation (WPF) ships with many of the common UI components that are used in almost every Windows application, such as Button, Label, TextBox, Menu, and ListBox. In der Vergangenheit wurden diese Objekte als Steuerelemente bezeichnet.Historically, these objects have been referred to as controls. Das WPFWPF SDK verwendet zwar weiterhin den Begriff "Steuerelement", um eine Klasse, die ein sichtbares Objekt in einer Anwendung repräsentiert, locker zu verwenden, aber es ist wichtig zu beachten, dass eine Klasse Control nicht von der Klasse erben muss, um eine sichtbare Präsenz zu erhalten.While the WPFWPF SDK continues to use the term "control" to loosely mean any class that represents a visible object in an application, it is important to note that a class does not need to inherit from the Control class to have a visible presence. Klassen, die von der Control -Klasse erben ControlTemplate, enthalten ein-Element, mit dem der Consumer eines Steuer Elements die Darstellung des Steuer Elements radikal ändern kann, ohne eine neue Unterklasse erstellen zu müssen.Classes that inherit from the Control class contain a ControlTemplate, which allows the consumer of a control to radically change the control's appearance without having to create a new subclass. In diesem Thema wird erläutert, wie Steuerelemente (sowohl die, Control die von der-Klasse erben, als auch die, WPFWPFdie nicht) häufig in verwendet werden.This topic discusses how controls (both those that do inherit from the Control class and those that do not) are commonly used in WPFWPF.

Erstellen einer Instanz eines SteuerelementsCreating an Instance of a Control

Sie können ein-Steuerelement zu einer Anwendung hinzufügen Extensible Application Markup Language (XAML)Extensible Application Markup Language (XAML) , indem Sie entweder oder Code verwenden.You can add a control to an application by using either Extensible Application Markup Language (XAML)Extensible Application Markup Language (XAML) or code. Im folgenden Beispiel wird veranschaulicht, wie Sie eine einfache Anwendung erstellen, die Vor- und Nachname eines Benutzers abfragt.The following example shows how to create a simple application that asks a user for their first and last name. In diesem Beispiel werden sechs Steuerelemente erstellt: zwei Bezeichnungen, zwei Textfelder und zwei Schalt XAMLXAMLFlächen in.This example creates six controls: two labels, two text boxes, and two buttons, in XAMLXAML. Alle Steuerelemente können auf ähnliche Weise erstellt werden.All controls can be created similarly.

<Grid>
  <Grid.RowDefinitions>
    <RowDefinition Height="30"/>
    <RowDefinition Height="30"/>
    <RowDefinition Height="30"/>
    <RowDefinition/>
  </Grid.RowDefinitions>
  <Grid.ColumnDefinitions>
    <ColumnDefinition/>
    <ColumnDefinition/>
  </Grid.ColumnDefinitions>

  <Label>
    Enter your first name:
  </Label>
  <TextBox Grid.Row="0" Grid.Column="1" 
           Name="firstName" Margin="0,5,10,5"/>

  <Label Grid.Row="1" >
    Enter your last name:
  </Label>
  <TextBox Grid.Row="1" Grid.Column="1" 
           Name="lastName" Margin="0,5,10,5"/>

  <Button Grid.Row="2" Grid.Column="0" 
          Name="submit" Margin="2">
    View message
  </Button>

  <Button Grid.Row="2" Grid.Column="1" 
          Name="Clear" Margin="2">
    Clear Name
  </Button>
</Grid>

Im folgenden Beispiel wird die gleiche Anwendung in Code erstellt.The following example creates the same application in code. Aus Gründen der Kürze wurde die Erstellung von Grid, grid1, aus dem Beispiel ausgeschlossen.For brevity, the creation of the Grid, grid1, has been excluded from the sample. grid1hat dieselben Spalten-und Zeilen Definitionen wie im vorherigen XAMLXAML Beispiel gezeigt.grid1 has the same column and row definitions as shown in the preceding XAMLXAML example.

Label firstNameLabel;
Label lastNameLabel;
TextBox firstName;
TextBox lastName;
Button submit;
Button clear;

void CreateControls()
{
    firstNameLabel = new Label();
    firstNameLabel.Content = "Enter your first name:";
    grid1.Children.Add(firstNameLabel);

    firstName = new TextBox();
    firstName.Margin = new Thickness(0, 5, 10, 5);
    Grid.SetColumn(firstName, 1);
    grid1.Children.Add(firstName);

    lastNameLabel = new Label();
    lastNameLabel.Content = "Enter your last name:";
    Grid.SetRow(lastNameLabel, 1);
    grid1.Children.Add(lastNameLabel);

    lastName = new TextBox();
    lastName.Margin = new Thickness(0, 5, 10, 5);
    Grid.SetColumn(lastName, 1);
    Grid.SetRow(lastName, 1);
    grid1.Children.Add(lastName);

    submit = new Button();
    submit.Content = "View message";
    Grid.SetRow(submit, 2);
    grid1.Children.Add(submit);

    clear = new Button();
    clear.Content = "Clear Name";
    Grid.SetRow(clear, 2);
    Grid.SetColumn(clear, 1);
    grid1.Children.Add(clear);

}
Private firstNameLabel As Label
Private lastNameLabel As Label
Private firstName As TextBox
Private lastName As TextBox
Private submit As Button
Private clear As Button

Sub CreateControls()
    firstNameLabel = New Label()
    firstNameLabel.Content = "Enter your first name:"
    grid1.Children.Add(firstNameLabel)

    firstName = New TextBox()
    firstName.Margin = New Thickness(0, 5, 10, 5)
    Grid.SetColumn(firstName, 1)
    grid1.Children.Add(firstName)

    lastNameLabel = New Label()
    lastNameLabel.Content = "Enter your last name:"
    Grid.SetRow(lastNameLabel, 1)
    grid1.Children.Add(lastNameLabel)

    lastName = New TextBox()
    lastName.Margin = New Thickness(0, 5, 10, 5)
    Grid.SetColumn(lastName, 1)
    Grid.SetRow(lastName, 1)
    grid1.Children.Add(lastName)

    submit = New Button()
    submit.Content = "View message"
    Grid.SetRow(submit, 2)
    grid1.Children.Add(submit)

    clear = New Button()
    clear.Content = "Clear Name"
    Grid.SetRow(clear, 2)
    Grid.SetColumn(clear, 1)
    grid1.Children.Add(clear)


End Sub 'CreateControls

Ändern der Darstellung eines SteuerelementsChanging the Appearance of a Control

Es ist üblich, die Darstellung eines Steuerelements zu ändern, sodass es zum Aussehen und Verhalten der Anwendung passt.It is common to change the appearance of a control to fit the look and feel of your application. Sie können die Darstellung eines Steuerelements je nach Absicht auf eine der folgenden Weisen ändern:You can change the appearance of a control by doing one of the following, depending on what you want to accomplish:

  • Ändern des Werts einer Eigenschaft des Steuerelements.Change the value of a property of the control.

  • Erstellen Sie Style einen für das-Steuerelement.Create a Style for the control.

  • Erstellen Sie ein ControlTemplate neues-Element für das-Steuerelement.Create a new ControlTemplate for the control.

Ändern eines Eigenschaftswerts eines SteuerelementsChanging a Control's Property Value

Viele Steuerelemente verfügen über Eigenschaften, mit denen Sie die Darstellung des Steuer Elements ändern können Background , z Button. b. die eines-Steuer Elements.Many controls have properties that allow you to change how the control appears, such as the Background of a Button. Sie können die Wert Eigenschaften sowohl XAMLXAML in als auch in Code festlegen.You can set the value properties in both XAMLXAML and code. Im folgenden Beispiel werden die BackgroundEigenschaften FontSize, und FontWeight für einen Button in XAMLXAMLfestgelegt.The following example sets the Background, FontSize, and FontWeight properties on a Button in XAMLXAML.

<Button FontSize="14" FontWeight="Bold">
  <!--Set the Background property of the Button to
    a LinearGradientBrush.-->
  <Button.Background>
    <LinearGradientBrush StartPoint="0,0.5" 
                            EndPoint="1,0.5">
      <GradientStop Color="Green" Offset="0.0" />
      <GradientStop Color="White" Offset="0.9" />
    </LinearGradientBrush>

  </Button.Background>
  View message
</Button>

Im folgenden Beispiel werden die gleichen Eigenschaften in Code festgelegt.The following example sets the same properties in code.

LinearGradientBrush buttonBrush = new LinearGradientBrush();
buttonBrush.StartPoint = new Point(0, 0.5);
buttonBrush.EndPoint = new Point(1, 0.5);
buttonBrush.GradientStops.Add(new GradientStop(Colors.Green, 0));
buttonBrush.GradientStops.Add(new GradientStop(Colors.White, 0.9));

submit.Background = buttonBrush;
submit.FontSize = 14;
submit.FontWeight = FontWeights.Bold;
Dim buttonBrush As New LinearGradientBrush()
buttonBrush.StartPoint = New Point(0, 0.5)
buttonBrush.EndPoint = New Point(1, 0.5)
buttonBrush.GradientStops.Add(New GradientStop(Colors.Green, 0))
buttonBrush.GradientStops.Add(New GradientStop(Colors.White, 0.9))

submit.Background = buttonBrush
submit.FontSize = 14
submit.FontWeight = FontWeights.Bold

Erstellen eines Stils für ein SteuerelementCreating a Style for a Control

WPFWPFbietet Ihnen die Möglichkeit, die Darstellung von Steuerelementen im Großhandel anzugeben, anstatt Eigenschaften für jede Instanz in der Anwendung festzulegen, Styleindem Sie einen erstellen.gives you the ability to specify the appearance of controls wholesale, instead of setting properties on each instance in the application, by creating a Style. Im folgenden Beispiel wird eine Style erstellt, die auf jede Button in der Anwendung angewendet wird.The following example creates a Style that is applied to each Button in the application. StyleDefinitionen werden in der Regel XAMLXAML in einer ResourceDictionarydefiniert, z FrameworkElement. Resources b. die-Eigenschaft von.Style definitions are typically defined in XAMLXAML in a ResourceDictionary, such as the Resources property of the FrameworkElement.

<Style TargetType="Button">
  <Setter Property="FontSize" Value="14"/>
  <Setter Property="FontWeight" Value="Bold"/>
  <Setter Property="Background">
    <Setter.Value>
      <LinearGradientBrush StartPoint="0,0.5" 
                              EndPoint="1,0.5">
        <GradientStop Color="Green" Offset="0.0" />
        <GradientStop Color="White" Offset="0.9" />
      </LinearGradientBrush>

    </Setter.Value>
  </Setter>
</Style>

Sie können auch einen Stil auf bestimmte Steuerelemente eines bestimmten Typs anwenden, indem Sie dem Stil einen Schlüssel zuweisen und diesen Schlüssel in der Style -Eigenschaft des Steuer Elements angeben.You can also apply a style to only certain controls of a specific type by assigning a key to the style and specifying that key in the Style property of your control. Weitere Informationen zu Stilen finden Sie unter Erstellen von Formaten undVorlagen.For more information about styles, see Styling and Templating.

Erstellen eines ControlTemplate-ObjektsCreating a ControlTemplate

Mit Style einem können Sie Eigenschaften für mehrere Steuerelemente gleichzeitig festlegen. manchmal möchten Sie jedoch auch das Aussehen Control eines-Elements anpassen, das über das Erstellen eines Stylehinausgeht.A Style allows you to set properties on multiple controls at a time, but sometimes you might want to customize the appearance of a Control beyond what you can do by creating a Style. Klassen, die von der Control -Klasse erben ControlTemplate, verfügen über einen, der die ControlStruktur und das Aussehen eines definiert.Classes that inherit from the Control class have a ControlTemplate, which defines the structure and appearance of a Control. Die Template -Eigenschaft Control eines ist öffentlich, sodass ControlTemplate Sie einen Control anderen Wert als den Standardwert erhalten können.The Template property of a Control is public, so you can give a Control a ControlTemplate that is different than its default. Sie können häufig einen neuen ControlTemplate für einen Control angeben, anstatt von einem-Steuerelement zu erben, um die Darstellung Controleiner anzupassen.You can often specify a new ControlTemplate for a Control instead of inheriting from a control to customize the appearance of a Control.

Sehen Sie sich Buttondas sehr gängige Steuerelement an.Consider the very common control, Button. Das primäre Verhalten Button eines besteht darin, dass eine Anwendung Aktionen ausführen kann, wenn der Benutzer darauf klickt.The primary behavior of a Button is to enable an application to take some action when the user clicks it. Standardmäßig wird der Button in WPFWPF als geaufgelöes Rechteck angezeigt.By default, the Button in WPFWPF appears as a raised rectangle. Beim Entwickeln einer Anwendung ist es möglicherweise sinnvoll, das Verhalten von Buttonzu nutzen, indem Sie das Click-Ereignis der Schaltfläche Bearbeiten, aber Sie können die Darstellung der Schaltfläche über das, was Sie tun können, ändern, indem Sie die Eigenschaften der Schaltfläche ändern.While developing an application, you might want to take advantage of the behavior of a Button--that is, by handling the button's click event--but you might change the button's appearance beyond what you can do by changing the button's properties. In diesem Fall können Sie einen neuen ControlTemplateerstellen.In this case, you can create a new ControlTemplate.

Im folgenden Beispiel wird ein ControlTemplate für ein Buttonerstellt.The following example creates a ControlTemplate for a Button. Der ControlTemplate erstellt eine Button mit abgerundeten Ecken und einem Farbverlaufs Hintergrund.The ControlTemplate creates a Button with rounded corners and a gradient background. Die ControlTemplate enthält ein Border - Background Objekt, LinearGradientBrush dessen eine GradientStop mit zwei-Objekten ist.The ControlTemplate contains a Border whose Background is a LinearGradientBrush with two GradientStop objects. Der erste GradientStop verwendet die Datenbindung, um Color die-Eigenschaft GradientStop von an die Farbe des Hintergrunds der Schaltfläche zu binden.The first GradientStop uses data binding to bind the Color property of the GradientStop to the color of the button's background. Wenn Sie die Background -Eigenschaft Buttondes-Objekts festlegen, wird die Farbe dieses Werts als erste GradientStopverwendet.When you set the Background property of the Button, the color of that value will be used as the first GradientStop. Weitere Informationen zu Datenbindungen finden Sie unter Übersicht über Datenbindung.For more information about data binding, see Data Binding Overview. Im Beispiel wird auch eine Trigger erstellt, die die Darstellung Button des ändert IsPressed , truewenn ist.The example also creates a Trigger that changes the appearance of the Button when IsPressed is true.

<!--Define a template that creates a gradient-colored button.-->
<Style TargetType="Button">
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="Button">
        <Border 
          x:Name="Border"  
          CornerRadius="20" 
          BorderThickness="1"
          BorderBrush="Black">
          <Border.Background>
            <LinearGradientBrush StartPoint="0,0.5" 
                                 EndPoint="1,0.5">
              <GradientStop Color="{Binding Background.Color, 
                    RelativeSource={RelativeSource TemplatedParent}}" 
                            Offset="0.0" />
              <GradientStop Color="White" Offset="0.9" />
            </LinearGradientBrush>
          </Border.Background>
          <ContentPresenter 
            Margin="2"
            HorizontalAlignment="Center"
            VerticalAlignment="Center"
            RecognizesAccessKey="True"/>
        </Border>
        <ControlTemplate.Triggers>
          <!--Change the appearance of
          the button when the user clicks it.-->
          <Trigger Property="IsPressed" Value="true">
            <Setter TargetName="Border" Property="Background">
              <Setter.Value>
                <LinearGradientBrush StartPoint="0,0.5" 
                                     EndPoint="1,0.5">
                  <GradientStop Color="{Binding Background.Color, 
                    RelativeSource={RelativeSource TemplatedParent}}" 
                                Offset="0.0" />
                  <GradientStop Color="DarkSlateGray" Offset="0.9" />
                </LinearGradientBrush>
              </Setter.Value>
            </Setter>
          </Trigger>

        </ControlTemplate.Triggers>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>
<Button Grid.Row="2" Grid.ColumnSpan="2" Name="submitName"
        Background="Green">View message</Button>

Hinweis

Die Background -Eigenschaft Button der SolidColorBrush muss auf festgelegt werden, damit das Beispiel ordnungsgemäß funktioniert.The Background property of the Button must be set to a SolidColorBrush for the example to work properly.

Abonnieren von EreignissenSubscribing to Events

Sie können das-Ereignis eines Steuer Elements abonnieren, indem XAMLXAML Sie entweder oder Code verwenden, aber Sie können nur ein Ereignis im Code behandeln.You can subscribe to a control's event by using either XAMLXAML or code, but you can only handle an event in code. Im folgenden Beispiel wird gezeigt, wie das Click -Ereignis Buttoneines abonniert wird.The following example shows how to subscribe to the Click event of a Button.

<Button Grid.Row="2" Grid.ColumnSpan="2" Name="submitName" Click="submit_Click"
  Background="Green">View message</Button>
submit.Click += new RoutedEventHandler(submit_Click);
AddHandler submit.Click, AddressOf submit_Click

Im folgenden Beispiel wird das Click -Ereignis Buttoneines behandelt.The following example handles the Click event of a Button.

void submit_Click(object sender, RoutedEventArgs e)
{
    MessageBox.Show("Hello, " + firstName.Text + " " + lastName.Text);
}
Private Sub submit_Click(ByVal sender As Object, ByVal e As RoutedEventArgs)
    MessageBox.Show("Hello, " + firstName.Text + " " + lastName.Text)

End Sub 'submit_Click

Umfangreicher Inhalt in SteuerelementenRich Content in Controls

Die meisten Klassen, die von Control der-Klasse erben, haben die Kapazität, umfangreiche Inhalte zu enthalten.Most classes that inherit from the Control class have the capacity to contain rich content. Beispielsweise kann ein Label beliebiges-Objekt, z. b. eine Zeichen ImageFolge, ein Paneloder ein-Objekt enthalten.For example, a Label can contain any object, such as a string, an Image, or a Panel. Die folgenden Klassen bieten Unterstützung für umfangreiche Inhalte und fungieren als Basisklassen für die meisten Steuer WPFWPFElemente in.The following classes provide support for rich content and act as base classes for most of the controls in WPFWPF.

Weitere Informationen zu diesen Basisklassen finden Sie unter WPF-Inhalts Modell.For more information about these base classes, see WPF Content Model.

Siehe auchSee also