Bagikan melalui


Tipografi di WPF

Topik ini memperkenalkan fitur tipografi utama WPF. Fitur-fitur ini termasuk peningkatan kualitas dan performa penyajian teks, dukungan tipografi OpenType, teks internasional yang ditingkatkan, dukungan font yang ditingkatkan, dan antarmuka pemrograman aplikasi teks (API) baru.

Kualitas dan Performa Teks yang Ditingkatkan

Teks dalam WPF dirender menggunakan Microsoft ClearType, yang meningkatkan kejelasan dan keterbacaan teks. ClearType adalah teknologi perangkat lunak yang dikembangkan oleh Microsoft yang meningkatkan keterbacaan teks pada LCD yang ada (Liquid Crystal Displays), seperti layar laptop, layar PC Saku, dan monitor panel datar. ClearType menggunakan penyajian sub-piksel yang memungkinkan teks ditampilkan dengan keakuratan yang lebih besar ke bentuk sebenarnya dengan menyelaraskan karakter pada bagian pecahan piksel. Resolusi ekstra meningkatkan ketajaman detail kecil dalam tampilan teks, membuatnya jauh lebih mudah dibaca selama durasi panjang. Peningkatan lain dari ClearType di WPF adalah anti-alias arah y, yang menghaluskan bagian atas dan bawah kurva dangkal dalam karakter teks. Untuk detail selengkapnya tentang fitur ClearType, lihat Gambaran Umum ClearType.

Text with ClearType y-direction anti-aliasing
Teks dengan antialias arah ClearType

Seluruh alur penyajian teks dapat dipercepat perangkat keras di WPF asalkan komputer Anda memenuhi tingkat perangkat keras minimum yang diperlukan. Penyajian yang tidak dapat dilakukan menggunakan perangkat keras kembali ke penyajian perangkat lunak. Akselerasi perangkat keras memengaruhi semua fase alur penyajian teks—mulai dari menyimpan setiap glyph, menyusun glyph ke dalam eksekusi glyph, menerapkan efek, hingga menerapkan algoritma blending ClearType ke output akhir yang ditampilkan. Untuk informasi selengkapnya tentang akselerasi perangkat keras, lihat Tingkat Penyajian Grafis.

Diagram of the text rendering pipeline

Selain itu, teks animasi, baik berdasarkan karakter atau glyph, memanfaatkan sepenuhnya kemampuan perangkat keras grafis yang diaktifkan oleh WPF. Ini menghasilkan animasi teks yang halus.

Tipografi Kaya

Format font OpenType adalah ekstensi dari format font TrueType®. Format font OpenType dikembangkan bersama oleh Microsoft dan Adobe, dan menyediakan berbagai macam fitur tipografi tingkat lanjut. Objek ini Typography mengekspos banyak fitur canggih font OpenType, seperti alternatif gaya dan swashes. Windows SDK menyediakan sekumpulan font OpenType sampel yang dirancang dengan fitur kaya, seperti font Pericles dan Pescadero. Untuk informasi selengkapnya, lihat Sampel Paket Font OpenType.

Font Pericles OpenType berisi glyph tambahan yang menyediakan alternatif gaya ke sekumpulan glyph standar. Teks berikut menampilkan glyph alternatif gaya.

Text using OpenType stylistic alternate glyphs

Swashes adalah glyph dekoratif yang menggunakan ornamentasi rumit yang sering dikaitkan dengan kaligrafi. Teks berikut menampilkan glyph standar dan cuci untuk font Pescadero.

Text using OpenType standard and swash glyphs

Untuk detail selengkapnya tentang fitur OpenType, lihat Fitur Font OpenType.

Dukungan Teks Internasional yang Ditingkatkan

WPF menyediakan dukungan teks internasional yang ditingkatkan dengan menyediakan fitur-fitur berikut:

  • Penspasian baris otomatis di semua sistem penulisan, menggunakan pengukuran adaptif.

  • Dukungan luas untuk teks internasional. Untuk informasi selengkapnya, lihat Globalisasi untuk WPF.

  • Pemisah baris, pemisah, dan pertimbangan yang dipandu bahasa.

Dukungan Font yang Disempurnakan

WPF menyediakan dukungan font yang ditingkatkan dengan menyediakan fitur-fitur berikut:

  • Unicode untuk semua teks. Perilaku font dan pilihan tidak lagi memerlukan set karakter atau halaman kode.

  • Perilaku font independen dari pengaturan global, seperti lokal sistem.

  • Pisahkan FontWeightjenis , FontStretch, dan FontStyle untuk menentukan FontFamily. Ini memberikan fleksibilitas yang lebih besar daripada dalam pemrograman Win32, di mana kombinasi Boolean miring dan tebal digunakan untuk menentukan keluarga font.

  • Arah penulisan (horizontal versus vertikal) ditangani independen dari nama font.

  • Penautan font dan fallback font dalam file XML portabel, menggunakan teknologi font komposit. Font komposit memungkinkan pembangunan font multibahasa rentang penuh. Font komposit juga menyediakan mekanisme yang menghindari menampilkan glyph yang hilang. Untuk informasi selengkapnya, lihat komentar di FontFamily kelas.

  • Font internasional yang dibangun dari font komposit, menggunakan sekelompok font bahasa tunggal. Ini menghemat biaya sumber daya saat mengembangkan font untuk beberapa bahasa.

  • Font komposit yang disematkan dalam dokumen, sehingga menyediakan portabilitas dokumen. Untuk informasi selengkapnya, lihat komentar di FontFamily kelas.

Antarmuka Pemrograman Aplikasi Teks Baru (API)

WPF menyediakan beberapa API teks untuk digunakan pengembang saat menyertakan teks dalam aplikasi mereka. API ini dikelompokkan ke dalam tiga kategori:

  • Tata letak dan antarmuka pengguna. Kontrol teks umum untuk antarmuka pengguna grafis (GUI).

  • Gambar teks ringan. Memungkinkan Anda menggambar teks langsung ke objek.

  • Pemformatan teks tingkat lanjut. Memungkinkan Anda mengimplementasikan mesin teks kustom.

Tata Letak dan Antarmuka Pengguna

Pada tingkat fungsionalitas tertinggi, API teks menyediakan kontrol UI umum seperti Label, , TextBlockdan TextBox. Kontrol ini menyediakan elemen UI dasar dalam aplikasi, dan menawarkan cara mudah untuk menyajikan dan berinteraksi dengan teks. Kontrol seperti RichTextBox dan PasswordBox mengaktifkan penanganan teks yang lebih canggih atau khusus. Dan kelas seperti TextRange, TextSelection, dan TextPointer mengaktifkan manipulasi teks yang berguna. Kontrol UI ini menyediakan properti seperti FontFamily, , FontSizedan FontStyle, yang memungkinkan Anda mengontrol font yang digunakan untuk merender teks.

Menggunakan Efek Bitmap, Transformasi, dan Efek Teks

WPF memungkinkan Anda membuat penggunaan teks yang menarik secara visual dengan menggunakan fitur seperti efek bitmap, transformasi, dan efek teks. Contoh berikut menunjukkan jenis khas efek bayangan jatuh yang diterapkan ke teks.

Text shadow with Softness = 0.25

Contoh berikut menunjukkan efek bayangan jatuh dan kebisingan yang diterapkan ke teks.

Text shadow with noise

Contoh berikut menunjukkan efek cahaya luar yang diterapkan ke teks.

Text shadow using an OuterGlowBitmapEffect

Contoh berikut menunjukkan efek kabur yang diterapkan ke teks.

Text shadow using a BlurBitmapEffect

Contoh berikut menunjukkan baris kedua teks yang diskalakan sebesar 150% di sepanjang sumbu x, dan baris ketiga teks diskalakan sebesar 150% di sepanjang sumbu y.

Text scaled using a ScaleTransform

Contoh berikut menunjukkan teks condong di sepanjang sumbu x.

Text skewed using a SkewTransform

Objek TextEffect adalah objek pembantu yang memungkinkan Anda memperlakukan teks sebagai satu atau beberapa grup karakter dalam string teks. Contoh berikut menunjukkan karakter individual yang diputar. Setiap karakter diputar secara independen pada interval 1 detik.

Screenshot of text effect rotating text

Menggunakan Dokumen Alur

Selain kontrol UI umum, WPF menawarkan kontrol tata letak untuk presentasi teks— FlowDocument elemen . Elemen ini FlowDocument , bersama dengan DocumentViewer elemen , memberikan kontrol untuk sejumlah besar teks dengan berbagai persyaratan tata letak. Kontrol tata letak menyediakan akses ke tipografi tingkat lanjut melalui Typography objek dan properti terkait font kontrol UI lainnya.

Contoh berikut menunjukkan konten teks yang FlowDocumentReaderdihosting di , yang menyediakan pencarian, navigasi, penomoran halaman, dan dukungan penskalaan konten.

Screenshot that shows OpenType fonts.

Untuk informasi selengkapnya, lihat Dokumen di WPF.

Gambar Teks Ringan

Anda dapat menggambar teks langsung ke objek WPF dengan menggunakan DrawText metode DrawingContext objek. Untuk menggunakan metode ini, Anda membuat FormattedText objek. Objek ini memungkinkan Anda menggambar teks multibaris, di mana setiap karakter dalam teks dapat diformat secara individual. Fungsionalitas FormattedText objek berisi banyak fungsionalitas bendera DrawText di Windows API. Selain itu, FormattedText objek berisi fungsionalitas seperti dukungan elipsis, di mana elipsis ditampilkan ketika teks melebihi batasnya. Contoh berikut menunjukkan teks yang memiliki beberapa format yang diterapkan padanya, termasuk gradien linier pada kata kedua dan ketiga.

Text displayed using FormattedText object

Anda dapat mengonversi teks yang diformat menjadi Geometry objek, memungkinkan Anda membuat jenis teks lain yang menarik secara visual. Misalnya, Anda dapat membuat Geometry objek berdasarkan kerangka string teks.

Text outline using a linear gradient brush

Contoh berikut menggambarkan beberapa cara membuat efek visual yang menarik dengan memodifikasi goresan, isi, dan sorotan teks yang dikonversi.

Text with different colors for fill and stroke

Text with image brush applied to stroke

Text with image brush applied to stroke and highlight

Untuk informasi selengkapnya tentang FormattedText objek, lihat Menggambar Teks Berformat.

Pemformatan Teks Tingkat Lanjut

Pada tingkat api teks yang paling canggih, WPF menawarkan Anda kemampuan untuk membuat tata letak teks kustom dengan menggunakan TextFormatter objek dan jenis lain di System.Windows.Media.TextFormatting namespace layanan. Kelas TextFormatter terkait dan memungkinkan Anda menerapkan tata letak teks kustom yang mendukung definisi Anda sendiri dari format karakter, gaya paragraf, aturan pemisah baris, dan fitur tata letak lainnya untuk teks internasional. Ada sangat sedikit kasus di mana Anda ingin mengambil alih implementasi default dukungan tata letak teks WPF. Namun, jika Anda membuat kontrol atau aplikasi pengeditan teks, Anda mungkin memerlukan implementasi yang berbeda dari implementasi WPF default.

Tidak seperti API teks tradisional, TextFormatter berinteraksi dengan klien tata letak teks melalui serangkaian metode panggilan balik. Ini mengharuskan klien untuk menyediakan metode ini dalam implementasi TextSource kelas. Diagram berikut mengilustrasikan interaksi tata letak teks antara aplikasi klien dan TextFormatter.

Diagram of text layout client and TextFormatter

Untuk detail selengkapnya tentang membuat tata letak teks kustom, lihat Pemformatan Teks Tingkat Lanjut.

Baca juga