Bagikan melalui


Gambaran Umum Perenderan Grafik WPF

Topik ini memberikan gambaran umum tentang lapisan visual WPF. Ini berfokus pada peran Visual kelas untuk merender dukungan dalam model WPF.

Peran Objek Visual

Kelas Visual adalah abstraksi dasar dari mana setiap FrameworkElement objek berasal. Ini juga berfungsi sebagai titik masuk untuk menulis kontrol baru di WPF, dan dalam banyak hal dapat dianggap sebagai handle jendela (HWND) dalam model aplikasi Win32.

Objek Visual adalah objek WPF inti, yang peran utamanya adalah memberikan dukungan penyajian. Kontrol antarmuka pengguna, seperti Button dan TextBox, berasal dari Visual kelas , dan menggunakannya untuk mempertahankan data penyajian mereka. Objek Visual menyediakan dukungan untuk:

  • Tampilan output: Merender konten gambar visual yang dipertahankan dan diserialisasikan.

  • Transformasi: Melakukan transformasi pada visual.

  • Kliping: Menyediakan dukungan wilayah kliping untuk visual.

  • Pengujian hit: Menentukan apakah koordinat atau geometri terkandung dalam batas visual.

  • Perhitungan kotak pembatas: Menentukan persegi panjang pembatas visual.

Namun, Visual objek tidak menyertakan dukungan untuk fitur non-penyajian, seperti:

  • Penanganan acara

  • Tata letak

  • Gaya

  • Pengikatan data

  • Globalisasi

Visual diekspos sebagai kelas abstrak publik tempat kelas anak harus diturunkan. Ilustrasi berikut menunjukkan hierarki objek visual yang diekspos dalam WPF.

Diagram of classes derived from the Visual object

Kelas DrawingVisual

adalah DrawingVisual kelas gambar ringan yang digunakan untuk merender bentuk, gambar, atau teks. Kelas ini dianggap ringan karena tidak menyediakan tata letak atau penanganan peristiwa, yang meningkatkan performa runtimenya. Untuk alasan ini, gambar sangat ideal untuk latar belakang dan clip art. DrawingVisual dapat digunakan untuk membuat objek visual kustom. Untuk informasi selengkapnya, lihat Menggunakan Objek DrawingVisual.

Lihat Kelas Viewport3DVisual

menyediakan Viewport3DVisual jembatan antara 2D Visual dan Visual3D objek. Kelas Visual3D adalah kelas dasar untuk semua elemen visual 3D. Viewport3DVisual mengharuskan Anda menentukan Camera nilai dan Viewport nilai. Kamera memungkinkan Anda untuk melihat adegan. Viewport menetapkan tempat proyeksi memetakan ke permukaan 2D. Untuk informasi selengkapnya tentang 3D di WPF, lihat Gambaran Umum Grafis 3D.

Kelas ContainerVisual

Kelas ContainerVisual digunakan sebagai kontainer untuk kumpulan Visual objek. Kelas DrawingVisual berasal dari ContainerVisual kelas , memungkinkannya untuk berisi kumpulan objek visual.

Menggambar Konten di Objek Visual

Objek Visual menyimpan data rendernya sebagai daftar instruksi grafik vektor. Setiap item dalam daftar instruksi mewakili sekumpulan data grafis tingkat rendah dan sumber daya terkait dalam format serial. Ada empat jenis data render berbeda yang dapat berisi konten gambar.

Menggambar tipe isi Deskripsi
Grafik vektor Mewakili data grafik vektor, dan informasi dan Pen terkait Brush apa pun.
Gambar Mewakili gambar dalam wilayah yang ditentukan oleh Rect.
Glyph Mewakili gambar yang merender GlyphRun, yang merupakan urutan glyph dari sumber daya font tertentu. Ini adalah bagaimana teks diwakili.
Video Mewakili gambar yang merender video.

memungkinkan DrawingContext Anda mengisi Visual dengan konten visual. Saat Anda menggunakan DrawingContext perintah gambar objek, Anda benar-benar menyimpan sekumpulan data render yang nantinya akan digunakan oleh sistem grafis; Anda tidak menggambar ke layar secara real-time.

Saat Anda membuat kontrol WPF, seperti Button, kontrol secara implisit menghasilkan data render untuk menggambar itu sendiri. Misalnya, mengatur Content properti penyebab Button kontrol menyimpan representasi penyajian glyph.

A Visual menjelaskan kontennya sebagai satu atau beberapa Drawing objek yang terkandung dalam DrawingGroup. A DrawingGroup juga menjelaskan masker opasitas, transformasi, efek bitmap, dan operasi lain yang diterapkan pada kontennya. DrawingGroupoperasi diterapkan dalam urutan berikut ketika konten dirender: OpacityMask, , Opacity, BitmapEffectClipGeometry, GuidelineSet, lalu Transform.

Ilustrasi berikut menunjukkan urutan di mana DrawingGroup operasi diterapkan selama urutan penyajian.

DrawingGroup order of operations
Urutan operasi DrawingGroup

Untuk informasi selengkapnya, lihat Gambaran Umum Objek Gambaran Umum.

Menggambar Konten di Lapisan Visual

Namun, Anda tidak pernah langsung membuat DrawingContextinstans ; Anda dapat memperoleh konteks gambar dari metode tertentu, seperti DrawingGroup.Open dan DrawingVisual.RenderOpen. Contoh berikut mengambil DrawingContext dari DrawingVisual dan menggunakannya untuk menggambar persegi panjang.

// Create a DrawingVisual that contains a rectangle.
private DrawingVisual CreateDrawingVisualRectangle()
{
    DrawingVisual drawingVisual = new DrawingVisual();

    // Retrieve the DrawingContext in order to create new drawing content.
    DrawingContext drawingContext = drawingVisual.RenderOpen();

    // Create a rectangle and draw it in the DrawingContext.
    Rect rect = new Rect(new System.Windows.Point(160, 100), new System.Windows.Size(320, 80));
    drawingContext.DrawRectangle(System.Windows.Media.Brushes.LightBlue, (System.Windows.Media.Pen)null, rect);

    // Persist the drawing content.
    drawingContext.Close();

    return drawingVisual;
}
' Create a DrawingVisual that contains a rectangle.
Private Function CreateDrawingVisualRectangle() As DrawingVisual
    Dim drawingVisual As New DrawingVisual()

    ' Retrieve the DrawingContext in order to create new drawing content.
    Dim drawingContext As DrawingContext = drawingVisual.RenderOpen()

    ' Create a rectangle and draw it in the DrawingContext.
    Dim rect As New Rect(New Point(160, 100), New Size(320, 80))
    drawingContext.DrawRectangle(Brushes.LightBlue, CType(Nothing, Pen), rect)

    ' Persist the drawing content.
    drawingContext.Close()

    Return drawingVisual
End Function

Menghitung Konten Gambar di Lapisan Visual

Selain kegunaannya yang lain, Drawing objek juga menyediakan model objek untuk menghitung konten Visual.

Catatan

Saat Anda menghitung konten visual, Anda mengambil Drawing objek, dan bukan representasi yang mendasar dari data render sebagai daftar instruksi grafik vektor.

Contoh berikut menggunakan GetDrawing metode untuk mengambil DrawingGroup nilai Visual dan menghitungnya.

public void RetrieveDrawing(Visual v)
{
    DrawingGroup drawingGroup = VisualTreeHelper.GetDrawing(v);
    EnumDrawingGroup(drawingGroup);
}

// Enumerate the drawings in the DrawingGroup.
public void EnumDrawingGroup(DrawingGroup drawingGroup)
{
    DrawingCollection dc = drawingGroup.Children;

    // Enumerate the drawings in the DrawingCollection.
    foreach (Drawing drawing in dc)
    {
        // If the drawing is a DrawingGroup, call the function recursively.
        if (drawing is DrawingGroup group)
        {
            EnumDrawingGroup(group);
        }
        else if (drawing is GeometryDrawing)
        {
            // Perform action based on drawing type.
        }
        else if (drawing is ImageDrawing)
        {
            // Perform action based on drawing type.
        }
        else if (drawing is GlyphRunDrawing)
        {
            // Perform action based on drawing type.
        }
        else if (drawing is VideoDrawing)
        {
            // Perform action based on drawing type.
        }
    }
}

Cara Objek Visual Digunakan untuk Membangun Kontrol

Banyak objek dalam WPF terdiri dari objek visual lainnya, yang berarti objek tersebut dapat berisi berbagai hierarki objek turunan. Banyak elemen antarmuka pengguna di WPF, seperti kontrol, terdiri dari beberapa objek visual, mewakili berbagai jenis elemen penyajian. Misalnya, Button kontrol dapat berisi sejumlah objek lain, termasuk ClassicBorderDecorator, , ContentPresenterdan TextBlock.

Kode berikut menunjukkan kontrol yang Button ditentukan dalam markup.

<Button Click="OnClick">OK</Button>

Jika Anda menghitung objek visual yang terdiri dari kontrol default Button , Anda akan menemukan hierarki objek visual yang diilustrasikan di bawah ini:

Diagram of visual tree hierarchy

Button Kontrol berisi ClassicBorderDecorator elemen, yang pada gilirannya, berisi ContentPresenter elemen. Elemen ClassicBorderDecorator ini bertanggung jawab untuk menggambar batas dan latar belakang untuk Button. Elemen ContentPresenter ini bertanggung jawab untuk menampilkan konten Button. Dalam hal ini, karena Anda menampilkan teks, ContentPresenter elemen berisi TextBlock elemen . Fakta bahwa Button kontrol menggunakan ContentPresenter sarana bahwa konten dapat diwakili oleh elemen lain, seperti Image atau geometri, seperti EllipseGeometry.

Templat Kontrol

Kunci untuk perluasan kontrol ke dalam hierarki kontrol adalah ControlTemplate. Templat kontrol menentukan hierarki visual default untuk kontrol. Saat Anda secara eksplisit mereferensikan kontrol, Anda secara implisit mereferensikan hierarki visualnya. Anda dapat mengambil alih nilai default untuk templat kontrol untuk membuat tampilan visual yang dikustomisasi untuk kontrol. Misalnya, Anda dapat memodifikasi nilai Button warna latar belakang kontrol sehingga menggunakan nilai warna gradien linier alih-alih nilai warna solid. Untuk informasi selengkapnya, lihat Gaya dan Templat Tombol.

Elemen antarmuka pengguna, seperti Button kontrol, berisi beberapa daftar instruksi grafik vektor yang menjelaskan seluruh definisi penyajian kontrol. Kode berikut menunjukkan kontrol yang Button ditentukan dalam markup.

<Button Click="OnClick">
  <Image Source="images\greenlight.jpg"></Image>
</Button>

Jika Anda menghitung objek visual dan daftar instruksi grafik vektor yang terdiri dari Button kontrol, Anda akan menemukan hierarki objek yang diilustrasikan di bawah ini:

Diagram of visual tree and rendering data

Button Kontrol berisi ClassicBorderDecorator elemen, yang pada gilirannya, berisi ContentPresenter elemen. Elemen ClassicBorderDecorator ini bertanggung jawab untuk menggambar semua elemen grafis diskrit yang membentuk batas dan latar belakang tombol. Elemen ContentPresenter ini bertanggung jawab untuk menampilkan konten Button. Dalam hal ini, karena Anda menampilkan gambar, ContentPresenter elemen berisi Image elemen .

Ada sejumlah poin yang perlu diperhatikan tentang hierarki objek visual dan daftar instruksi grafik vektor:

  • Pengurutan dalam hierarki mewakili urutan penyajian informasi gambar. Dari elemen visual akar, elemen anak dilalui, kiri ke kanan, atas ke bawah. Jika elemen memiliki elemen anak visual, elemen tersebut dilalui sebelum saudara-saudara elemen.

  • Elemen node non-daun dalam hierarki, seperti ContentPresenter, digunakan untuk berisi elemen anak—elemen tersebut tidak berisi daftar instruksi.

  • Jika elemen visual berisi daftar instruksi grafik vektor dan anak visual, daftar instruksi dalam elemen visual induk dirender sebelum gambar di salah satu objek anak visual.

  • Item dalam daftar instruksi grafik vektor dirender dari kiri ke kanan.

Pohon Visual

Pohon visual berisi semua elemen visual yang digunakan dalam antarmuka pengguna aplikasi. Karena elemen visual berisi informasi gambar yang bertahan, Anda dapat menganggap pohon visual sebagai grafik adegan, yang berisi semua informasi penyajian yang diperlukan untuk menyusun output ke perangkat tampilan. Pohon ini adalah akumulasi dari semua elemen visual yang dibuat langsung oleh aplikasi, baik dalam kode atau dalam markup. Pohon visual juga berisi semua elemen visual yang dibuat oleh perluasan templat elemen seperti kontrol dan objek data.

Kode berikut menunjukkan elemen yang StackPanel ditentukan dalam markup.

<StackPanel>
  <Label>User name:</Label>
  <TextBox />
  <Button Click="OnClick">OK</Button>
</StackPanel>

Jika Anda menghitung objek visual yang terdiri dari StackPanel elemen dalam contoh markup, Anda akan menemukan hierarki objek visual yang diilustrasikan di bawah ini:

Diagram of visual tree hierarchy of a StackPanel control.

Urutan Penyajian

Pohon visual menentukan urutan penyajian objek visual dan gambar WPF. Urutan traversal dimulai dengan visual akar, yang merupakan simpul paling atas di pohon visual. Anak-anak visual akar kemudian dilalui, kiri ke kanan. Jika visual memiliki anak, anak-anaknya dilalui sebelum saudara kandung visual. Ini berarti bahwa konten visual anak dirender di depan konten visual itu sendiri.

Diagram of the visual tree rendering order

Visual Akar

Visual akar adalah elemen paling atas dalam hierarki pohon visual. Di sebagian besar aplikasi, kelas dasar visual akar adalah Window atau NavigationWindow. Namun, jika Anda menghosting objek visual dalam aplikasi Win32, visual akar akan menjadi visual terbanyak yang Anda hosting di jendela Win32. Untuk informasi selengkapnya, lihat Tutorial: Menghosting Objek Visual dalam Aplikasi Win32.

Hubungan dengan Pohon Logis

Pohon logis dalam WPF mewakili elemen aplikasi pada waktu proses. Meskipun Anda tidak memanipulasi pohon ini secara langsung, tampilan aplikasi ini berguna untuk memahami warisan properti dan perutean peristiwa. Tidak seperti pohon visual, pohon logis dapat mewakili objek data non-visual, seperti ListItem. Dalam banyak kasus, pohon logis memetakan dengan sangat dekat dengan definisi markup aplikasi. Kode berikut menunjukkan elemen yang DockPanel ditentukan dalam markup.

<DockPanel>
  <ListBox>
    <ListBoxItem>Dog</ListBoxItem>
    <ListBoxItem>Cat</ListBoxItem>
    <ListBoxItem>Fish</ListBoxItem>
  </ListBox>
  <Button Click="OnClick">OK</Button>
</DockPanel>

Jika Anda menghitung objek logis yang terdiri dari DockPanel elemen dalam contoh markup, Anda akan menemukan hierarki objek logis yang diilustrasikan di bawah ini:

Tree diagram
Diagram pohon logis

Pohon visual dan pohon logis disinkronkan dengan serangkaian elemen aplikasi saat ini, mencerminkan penambahan, penghapusan, atau modifikasi elemen. Namun, pohon-pohon menyajikan tampilan aplikasi yang berbeda. Tidak seperti pohon visual, pohon logis tidak memperluas elemen kontrol ContentPresenter . Ini berarti tidak ada korespondensi satu-ke-satu langsung antara pohon logis dan pohon visual untuk sekumpulan objek yang sama. Bahkan, memanggil metode objek GetChildren LogicalTreeHelper dan metode objek GetChild VisualTreeHelper menggunakan elemen yang sama dengan parameter menghasilkan hasil yang berbeda.

Untuk informasi selengkapnya tentang pohon logika, lihat Pohon di WPF.

Melihat Pohon Visual dengan XamlPad

Alat WPF, XamlPad, menyediakan opsi untuk melihat dan menjelajahi pohon visual yang sesuai dengan konten XAML yang saat ini ditentukan. Klik tombol Perlihatkan Pohon Visual pada bilah menu untuk menampilkan pohon visual. Berikut ini menggambarkan perluasan konten XAML ke dalam simpul pohon visual di panel Visual Tree Explorer XamlPad:

Visual Tree Explorer panel in XamlPad

Perhatikan bagaimana Label, , dan Button mengontrol setiap tampilan hierarki objek visual terpisah di panel Visual Tree Explorer XamlPadTextBox. Ini karena kontrol WPF memiliki ControlTemplate yang berisi pohon visual kontrol tersebut. Saat Anda secara eksplisit mereferensikan kontrol, Anda secara implisit mereferensikan hierarki visualnya.

Performa Visual Pembuatan Profil

WPF menyediakan serangkaian alat pembuatan profil performa yang memungkinkan Anda menganalisis perilaku run-time aplikasi Anda dan menentukan jenis pengoptimalan performa yang dapat Anda terapkan. Alat Visual Profiler menyediakan tampilan grafis data performa yang kaya dengan memetakan langsung ke pohon visual aplikasi. Dalam cuplikan layar ini, bagian Penggunaan CPU dari Visual Profiler memberi Anda perincian yang tepat tentang penggunaan layanan WPF objek, seperti penyajian dan tata letak.

Visual Profiler display output
Output tampilan Visual Profiler

Perilaku Penyajian Visual

WPF memperkenalkan beberapa fitur yang memengaruhi perilaku penyajian objek visual: grafik mode dipertahankan, grafik vektor, dan grafik independen perangkat.

Grafik Mode Dipertahankan

Salah satu kunci untuk memahami peran objek Visual adalah memahami perbedaan antara mode langsung dan sistem grafis mode yang dipertahankan. Aplikasi Win32 standar berdasarkan GDI atau GDI+ menggunakan sistem grafis mode langsung. Ini berarti bahwa aplikasi bertanggung jawab untuk mengecat ulang bagian area klien yang tidak valid, karena tindakan seperti jendela yang diubah ukurannya, atau objek yang mengubah tampilan visualnya.

Diagram of Win32 rendering sequence

Sebaliknya, WPF menggunakan sistem mode yang dipertahankan. Ini berarti objek aplikasi yang memiliki tampilan visual mendefinisikan sekumpulan data gambar berseri. Setelah data gambar didefinisikan, sistem bertanggung jawab setelah itu untuk menanggapi semua permintaan pengecatan ulang untuk merender objek aplikasi. Bahkan pada waktu proses, Anda dapat memodifikasi atau membuat objek aplikasi, dan masih mengandalkan sistem untuk menanggapi permintaan cat. Kekuatan dalam sistem grafis mode yang dipertahankan adalah bahwa informasi gambar selalu bertahan dalam keadaan berseri oleh aplikasi, tetapi tanggung jawab penyajian yang diserahkan ke sistem. Diagram berikut menunjukkan bagaimana aplikasi bergantung pada WPF untuk merespons permintaan cat.

Diagram of WPF rendering sequence

Penggarapan Ulang Cerdas

Salah satu manfaat terbesar dalam menggunakan grafis mode yang dipertahankan adalah bahwa WPF dapat secara efisien mengoptimalkan apa yang perlu digambar ulang dalam aplikasi. Bahkan jika Anda memiliki adegan yang kompleks dengan berbagai tingkat keburaman, Anda umumnya tidak perlu menulis kode tujuan khusus untuk mengoptimalkan penggarapan ulang. Bandingkan ini dengan pemrograman Win32 di mana Anda dapat menghabiskan banyak upaya dalam mengoptimalkan aplikasi Anda dengan meminimalkan jumlah pemrograman ulang di wilayah pembaruan. Lihat Redrawing di Wilayah Pembaruan untuk contoh jenis kompleksitas yang terlibat dalam mengoptimalkan penggalian ulang dalam aplikasi Win32.

Grafik Vektor

WPF menggunakan grafik vektor sebagai format data penyajiannya. Grafik vektor—yang mencakup font Grafik Vektor Yang Dapat Diskalakan (SVG), Metafil windows (.wmf), dan TrueType—menyimpan data penyajian dan mengirimkannya sebagai daftar instruksi yang menjelaskan cara membuat ulang gambar menggunakan primitif grafis. Misalnya, font TrueType adalah font kerangka yang menjelaskan sekumpulan baris, kurva, dan perintah, bukan array piksel. Salah satu manfaat utama grafik vektor adalah kemampuan untuk menskalakan ke ukuran dan resolusi apa pun.

Tidak seperti grafik vektor, grafik bitmap menyimpan data penyajian sebagai representasi piksel demi piksel dari gambar, yang telah dirender sebelumnya untuk resolusi tertentu. Salah satu perbedaan utama antara format grafik bitmap dan vektor adalah keakuratan gambar sumber asli. Misalnya, ketika ukuran gambar sumber dimodifikasi, sistem grafik bitmap membentangkan gambar, sedangkan sistem grafis vektor menskalakan gambar, mempertahankan keakuratan gambar.

Ilustrasi berikut menunjukkan gambar sumber yang telah diubah ukurannya sebesar 300%. Perhatikan distorsi yang muncul ketika gambar sumber direntangkan sebagai gambar grafis bitmap daripada diskalakan sebagai gambar grafis vektor.

Differences between raster and vector graphics

Markup berikut menunjukkan dua Path elemen yang ditentukan. Elemen kedua menggunakan ScaleTransform untuk mengubah ukuran instruksi gambar elemen pertama sebesar 300%. Perhatikan bahwa instruksi menggambar dalam Path elemen tetap tidak berubah.

<Path
  Data="M10,100 C 60,0 100,200 150,100 z"
  Fill="{StaticResource linearGradientBackground}"
  Stroke="Black"
  StrokeThickness="2" />

<Path
  Data="M10,100 C 60,0 100,200 150,100 z"
  Fill="{StaticResource linearGradientBackground}"
  Stroke="Black"
  StrokeThickness="2" >
  <Path.RenderTransform>
    <ScaleTransform ScaleX="3.0" ScaleY="3.0" />
  </Path.RenderTransform>
</Path>

Tentang Resolusi dan Grafik Independen Perangkat

Ada dua faktor sistem yang menentukan ukuran teks dan grafik di layar Anda: resolusi dan DPI. Resolusi menjelaskan jumlah piksel yang muncul di layar. Ketika resolusi semakin tinggi, piksel menjadi lebih kecil, menyebabkan grafik dan teks tampak lebih kecil. Grafik yang ditampilkan pada monitor yang diatur ke 1024 x 768 akan tampak jauh lebih kecil ketika resolusi diubah menjadi 1600 x 1200.

Pengaturan sistem lainnya, DPI, menjelaskan ukuran inci layar dalam piksel. Sebagian besar sistem Windows memiliki DPI 96, yang berarti inci layar adalah 96 piksel. Meningkatkan pengaturan DPI membuat inci layar lebih besar; mengurangi DPI membuat inci layar lebih kecil. Ini berarti bahwa inci layar tidak berukuran sama dengan inci dunia nyata; pada sebagian besar sistem, itu mungkin tidak. Saat Anda meningkatkan DPI, grafik dan teks yang sadar DPI menjadi lebih besar karena Anda telah meningkatkan ukuran inci layar. Meningkatkan DPI dapat membuat teks lebih mudah dibaca, terutama pada resolusi tinggi.

Tidak semua aplikasi sadar DPI: beberapa menggunakan piksel perangkat keras sebagai unit pengukuran utama; mengubah DPI sistem tidak berpengaruh pada aplikasi ini. Banyak aplikasi lain menggunakan unit sadar DPI untuk menggambarkan ukuran font, tetapi menggunakan piksel untuk menjelaskan yang lain. Membuat DPI terlalu kecil atau terlalu besar dapat menyebabkan masalah tata letak untuk aplikasi ini, karena teks aplikasi menskalakan dengan pengaturan DPI sistem, tetapi UI aplikasi tidak. Masalah ini telah dihilangkan untuk aplikasi yang dikembangkan menggunakan WPF.

WPF mendukung penskalaan otomatis dengan menggunakan piksel independen perangkat sebagai unit pengukuran utamanya, alih-alih piksel perangkat keras; grafis dan skala teks dengan benar tanpa pekerjaan tambahan dari pengembang aplikasi. Ilustrasi berikut menunjukkan contoh bagaimana teks dan grafik WPF muncul di pengaturan DPI yang berbeda.

Graphics and text at different DPI settings
Grafik dan teks pada pengaturan DPI yang berbeda

Kelas VisualTreeHelper

Kelas VisualTreeHelper ini adalah kelas pembantu statis yang menyediakan fungsionalitas tingkat rendah untuk pemrograman di tingkat objek visual, yang berguna dalam skenario yang sangat spesifik, seperti mengembangkan kontrol kustom berkinerja tinggi. Dalam kebanyakan kasus, objek kerangka kerja WPF tingkat lebih tinggi, seperti Canvas dan TextBlock, menawarkan fleksibilitas yang lebih besar dan kemudahan penggunaan.

Tekan Pengujian

Kelas ini VisualTreeHelper menyediakan metode untuk pengujian hit pada objek visual ketika dukungan pengujian hit default tidak memenuhi kebutuhan Anda. Anda dapat menggunakan HitTest metode di VisualTreeHelper kelas untuk menentukan apakah geometri atau nilai koordinat titik berada dalam batas objek tertentu, seperti kontrol atau elemen grafis. Misalnya, Anda dapat menggunakan pengujian hit untuk menentukan apakah klik mouse dalam persegi panjang pembatas objek yang termasuk dalam geometri lingkaran Anda juga dapat memilih untuk mengambil alih implementasi default pengujian hit untuk melakukan perhitungan pengujian hit kustom Anda sendiri.

Untuk informasi selengkapnya tentang pengujian hit, lihat Pengujian Hit di Lapisan Visual.

Menghitung Pohon Visual

Kelas ini VisualTreeHelper menyediakan fungsionalitas untuk menghitung anggota pohon visual. Untuk mengambil induk, panggil GetParent metode . Untuk mengambil anak, atau turunan langsung, dari objek visual, panggil GetChild metode . Metode ini mengembalikan anak Visual dari induk pada indeks yang ditentukan.

Contoh berikut menunjukkan cara menghitung semua turunan objek visual, yang merupakan teknik yang mungkin ingin Anda gunakan jika Anda tertarik untuk menserialisasikan semua informasi penyajian hierarki objek visual.

// Enumerate all the descendants of the visual object.
static public void EnumVisual(Visual myVisual)
{
    for (int i = 0; i < VisualTreeHelper.GetChildrenCount(myVisual); i++)
    {
        // Retrieve child visual at specified index value.
        Visual childVisual = (Visual)VisualTreeHelper.GetChild(myVisual, i);

        // Do processing of the child visual object.

        // Enumerate children of the child visual object.
        EnumVisual(childVisual);
    }
}
' Enumerate all the descendants of the visual object.
Public Shared Sub EnumVisual(ByVal myVisual As Visual)
    For i As Integer = 0 To VisualTreeHelper.GetChildrenCount(myVisual) - 1
        ' Retrieve child visual at specified index value.
        Dim childVisual As Visual = CType(VisualTreeHelper.GetChild(myVisual, i), Visual)

        ' Do processing of the child visual object.

        ' Enumerate children of the child visual object.
        EnumVisual(childVisual)
    Next i
End Sub

Dalam kebanyakan kasus, pohon logis adalah representasi elemen yang lebih berguna dalam aplikasi WPF. Meskipun Anda tidak memodifikasi pohon logis secara langsung, tampilan aplikasi ini berguna untuk memahami warisan properti dan perutean peristiwa. Tidak seperti pohon visual, pohon logis dapat mewakili objek data non-visual, seperti ListItem. Untuk informasi selengkapnya tentang pohon logika, lihat Pohon di WPF.

Kelas VisualTreeHelper menyediakan metode untuk mengembalikan persegi panjang batas objek visual. Anda dapat mengembalikan persegi panjang pembatas objek visual dengan memanggil GetContentBounds. Anda dapat mengembalikan persegi panjang pembatas dari semua turunan objek visual, termasuk objek visual itu sendiri, dengan memanggil GetDescendantBounds. Kode berikut menunjukkan bagaimana Anda akan menghitung persegi panjang pembatas objek visual dan semua turunannya.

// Return the bounding rectangle of the parent visual object and all of its descendants.
Rect rectBounds = VisualTreeHelper.GetDescendantBounds(parentVisual);
' Return the bounding rectangle of the parent visual object and all of its descendants.
Dim rectBounds As Rect = VisualTreeHelper.GetDescendantBounds(parentVisual)

Baca juga