Penghias

Adorners adalah jenis FrameworkElement khusus, digunakan untuk memberikan isyarat visual kepada pengguna. Di antara kegunaan lain, Adorners dapat digunakan untuk menambahkan handel fungsional ke elemen atau memberikan informasi status tentang kontrol.

Cuplikan layar menunjukkan kotak teks yang dihiasi dengan kotak di sudut-sudutnya.

Judul Description
Menerapkan Adorner Menunjukkan cara membuat implementasi adorner kustom.
Mengikat Adorner ke Elemen Menunjukkan cara melampirkan adorner ke elemen UI tertentu.
Menghiasi Anak-Anak Panel Menunjukkan cara menerapkan penghias ke semua elemen anak pada panel.
Menghapus Adorner dari Elemen Menjelaskan cara menghapus penghias melalui pemrograman.
Menghapus semua 'Adorners' dari sebuah Elemen Menunjukkan cara menghapus semua penghias dari elemen sekaligus.

Gaya dan templat

Kelas Adorner adalah kelas dasar abstrak yang tidak menentukan bagian templat atau status visual. Implementasi adorner konkret adalah turunan dari kelas ini dan menetapkan perilaku rendering mereka sendiri melalui metode OnRender.

Properti konten

Kontrol ini tidak menentukan properti isi.

Bagian

Kontrol ini tidak menentukan bagian templat apa pun.

Keadaan visual

Kontrol ini tidak menentukan status visual apa pun.

Konsep utama

Memahami adorners membutuhkan pemahaman tentang beberapa konsep utama mengenai cara kerjanya dalam kerangka kerja WPF.

Tentang penghias

Adorner adalah kustom FrameworkElement yang terikat ke UIElement. Adorners direnderkan dalam AdornerLayer, yang merupakan permukaan penyajian yang selalu berada di atas elemen yang dihiasi atau kumpulan elemen yang dihiasi. Penyajian adorner bersifat independen dari penyajian UIElement yang diikat dengan adorner. Penghias biasanya diposisikan relatif terhadap elemen yang diikatnya, menggunakan asal koordinat 2D standar yang terletak di kiri atas elemen yang dihiasi.

Aplikasi umum untuk penghias meliputi:

  • Menambahkan handel fungsional ke UIElement yang memungkinkan pengguna memanipulasi elemen dengan cara tertentu (mengubah ukuran, memutar, memposisikan ulang, dll.).
  • Berikan umpan balik visual untuk menunjukkan berbagai status, atau sebagai respons terhadap berbagai peristiwa.
  • Tambahkan dekorasi visual pada UIElement.
  • Secara visual menutupi atau mengambil alih bagian atau semua UIElement.

Kelas-kelas pada Kerangka Adorner

Windows Presentation Foundation (WPF) menyediakan kerangka kerja dasar untuk menghiasi elemen visual. Tabel berikut mencantumkan jenis utama yang digunakan saat menghiasi objek, dan tujuannya:

Class Description
Adorner Kelas dasar abstrak dari mana semua implementasi penghias konkret mewarisi.
AdornerLayer Kelas yang mewakili lapisan rendering untuk adornar dari satu atau beberapa elemen yang dihiasi.
AdornerDecorator Kelas yang memungkinkan keterhubungan lapisan adorner dengan kumpulan elemen.

Perilaku penyajian

Penting untuk dicatat bahwa adorner tidak menyertakan perilaku render bawaan; memastikan bahwa adorner melakukan render adalah tanggung jawab penerap adorner. Cara umum untuk menerapkan perilaku rendering adalah dengan mengganti metode OnRender dan menggunakan satu atau beberapa objek DrawingContext untuk merender visual adorner sesuai kebutuhan.

Nota

Apa pun yang ditempatkan di lapisan adorner akan dirender di atas setiap gaya lain yang telah Anda tentukan. Dengan kata lain, penghias selalu secara visual berada di atas dan tidak dapat ditimpa menggunakan z-order.

Peristiwa dan pengujian tabrakan

Adorners menerima peristiwa input sama seperti yang lain FrameworkElement. Karena penghias selalu memiliki urutan z yang lebih tinggi daripada elemen yang dihiasinya, penghias menerima peristiwa input (seperti Drop atau MouseMove) yang mungkin ditujukan untuk elemen yang dihias yang mendasar. Seorang adorner dapat mendengarkan peristiwa input tertentu dan meneruskan ini ke elemen yang menghiasi yang mendasar dengan menaikkan kembali peristiwa.

Untuk mengaktifkan uji tabrakan tembus pandang pada elemen di bawah adorner, atur properti uji IsHitTestVisible tabrakan menjadi false pada adorner. Untuk informasi selengkapnya tentang pengujian hit, lihat Pengujian Hit di Lapisan Visual.

Examples

Contoh berikut menunjukkan cara mengimplementasikan dan menggunakan adorner dalam skenario umum.

Menerapkan adorner kustom

Kerangka kerja adorner yang disediakan oleh Windows Presentation Foundation (WPF) ditujukan terutama untuk mendukung pembuatan adorner kustom. Adorner kustom dibuat dengan mengimplementasikan kelas turunan dari kelas abstrak Adorner .

Nota

Induk dari Adorner adalah AdornerLayer yang merender Adorner, bukan elemen yang dihias.

Contoh berikut menunjukkan kelas yang mengimplementasikan elemen hias sederhana. Contoh penghias ini hanya menghiasi sudut-sudut dari UIElement dengan lingkaran.

// Adorners must subclass the abstract base class Adorner.
public class SimpleCircleAdorner : Adorner
{
  // Be sure to call the base class constructor.
  public SimpleCircleAdorner(UIElement adornedElement)
    : base(adornedElement)
  {
  }

  // A common way to implement an adorner's rendering behavior is to override the OnRender
  // method, which is called by the layout system as part of a rendering pass.
  protected override void OnRender(DrawingContext drawingContext)
  {
    Rect adornedElementRect = new Rect(this.AdornedElement.DesiredSize);

    // Some arbitrary drawing implements.
    SolidColorBrush renderBrush = new SolidColorBrush(Colors.Green);
    renderBrush.Opacity = 0.2;
    Pen renderPen = new Pen(new SolidColorBrush(Colors.Navy), 1.5);
    double renderRadius = 5.0;

    // Draw a circle at each corner.
    drawingContext.DrawEllipse(renderBrush, renderPen, adornedElementRect.TopLeft, renderRadius, renderRadius);
    drawingContext.DrawEllipse(renderBrush, renderPen, adornedElementRect.TopRight, renderRadius, renderRadius);
    drawingContext.DrawEllipse(renderBrush, renderPen, adornedElementRect.BottomLeft, renderRadius, renderRadius);
    drawingContext.DrawEllipse(renderBrush, renderPen, adornedElementRect.BottomRight, renderRadius, renderRadius);
  }
}
Public Class SimpleCircleAdorner
    Inherits Adorner
    Sub New(ByVal adornedElement As UIElement)
        MyBase.New(adornedElement)
    End Sub

    Protected Overrides Sub OnRender(ByVal drawingContext As System.Windows.Media.DrawingContext)
        MyBase.OnRender(drawingContext)
        Dim adornedElementRect As New Rect(AdornedElement.DesiredSize)
        Dim renderBrush As New SolidColorBrush(Colors.Green)
        renderBrush.Opacity = 0.2
        Dim renderPen As New Pen(New SolidColorBrush(Colors.Navy), 1.5)
        Dim renderRadius As Double
        renderRadius = 5.0

        'Draw a circle at each corner.
        drawingContext.DrawEllipse(renderBrush, renderPen, adornedElementRect.TopLeft, renderRadius, renderRadius)
        drawingContext.DrawEllipse(renderBrush, renderPen, adornedElementRect.TopRight, renderRadius, renderRadius)
        drawingContext.DrawEllipse(renderBrush, renderPen, adornedElementRect.BottomLeft, renderRadius, renderRadius)
        drawingContext.DrawEllipse(renderBrush, renderPen, adornedElementRect.BottomRight, renderRadius, renderRadius)
    End Sub
End Class

Menghiasi satu UIElement

Untuk mengikat adorner ke tertentu UIElement, ikuti langkah-langkah berikut:

  1. Panggil metode statis GetAdornerLayer untuk mendapatkan objek AdornerLayer yang akan dihiasi UIElement. GetAdornerLayer menelusuri pohon visual, memulai dari UIElement, dan mengembalikan lapisan adorner pertama yang ditemukan. (Jika tidak ada lapisan adorner yang ditemukan, metode mengembalikan null.)

  2. Panggil metode Add untuk mengikat adorner ke target UIElement.

Contoh berikut mengikat SimpleCircleAdorner (ditunjukkan di atas) ke TextBoxmyTextBox bernama:

myAdornerLayer = AdornerLayer.GetAdornerLayer(myTextBox);
myAdornerLayer.Add(new SimpleCircleAdorner(myTextBox));
myAdornerLayer = AdornerLayer.GetAdornerLayer(myTextBox)
myAdornerLayer.Add(New SimpleCircleAdorner(myTextBox))

Nota

Menggunakan Extensible Application Markup Language (XAML) untuk mengikat adorner ke elemen lain saat ini tidak didukung.

Menghiasi anak-anak panel

Untuk mengaitkan adorner kepada anak-anak Panel, ikuti langkah-langkah berikut:

  1. static Panggil metode GetAdornerLayer untuk menemukan lapisan yang menggemaskan untuk elemen yang anak-anaknya akan ditata.

  2. Enumerasikan melalui anak-anak elemen induk dan panggil metode Add untuk mengaitkan adorner ke setiap elemen anak.

Contoh berikut mengaitkan SimpleCircleAdorner (ditunjukkan di atas) dengan elemen anak dari StackPanel bernama myStackPanel:

foreach (UIElement toAdorn in myStackPanel.Children)
  myAdornerLayer.Add(new SimpleCircleAdorner(toAdorn));
For Each toAdorn As UIElement In myStackPanel.Children
    myAdornerLayer.Add(New SimpleCircleAdorner(toAdorn))
Next

Lihat juga