Ugrás a tartalomhoz

.NET Programming Technologies

Gergely Kovásznai, Csaba Biró

Eszterházy Károly College

5. fejezet - Controls (written by Csaba Biró)

5. fejezet - Controls (written by Csaba Biró)

In this chapter the using of the basic controls have to be discussed including the advantages of user controls.  A lot of WPF tools provide elegant and dynamic design of user interfaces.

Content controls

Controls in this group (Button, Label, Checkbox, RadioButton) are from the ContentControl class. They contain a special embedded element (content attribute) which is actually an object type, so any content can be placed in it.

Button

Push button have already been mentioned on the previous chapters. Only the Content feature will be described here.

Exemple V.1 Click me!

V.1. Click me

<Button x:Name="button" Content="Click me!" Margin="180 80 180 200" />

V.2 Példa Solar Sytem

V.2. Solar Sytem

<Button x:Name="buttonStackPanel"  Margin="180,80,180,135" Background="Black">

       <StackPanel>

            <Image Source="solarsystem.jpg" Stretch="Fill"/>

            <Label Content="Solar System" HorizontalAlignment="Center"

                 FontWeight="Bold"

                 FontStyle="Italic"

                 Foreground="White"/>

      </StackPanel>

</Button>

ToggleButton

A special feature-button, which is used for the designation of some options (on-off), typical well-used toolbars – it will be discussed later.

<ToggleButton Width="35" Height="35" Content="B" FontWeight= "Bold" />

Label

The Label control is one of the simplest controls inWPF – as it occured in our examples many times. What is important to note, that Label includes - like many controls – built-in support for mnemonic keys placement

<Label Content="Press Alt+_L"/>

In the following example, through the Target feature, at runtime the textBox1 will be on focus by pressing the Alt+N key combination.

Example V.3 Target property

V.3. Target property

<StackPanel Orientation="Horizontal"

            HorizontalAlignment="Center"

            VerticalAlignment="Center">

        <Label Content="_Név:" Target="{Binding ElementName=textBox1}" />

        <TextBox x:Name="textBox1" Width="300" Height="30" />

</StackPanel>

Using the Binding element we can create a data binding, see Chapter XIII.

CheckBox and RadioButton

The input data can include not only text data input, but there is a possibility for the simple input of select values.

 The selection of the options can be done by the following two controls:

CheckBox,

RadioButton.

Both of them are the descendants of ButtonBase class.

RadioButton

The radio buttons allow you to choose options in a way that we can choose only one (exactly) from the mutually exclusive options with the help of them.

Example V.4 RadioButton

V.4. RadioButton

<StackPanel>

      <TextBlock Text="Sex:" />

      <RadioButton GroupName="Sex" Content="Male" />

      <RadioButton GroupName="Sex" Content="Female"/>

      <Separator/>

      <TextBlock Text="Favorite season:" />

      <RadioButton GroupName="season " Content="Spring" IsEnabled="True"/>

      <RadioButton GroupName="season " Content="Summer"/>

      <RadioButton GroupName="season " Content="Authum"/>

      <RadioButton GroupName="season " Content="Winter"/>

</StackPanel>

CheckBox

Checkboxes allow you to choose between one or more independent modes different from radio buttons, in which only one setting can be chosen. With the help of check boxes a variety of settings is possible at the same time. Key features are IsChecked and IsEnabled. The first assign it to default status, the second one does not allow you to edit.

Example V.5 CheckBox

V.5. CheckBox

<StackPanel>

       <TextBlock Text="Válassza ki az alábbi listából a kedvenc tantárgyait:"/>

       <CheckBox Content="Informatika"/>

       <CheckBox Content="Fizika" IsChecked="True" IsEnabled="False"/>

       <CheckBox Content="Matematika"/>

       <CheckBox Content="Kémia"/>

</StackPanel>