Share via


Panduan Desktop (WPF .NET)

Selamat datang di Panduan Desktop untuk Windows Presentation Foundation (WPF), kerangka kerja UI yang tidak bergantung pada resolusi dan menggunakan mesin perenderan berbasis vektor, yang dibuat untuk memanfaatkan perangkat keras grafis modern. WPF menyediakan satu set lengkap fitur pengembangan aplikasi yang mencakup Extensible Application Markup Language (XAML), kontrol, pengikatan data, tata letak, grafik 2D dan 3D, animasi, gaya, template, dokumen, media, teks, dan tipografi. WPF adalah bagian dari .NET, sehingga Anda dapat membangun aplikasi yang menggabungkan elemen lain dari .NET API.

Penting

Dokumentasi Panduan Desktop untuk .NET 7 dan .NET 6 sedang dibangun.

Ada dua penerapan WPF:

  1. Versi .NET (panduan ini):

    Implementasi sumber terbuka WPF yang dihosting di GitHub, yang berjalan pada .NET. Perancang XAML membutuhkan, minimal, Visual Studio 2019 versi 16.8. Tetapi tergantung pada versi .NET Anda, Anda mungkin diharuskan untuk menggunakan versi Visual Studio yang lebih baru.

    Meskipun .NET adalah teknologi lintas platform, WPF hanya berjalan di Windows.

  2. Versi .NET Framework 4:

    Penerapan .NET Framework dari WPF yang didukung oleh Visual Studio 2019 dan Visual Studio 2017.

    .NET Framework 4 adalah versi .NET khusus Windows dan dianggap sebagai komponen Sistem Operasi Windows. Versi WPF ini didistribusikan dengan .NET Framework. Untuk informasi lebih lanjut tentang WPF versi .NET Framework, lihat Pengantar WPF untuk .NET Framework.

Gambaran Umum ini ditujukan untuk pendatang baru dan mencakup kemampuan dan konsep utama WPF. Untuk mempelajari cara membuat aplikasi WPF, lihat Tutorial: Membuat aplikasi WPF baru.

Mengapa meningkatkan dari .NET Framework

Ketika Anda meningkatkan aplikasi Anda dari .NET Framework ke .NET, Anda akan mendapat manfaat dari:

  • Performa yang lebih baik
  • API .NET baru
  • Peningkatan bahasa terbaru
  • Peningkatan aksesibilitas dan keandalan
  • Alat yang diperbarui dan banyak lagi

Untuk mempelajari cara meningkatkan aplikasi Anda, lihat Cara meningkatkan aplikasi desktop WPF ke .NET 7.

Program dengan WPF

WPF ada sebagai subset dari jenis .NET yang, sebagian besar terletak di namespace System.Windows. Jika sebelumnya Anda telah membuat aplikasi dengan .NET menggunakan kerangka kerja seperti ASP.NET dan Formulir Windows, pengalaman pemrograman WPF yang mendasar seharusnya sudah tidak asing lagi, Anda:

  • Membuat instans kelas
  • Mengatur properti
  • Metode panggilan
  • Menangani peristiwa

WPF menyertakan lebih banyak konstruksi pemrograman yang menyempurnakan properti dan peristiwa: properti dependensi dan peristiwa yang dirutekan.

Markup dan code-behind

WPF memungkinkan Anda mengembangkan aplikasi menggunakan markup dan code-behind, pengalaman yang harus dipahami oleh pengembang ASP.NET. Anda biasanya menggunakan markup XAML untuk menerapkan tampilan aplikasi saat menggunakan bahasa pemrograman terkelola (code-behind) untuk menerapkan perilakunya. Pemisahan penampilan dan perilaku ini memiliki manfaat sebagai berikut:

  • Biaya pengembangan dan pemeliharaan berkurang karena markup khusus tampilan tidak digabungkan dengan kode khusus perilaku.

  • Pengembangan lebih efisien karena perancang dapat menerapkan tampilan aplikasi secara bersamaan dengan pengembang yang menerapkan perilaku aplikasi.

  • Globalisasi dan lokalisasi untuk aplikasi WPF disederhanakan.

Markup

XAML adalah bahasa markup berbasis XML yang menerapkan tampilan aplikasi secara deklaratif. Anda biasanya menggunakannya untuk menentukan jendela, kotak dialog, halaman, dan kontrol pengguna, dan untuk mengisinya dengan kontrol, bentuk, dan grafik.

Contoh berikut menggunakan XAML untuk menerapkan tampilan jendela yang berisi satu tombol:

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    Title="Window with Button"
    Width="250" Height="100">

  <!-- Add button to window -->
  <Button Name="button">Click Me!</Button>

</Window>

Secara khusus, XAML ini mendefinisikan jendela dan tombol dengan menggunakan elemen Window dan Button. Setiap elemen dikonfigurasi dengan atribut, seperti atribut Window elemen Title untuk menentukan teks bilah judul jendela. Pada saat dijalankan, WPF mengonversi elemen dan atribut yang didefinisikan dalam markup menjadi instans kelas WPF. Misalnya, elemen Window dikonversi menjadi turunan kelas Window yang properti Title-nya adalah nilai atribut Title.

Gambar berikut menunjukkan antarmuka pengguna (UI) yang didefinisikan oleh XAML pada contoh sebelumnya:

A window that contains a button

Karena XAML berbasis XML, UI yang Anda buat dengannya dirangkai dalam hierarki elemen berlapis yang dikenal sebagai pohon elemen. Pohon elemen menyediakan cara yang logis dan intuitif untuk membuat dan mengelola UI.

Code-behind

Perilaku utama aplikasi adalah menerapkan fungsionalitas yang merespons interaksi pengguna. Misalnya mengeklik menu atau tombol, dan memanggil logika bisnis dan logika akses data sebagai respons. Di WPF, perilaku ini diterapkan dalam kode yang terkait dengan markup. Jenis kode ini dikenal sebagai code-behind. Contoh berikut menunjukkan markup yang diperbarui dari contoh sebelumnya dan code-behind:

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="SDKSample.AWindow"
    Title="Window with Button"
    Width="250" Height="100">

  <!-- Add button to window -->
  <Button Name="button" Click="button_Click">Click Me!</Button>

</Window>

Markup yang diperbarui mendefinisikan namespace xmlns:x dan memetakannya ke skema yang menambahkan dukungan untuk jenis code-behind. Atribut x:Class digunakan untuk mengaitkan kelas code-behind ke markup XAML khusus ini. Mengingat atribut ini dideklarasikan pada elemen <Window>, kelas code-behind harus mewarisi dari kelas Window.

using System.Windows;

namespace SDKSample
{
    public partial class AWindow : Window
    {
        public AWindow()
        {
            // InitializeComponent call is required to merge the UI
            // that is defined in markup with this class, including  
            // setting properties and registering event handlers
            InitializeComponent();
        }

        void button_Click(object sender, RoutedEventArgs e)
        {
            // Show message box when button is clicked.
            MessageBox.Show("Hello, Windows Presentation Foundation!");
        }
    }
}
Namespace SDKSample

    Partial Public Class AWindow
        Inherits System.Windows.Window

        Public Sub New()

            ' InitializeComponent call is required to merge the UI
            ' that is defined in markup with this class, including  
            ' setting properties and registering event handlers
            InitializeComponent()

        End Sub

        Private Sub button_Click(ByVal sender As Object, ByVal e As RoutedEventArgs)

            ' Show message box when button is clicked.
            MessageBox.Show("Hello, Windows Presentation Foundation!")

        End Sub

    End Class

End Namespace

InitializeComponent dipanggil dari konstruktor kelas code-behind untuk menggabungkan UI yang didefinisikan dalam markup dengan kelas code-behind. (InitializeComponent dibuat untuk Anda saat aplikasi dibuat, itulah sebabnya Anda tidak perlu menerapkannya secara manual.) Kombinasi x:Class dan InitializeComponent memastikan bahwa penerapan Anda diinisialisasi dengan benar setiap kali dibuat.

Perhatikan bahwa dalam markup, elemen <Button> menetapkan nilai button_Click untuk atribut Click. Dengan markup dan code-behind yang diinisialisasi dan bekerja bersama, peristiwa Click untuk tombol secara otomatis dipetakan ke metode button_Click. Saat tombol diklik, peristiwa penangan dipanggil dan kotak pesan ditampilkan dengan memanggil metode System.Windows.MessageBox.Show.

Gambar berikut menunjukkan hasil ketika tombol diklik:

A MessageBox

Input dan perintah

Kontrol paling sering mendeteksi dan merespons input pengguna. Sistem input WPF menggunakan peristiwa langsung dan yang dirutekan untuk mendukung input teks, manajemen fokus, dan penempatan mouse.

Aplikasi seringkali memiliki persyaratan input yang rumit. WPF menyediakan sistem perintah yang memisahkan tindakan input pengguna dari kode yang merespons tindakan tersebut. Sistem perintah memungkinkan beberapa sumber menjalankan logika perintah yang sama. Misalnya, melakukan operasi pengeditan umum yang digunakan oleh berbagai aplikasi: Salin, Potong, dan Tempel. Operasi ini dapat dipanggil dengan menggunakan tindakan pengguna yang berbeda jika diterapkan dengan menggunakan perintah.

Kontrol

Pengalaman pengguna yang disampaikan oleh model aplikasi adalah kontrol yang dibangun. Di WPF, kontrol adalah istilah umum yang berlaku untuk kategori kelas WPF yang memiliki karakteristik sebagai berikut:

  • Dihosting di jendela atau halaman.
  • Memiliki antarmuka pengguna.
  • Menerapkan beberapa perilaku.

Untuk informasi lebih lanjut, lihat Kontrol.

Kontrol WPF berdasarkan fungsi

Kontrol WPF bawaan tercantum di sini:

Tata letak

Saat membuat antarmuka pengguna, Anda mengatur kontrol berdasarkan lokasi dan ukuran untuk membentuk tata letak. Persyaratan utama tata letak apa pun adalah beradaptasi dengan perubahan ukuran jendela dan pengaturan tampilan. Daripada memaksa Anda untuk menulis kode untuk mengadaptasi tata letak dalam keadaan ini, WPF menyediakan sistem tata letak kelas satu yang dapat diperluas untuk Anda.

Landasan sistem tata letak adalah penentuan posisi relatif, yang meningkatkan kemampuan untuk beradaptasi dengan perubahan kondisi jendela dan tampilan. Sistem tata letak juga mengelola negosiasi antar kontrol untuk menentukan tata letak. Negosiasi adalah proses dua langkah: pertama, kontrol memberi tahu induknya lokasi dan ukuran apa yang dibutuhkan. Kedua, induk memberi tahu kontrol ruang apa yang dapat dimilikinya.

Sistem tata letak diekspos ke kontrol turunan melalui kelas WPF dasar. Untuk tata letak umum seperti kisi, tumpukan, dan dok, WPF menyertakan beberapa kontrol tata letak:

  • Canvas: Kontrol turunan menyediakan tata letaknya sendiri.

  • DockPanel: Kontrol turunan disejajarkan dengan tepi panel.

  • Grid: Kontrol turunan ditempatkan berdasarkan baris dan kolom.

  • StackPanel: Kontrol turunan ditumpuk baik secara vertikal maupun horizontal.

  • VirtualizingStackPanel: Kontrol turunan divirtualisasikan dan diatur pada satu baris yang berorientasi horizontal atau vertikal.

  • WrapPanel: Kontrol anak diposisikan dalam urutan kiri-ke-kanan dan dibungkus ke baris berikutnya ketika tidak ada cukup ruang pada baris saat ini.

Contoh berikut menggunakan DockPanel untuk menata beberapa TextBox kontrol:

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="SDKSample.LayoutWindow"
    Title="Layout with the DockPanel" Height="143" Width="319">
  
  <!--DockPanel to layout four text boxes--> 
  <DockPanel>
    <TextBox DockPanel.Dock="Top">Dock = "Top"</TextBox>
    <TextBox DockPanel.Dock="Bottom">Dock = "Bottom"</TextBox>
    <TextBox DockPanel.Dock="Left">Dock = "Left"</TextBox>
    <TextBox Background="White">This TextBox "fills" the remaining space.</TextBox>
  </DockPanel>

</Window>

DockPanel memungkinkan kontrol TextBox turunan untuk memberi tahu cara mengaturnya. Untuk melakukannya, DockPanel menerapkan properti terlampir Dock yang diekspos ke kontrol turunan untuk memungkinkan masing-masing dari mereka menentukan gaya dok.

Catatan

Properti yang diterapkan oleh kontrol induk untuk digunakan oleh kontrol turunan adalah konstruksi WPF yang disebut properti terlampir.

Gambar berikut menunjukkan hasil markup XAML pada contoh sebelumnya:

DockPanel page

Pengikatan data

Sebagian besar aplikasi dibuat untuk menyediakan sarana bagi pengguna untuk melihat dan mengedit data. Untuk aplikasi WPF, pekerjaan menyimpan dan mengakses data sudah disediakan oleh banyak pustaka akses data .NET yang berbeda seperti SQL dan Entity Framework Core. Setelah data diakses dan dimuat ke objek yang dikelola aplikasi, kerja keras untuk aplikasi WPF dimulai. Pada dasarnya, ini melibatkan dua hal:

  1. Menyalin data dari objek yang dikelola ke dalam kontrol, tempat data dapat ditampilkan dan diedit.

  2. Memastikan bahwa perubahan yang dibuat pada data dengan menggunakan kontrol disalin kembali ke objek yang dikelola.

Untuk menyederhanakan pengembangan aplikasi, WPF menyediakan mesin pengikat data yang kuat untuk menangani langkah-langkah ini secara otomatis. Unit inti dari mesin pengikatan data adalah kelas Binding, yang tugasnya adalah mengikat kontrol (mengikat target) ke objek data (sumber pengikatan). Hubungan ini diilustrasikan oleh gambar berikut:

Basic data binding diagram

WPF mendukung deklarasi pengikatan di markup XAML secara langsung. Misalnya, kode XAML berikut mengikat properti Text dari TextBox ke properti Name dari suatu objek menggunakan sintaksis XAML "{Binding ... }". Hal ini mengasumsikan bahwa ada objek data yang diatur ke properti DataContext dari Window dengan properti Name.

 <Window
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     x:Class="SDKSample.DataBindingWindow">

   <!-- Bind the TextBox to the data source (TextBox.Text to Person.Name) -->
   <TextBox Name="personNameTextBox" Text="{Binding Path=Name}" />

 </Window>

Mesin pengikatan data WPF menyediakan lebih dari sekadar pengikatan, mesin ini menyediakan validasi, penyortiran, pemfilteran, dan pengelompokan. Selain itu, pengikatan data mendukung penggunaan template data untuk membuat antarmuka pengguna khusus untuk data terikat.

Untuk informasi lebih lanjut, lihat Gambaran Umum pengikatan data.

Grafik & animasi

WPF menyediakan serangkaian fitur grafis yang luas dan fleksibel yang memiliki manfaat sebagai berikut:

  • Grafik yang tidak bergantung pada resolusi dan tidak bergantung pada perangkat. Unit dasar pengukuran dalam sistem grafis WPF adalah piksel yang tidak bergantung pada perangkat, yaitu 1/96 inci, dan menyediakan dasar untuk perenderan yang tidak bergantung pada resolusi dan tidak bergantung pada perangkat. Setiap piksel yang tidak tergantung pada perangkat secara otomatis diskalakan agar sesuai dengan pengaturan titik per inci (dpi) dari sistem yang dirender.

  • Presisi yang ditingkatkan. Sistem koordinat WPF diukur dengan angka floating-point presisi ganda, bukan presisi tunggal. Transformasi dan nilai opasitas juga dinyatakan sebagai presisi ganda. WPF juga mendukung wide color gamut (scRGB) dan menyediakan dukungan terintegrasi untuk mengelola input dari ruang warna yang berbeda.

  • Dukungan grafis dan animasi tingkat lanjut. WPF menyederhanakan pemrograman grafis dengan mengelola adegan animasi untuk Anda; tidak perlu khawatir tentang pemrosesan adegan, perulangan perenderan, dan interpolasi bilinear. Selain itu, WPF menyediakan dukungan pengujian hit dan dukungan penuh alpha-compositing.

  • Akselerasi perangkat keras. Sistem grafis WPF memanfaatkan perangkat keras grafis untuk meminimalkan penggunaan CPU.

Grafik 2D

WPF menyediakan pustaka bentuk 2D yang digambar vektor umum, seperti persegi panjang dan elips. Bentuknya tidak hanya untuk ditampilkan; bentuk menerapkan banyak fitur yang Anda harapkan dari kontrol, termasuk input keyboard dan mouse.

Bentuk 2D yang disediakan oleh WPF mencakup set standar bentuk dasar. Namun, Anda mungkin perlu membuat bentuk khusus untuk membantu desain antarmuka pengguna yang disesuaikan. WPF menyediakan geometri untuk membuat bentuk kustom yang dapat digambar secara langsung, digunakan sebagai kuas, atau digunakan untuk memotong bentuk dan kontrol lainnya.

Untuk informasi lebih lanjut, lihat Gambaran Umum geometri.

Bagian dari kemampuan WPF 2D mencakup efek visual, seperti gradien, bitmap, gambar, lukisan dengan video, rotasi, penskalaan, dan kemiringan. Semua efek ini dicapai dengan kuas. Gambar berikut menunjukkan beberapa contoh:

Illustration of different brushes

Untuk informasi lebih lanjut, lihat Gambaran Umum kuas WPF.

Perenderan 3D

WPF juga mencakup kemampuan perenderan 3D yang terintegrasi dengan grafik 2D untuk memungkinkan pembuatan antarmuka pengguna yang lebih seru dan menarik. Misalnya, gambar berikut menunjukkan gambar 2D yang dirender ke bentuk 3D:

Visual3D sample screen shot

Untuk informasi lebih lanjut, lihat Gambaran Umum grafik 3D.

Animasi

Dukungan animasi WPF memungkinkan Anda membuat kontrol tumbuh, goyang, berputar, dan memudar, untuk membuat transisi halaman yang menarik, dan banyak lagi. Anda dapat menganimasikan sebagian besar kelas WPF, bahkan kelas kustom. Gambar berikut menunjukkan animasi sederhana yang sedang beraksi:

Images of an animated cube

Untuk informasi lebih lanjut, lihat Gambaran Umum animasi.

Teks dan tipografi

Untuk memberikan perenderan teks berkualitas tinggi, WPF menawarkan fitur berikut:

  • Dukungan font OpenType.
  • Penyempurnaan ClearType.
  • Performa tinggi yang memanfaatkan akselerasi perangkat keras.
  • Integrasi teks dengan media, grafik, dan animasi.
  • Dukungan font internasional dan mekanisme fallback.

Sebagai demonstrasi integrasi teks dengan grafik, gambar berikut menunjukkan penerapan dekorasi teks:

Text with various text decorations

Untuk informasi lebih lanjut, lihat Tipografi di Windows Presentation Foundation.

Menyesuaikan aplikasi WPF

Hingga saat ini, Anda telah melihat blok penyusun WPF inti untuk mengembangkan aplikasi:

  • Anda menggunakan model aplikasi untuk menghosting dan mengirimkan konten aplikasi, yang sebagian besar terdiri dari kontrol.
  • Untuk menyederhanakan pengaturan kontrol dalam antarmuka pengguna, Anda menggunakan sistem tata letak WPF.
  • Anda menggunakan pengikatan data untuk mengurangi pekerjaan mengintegrasikan antarmuka pengguna Anda dengan data.
  • Untuk meningkatkan tampilan visual aplikasi, Anda menggunakan rangkaian lengkap grafis, animasi, dan dukungan media yang disediakan oleh WPF.

Namun, seringkali, dasar-dasarnya tidak cukup untuk membuat dan mengelola pengalaman pengguna yang benar-benar berbeda dan menakjubkan secara visual. Kontrol WPF standar mungkin tidak terintegrasi dengan tampilan aplikasi Anda yang diinginkan. Data mungkin tidak ditampilkan dengan cara yang paling efektif. Pengalaman pengguna aplikasi Anda secara keseluruhan mungkin tidak sesuai dengan tampilan dan nuansa default tema Windows.

Untuk alasan ini, WPF menyediakan berbagai mekanisme untuk menciptakan pengalaman pengguna yang unik.

Model Konten

Tujuan utama dari sebagian besar kontrol WPF adalah untuk menampilkan konten. Di WPF, jenis dan jumlah item yang dapat membentuk konten kontrol disebut sebagai model konten kontrol. Beberapa kontrol dapat berisi satu item dan jenis konten. Misalnya, konten TextBox adalah nilai string yang ditetapkan ke properti Text.

Kontrol lain, bagaimanapun, dapat berisi beberapa item dari berbagai jenis konten; konten Button, yang ditentukan oleh properti Content, dapat berisi berbagai item termasuk kontrol tata letak, teks, gambar, dan bentuk.

Untuk informasi lebih lanjut tentang jenis konten yang didukung oleh berbagai kontrol, lihat Model konten WPF.

Memicu

Meskipun tujuan utama markup XAML adalah untuk menerapkan tampilan aplikasi, Anda juga dapat menggunakan XAML untuk menerapkan beberapa aspek dari perilaku aplikasi. Salah satu contohnya adalah penggunaan pemicu untuk mengubah tampilan aplikasi berdasarkan interaksi pengguna. Untuk informasi lebih lanjut, lihat Gaya dan template.

Templat

Antarmuka pengguna default untuk kontrol WPF biasanya dibuat dari kontrol dan bentuk lain. Misalnya, Button terdiri dari kontrol ButtonChrome dan ContentPresenter. ButtonChrome memberikan tampilan tombol standar, sedangkan ContentPresenter menampilkan konten tombol, seperti yang ditentukan oleh properti Content.

Terkadang tampilan default dari kontrol mungkin bertentangan dengan tampilan aplikasi secara keseluruhan. Dalam hal ini, Anda dapat menggunakan ControlTemplate untuk mengubah tampilan antarmuka pengguna kontrol tanpa mengubah konten dan perilakunya.

Misalnya, Button memunculkan peristiwa Click saat diklik. Dengan mengubah template tombol untuk menampilkan bentuk Ellipse, visual dari aspek kontrol telah berubah, tetapi fungsinya tidak. Anda masih dapat mengeklik aspek visual dari kontrol dan peristiwa Click dimunculkan seperti yang diharapkan.

An elliptical button and a second window

Template data

Sementara template kontrol memungkinkan Anda menentukan tampilan kontrol, template data memungkinkan Anda menentukan tampilan konten kontrol. Template data sering digunakan untuk menyempurnakan cara data terikat ditampilkan. Gambar berikut menunjukkan tampilan default untuk ListBox yang terikat ke kumpulan objek Task, di mana setiap tugas memiliki nama, deskripsi, dan prioritas:

A list box with the default appearance

Tampilan default adalah apa yang Anda harapkan dari ListBox. Namun, tampilan default setiap tugas hanya berisi nama tugas. Untuk menampilkan nama tugas, deskripsi, dan prioritas, tampilan default item daftar terikat kontrol ListBox harus diubah dengan menggunakan DataTemplate. Berikut adalah contoh penerapan template data yang dibuat untuk objek Task.

List box that uses a data template

ListBox mempertahankan perilaku dan tampilan keseluruhannya dan hanya tampilan konten yang ditampilkan oleh kotak daftar yang berubah.

Untuk informasi lebih lanjut, lihat Gambaran Umum template data.

Gaya

Gaya memungkinkan pengembang dan perancang membuat standar pada penampilan tertentu produk mereka. WPF menyediakan model gaya yang kuat, yang dasarnya adalah elemen Style. Gaya dapat menerapkan nilai properti ke jenis. Gaya dapat diterapkan secara otomatis ke segala sesuatu sesuai dengan jenis atau objek masing-masing ketika direferensikan. Contoh berikut membuat gaya yang mengatur warna latar belakang untuk setiap Button pada jendela menjadi Orange:

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="SDKSample.StyleWindow"
    Title="Styles">

    <Window.Resources>
        <!-- Style that will be applied to all buttons for this window -->
        <Style TargetType="{x:Type Button}">
            <Setter Property="Background" Value="Orange" />
            <Setter Property="BorderBrush" Value="Crimson" />
            <Setter Property="FontSize" Value="20" />
            <Setter Property="FontWeight" Value="Bold" />
            <Setter Property="Margin" Value="5" />
        </Style>
    </Window.Resources>
    <StackPanel>

        <!-- This button will have the style applied to it -->
        <Button>Click Me!</Button>

        <!-- This label will not have the style applied to it -->
        <Label>Don't Click Me!</Label>

        <!-- This button will have the style applied to it -->
        <Button>Click Me!</Button>
        
    </StackPanel>
</Window>

Karena gaya ini menargetkan semua kontrol Button, gaya secara otomatis diterapkan ke semua tombol di jendela, seperti yang ditunjukkan pada gambar berikut:

Two orange buttons

Untuk informasi lebih lanjut, lihat Gaya dan template.

Sumber daya

Kontrol dalam aplikasi harus memiliki tampilan yang sama, yang dapat mencakup apa saja mulai dari font dan warna latar belakang hingga template kontrol, template data, dan gaya. Anda dapat menggunakan dukungan WPF untuk sumber daya antarmuka pengguna untuk merangkum sumber daya ini di satu lokasi untuk digunakan kembali.

Contoh berikut mendefinisikan warna latar belakang umum yang digunakan bersama oleh Button dan Label:

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="SDKSample.ResourcesWindow"
    Title="Resources Window">

  <!-- Define window-scoped background color resource -->
  <Window.Resources>
    <SolidColorBrush x:Key="defaultBackground" Color="Red" />
  </Window.Resources>

  <!-- Button background is defined by window-scoped resource -->
  <Button Background="{StaticResource defaultBackground}">One Button</Button>

  <!-- Label background is defined by window-scoped resource -->
  <Label Background="{StaticResource defaultBackground}">One Label</Label>
</Window>

Untuk informasi lebih lanjut, lihat Cara mendefinisikan dan mereferensikan sumber daya WPF .

Kontrol kustom

Meskipun WPF menyediakan sejumlah dukungan kustomisasi, Anda mungkin menghadapi situasi di mana kontrol WPF yang ada tidak memenuhi kebutuhan aplikasi Anda atau penggunanya. Ini dapat terjadi ketika:

  • Antarmuka pengguna yang Anda butuhkan tidak dapat dibuat dengan menyesuaikan tampilan dan nuansa penerapan WPF yang ada.
  • Perilaku yang Anda perlukan tidak didukung (atau tidak mudah didukung) oleh penerapan WPF yang ada.

Namun, pada titik ini, Anda dapat memanfaatkan salah satu dari tiga model WPF untuk membuat kontrol baru. Setiap model menargetkan skenario tertentu dan memerlukan kontrol khusus Anda untuk diturunkan dari kelas dasar WPF tertentu. Tiga model tersebut tercantum di sini:

  • Model Kontrol Pengguna
    Kontrol kustom berasal dari UserControl dan terdiri dari satu atau beberapa kontrol lainnya.

  • Model Kontrol Kontrol kustom berasal dari Control dan digunakan untuk membangun penerapan yang memisahkan perilakunya dari tampilannya menggunakan template, seperti kebanyakan kontrol WPF. Berasal dari Control memberi Anda lebih banyak kebebasan untuk membuat antarmuka pengguna kustom daripada kontrol pengguna, tetapi mungkin memerlukan lebih banyak usaha.

  • Model Elemen Kerangka kerja.
    Kontrol kustom berasal dari FrameworkElement jika tampilannya ditentukan oleh logika perenderan kustom (bukan template).

Untuk informasi lebih lanjut tentang kontrol kustom, lihat Gambaran Umum pembuatan kontrol.

Baca juga