Aracılığıyla paylaş


Kontroller

Windows Presentation Foundation (WPF), Button, Label, TextBox, Menuve ListBoxgibi hemen her Windows uygulamasında kullanılan birçok ortak kullanıcı arabirimi bileşeniyle birlikte sağlanır. Geçmişte bu nesnelere denetimler adı verilmiştir. WPF SDK'sı bir uygulamadaki görünür nesneyi temsil eden herhangi bir sınıfı gevşek bir şekilde ifade etmek için "denetim" terimini kullanmaya devam etse de, görünür bir varlığın olması için sınıfın Control sınıfından devralması gerekmediğine dikkat etmek önemlidir. Control sınıfından devralan sınıflar, bir denetimin tüketicisinin yeni bir alt sınıf oluşturmak zorunda kalmadan denetimin görünümünü kökten değiştirmesine olanak tanıyan bir ControlTemplateiçerir. Bu konuda denetimlerin (hem Control sınıfından devralan hem de devralmayanlar) WPF'de yaygın olarak nasıl kullanıldığı açıklanmaktadır.

Denetim Örneği Oluşturma

Genişletilebilir Uygulama Biçimlendirme Dili (XAML) veya kod kullanarak bir uygulamaya denetim ekleyebilirsiniz. Aşağıdaki örnekte, kullanıcıdan adını ve soyadını soran basit bir uygulamanın nasıl oluşturulacağı gösterilmektedir. Bu örnek altı denetim oluşturur: XAML'de iki etiket, iki metin kutusu ve iki düğme. Tüm denetimler benzer şekilde oluşturulabilir.

<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>

Aşağıdaki örnek kodda aynı uygulamayı oluşturur. Kısalık açısından, Gridve grid1'in oluşturulması örnekten çıkarılmıştır. grid1, önceki XAML örneğinde gösterildiği gibi aynı sütun ve satır tanımlarına sahiptir.

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

Denetimin Görünümünü Değiştirme

Bir denetimin görünümünü uygulamanızın genel görünümüne uyacak şekilde değiştirmek yaygın bir durumdur. Gerçekleştirmek istediğiniz şeye bağlı olarak aşağıdakilerden birini yaparak denetimin görünümünü değiştirebilirsiniz:

  • Denetimin bir özelliğinin değerini değiştirin.

  • Denetim için bir Style oluşturun.

  • Denetim için yeni bir ControlTemplate oluşturun.

Denetimin Özellik Değerini Değiştirme

Birçok denetim, bir ButtonBackground gibi denetimin görünümünü değiştirmenize olanak sağlayan özelliklere sahiptir. Hem XAML hem de kodda değer özelliklerini ayarlayabilirsiniz. Aşağıdaki örnek, XAML'deki bir Button üzerinde Background, FontSizeve FontWeight özelliklerini ayarlar.

<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>

Aşağıdaki örnek kodda aynı özellikleri ayarlar.

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

Denetim için Stil Oluşturma

WPF, bir Styleoluşturarak uygulamadaki her örnekte özellikleri ayarlamak yerine toptan denetim görünümünü belirtme olanağı sağlar. Aşağıdaki örnek, uygulamadaki her bir Button'e uygulanan bir Style oluşturur. Style tanımları genellikle XAML içinde, FrameworkElement'ün Resources özelliği gibi bir ResourceDictionaryiçerisinde tanımlanır.

<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>

Ayrıca, stile bir anahtar atayarak ve denetiminizin Style özelliğinde bu anahtarı belirterek belirli bir türün yalnızca belirli denetimlerine stil uygulayabilirsiniz. Stiller hakkında daha fazla bilgi için bkz. Stil ve Şablon.

ControlTemplate Oluşturma

Style aynı anda birden çok denetimde özellik ayarlamanıza olanak tanır, ancak bazen Styleoluşturarak yapabileceklerinin ötesinde bir Control görünümünü özelleştirmek isteyebilirsiniz. Control sınıfından devralan sınıfların, bir Control'nin yapısını ve görünümünü tanımlayan bir ControlTemplate'i vardır. Bir Control'e ait Template özelliği geneldir, bu nedenle Control'ye varsayılanından farklı bir ControlTemplate verebilirsiniz. bir Controlgörünümünü özelleştirmek için denetimden devralmak yerine genellikle bir Control için yeni bir ControlTemplate belirtebilirsiniz.

Çok yaygın olan Buttondenetimini göz önünde bulundurun. bir Button birincil davranışı, bir uygulamanın kullanıcı tıkladığında bazı eylemler gerçekleştirmesini sağlamaktır. Varsayılan olarak, WPF'deki Button yükseltilmiş dikdörtgen olarak görünür. Uygulama geliştirirken, bir Button'ın tıklama olayını işleyerek davranışından yararlanmak isteyebilirsiniz, ancak düğmenin özelliklerini değiştirerek yapabileceklerinizin ötesinde görünümünü değiştirebilirsiniz. Bu durumda, yeni bir ControlTemplateoluşturabilirsiniz.

Aşağıdaki örnek, Buttoniçin bir ControlTemplate oluşturur. ControlTemplate yuvarlatılmış köşeleri ve gradyan arka planı olan bir Button oluşturur. ControlTemplate, Background'si iki GradientStop nesnesi bulunan bir LinearGradientBrush olan bir Border içerir. İlk GradientStop, GradientStopColor özelliğini düğmenin arka planının rengine bağlamak için veri bağlamayı kullanır. Button Background özelliğini ayarladığınızda, bu değerin rengi ilk GradientStopolarak kullanılır. Veri bağlama hakkında daha fazla bilgi için bkz. Veri Bağlamaya Genel Bakış. Örnek ayrıca IsPressedtrueolduğunda Button görünümünü değiştiren bir Trigger oluşturur.

<!--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>

Not

Örneğin düzgün çalışması için Button'in Background özelliği bir SolidColorBrush'ye ayarlanmalıdır.

Olaylara Abone Olma

Bir denetimin olayına XAML veya kod kullanarak abone olabilirsiniz, ancak bir olayı yalnızca kodda işleyebilirsiniz. Aşağıdaki örnekte, bir Button'in Click olayına nasıl abone olunacağı gösterilmektedir.

<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

Aşağıdaki örnek bir Button'in Click olayını işler.

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

Kontrollerdeki Zengin İçerik

Control sınıfından devralan sınıfların çoğu zengin içerik içerebilecek kapasiteye sahiptir. Örneğin, bir Label dize, Imageveya Panelgibi herhangi bir nesne içerebilir. Aşağıdaki sınıflar zengin içerik için destek sağlar ve WPF'deki denetimlerin çoğu için temel sınıflar olarak hareket eder.

Bu temel sınıflar hakkında daha fazla bilgi için bkz. WPF İçerik Modeli.

Ayrıca bkz.