Ringkasan Bab 3. Lebih dalam ke dalam teks
Catatan
Buku ini diterbitkan pada musim semi 2016, dan belum diperbarui sejak saat itu. Ada banyak dalam buku yang tetap berharga, tetapi beberapa materi sudah kedaluarsa, dan beberapa topik tidak lagi sepenuhnya benar atau lengkap.
Bab ini mengeksplorasi Label
tampilan secara lebih mendalam, termasuk warna, font, dan pemformatan.
Membungkus paragraf
Ketika properti berisi teks panjang, Label
secara otomatis membungkusnya ke beberapa baris seperti yang ditunjukkan oleh sampel Baskervilles.Label
Text
Anda dapat menyematkan kode Unicode seperti '\u2014' untuk karakter em-dash, atau C# seperti '\r' untuk memecah ke baris baru.
HorizontalOptions
Ketika properti dan VerticalOptions
dari a Label
diatur ke LayoutOptions.Fill
, ukuran Label
keseluruhan diatur oleh ruang yang disediakan kontainernya. Dikatakan Label
terkendala. Label
Ukurannya adalah ukuran kontainernya.
HorizontalOptions
Ketika properti dan VerticalOptions
diatur ke nilai selain LayoutOptions.Fill
, ukuran Label
diatur oleh spasi yang diperlukan untuk merender teks, hingga ukuran kontainernya tersedia untuk Label
. dikatakan Label
tidak dibatasi dan menentukan ukurannya sendiri.
(Catatan: Istilah yang dibatasi dan tidak dibatasi mungkin berlawanan intuitif, karena tampilan yang tidak dibatasi umumnya lebih kecil dari tampilan yang dibatasi. Selain itu, istilah-istilah ini tidak digunakan secara konsisten pada bab-bab awal buku.)
Tampilan seperti Label
dapat dibatasi dalam satu dimensi dan tidak dibatasi di dimensi lainnya. Hanya Label
akan membungkus teks pada beberapa baris jika dibatasi secara horizontal.
Jika dibatasi, mungkin menempati lebih banyak ruang daripada yang Label
diperlukan untuk teks. Teks dapat diposisikan dalam area keseluruhan .Label
HorizontalTextAlignment
Atur properti ke anggota TextAlignment
enumerasi (Start
, Center
, atau End
) untuk mengontrol perataan semua baris paragraf. Defaultnya adalah Start
dan rata kiri teks.
VerticalTextAlignment
Atur properti ke anggota TextAlignment
enumerasi untuk memosisikan teks di bagian atas, tengah, atau bawah area yang ditempati oleh Label
.
Atur LineBreakMode
properti ke anggota LineBreakMode
enumerasi (WordWrap
, , CharacterWrap
, NoWrap
, HeadTruncation
MiddleTruncation
, atau TailTruncation
) untuk mengontrol bagaimana beberapa baris dalam pemisah paragraf atau dipotong.
Warna teks dan latar belakang
Atur TextColor
properti dan BackgroundColor
ke Label
Color
nilai untuk mengontrol warna teks dan latar belakang.
BackgroundColor
berlaku untuk latar belakang seluruh area yang ditempati oleh Label
. Tergantung pada HorizontalOptions
properti dan VerticalOptions
, ukuran tersebut mungkin jauh lebih besar dari area yang diperlukan untuk menampilkan teks. Anda dapat menggunakan warna untuk bereksperimen dengan berbagai nilai HorizontalOptions
, , HorizontalExeAlignment
VerticalOptions
, dan VerticalTextAlignment
untuk melihat bagaimana pengaruhnya terhadap ukuran dan posisi Label
, serta ukuran dan posisi teks dalam Label
.
Struktur Warna
Struktur ini Color
memungkinkan Anda menentukan warna sebagai nilai Red-Green-Blue (RGB), atau nilai Hue-Saturation-Luminosity (HSL), atau dengan nama warna. Saluran Alpha juga tersedia untuk menunjukkan transparansi.
Color
Gunakan konstruktor untuk menentukan:
- bayangan abu-abu
- nilai RGB
- nilai RGB dengan transparansi
Argumen adalah double
nilai mulai dari 0 hingga 1.
Anda juga dapat menggunakan beberapa metode statis untuk membuat Color
nilai:
Color.FromRgb
untukdouble
nilai RGB dari 0 hingga 1Color.FromRgb
untuk nilai RGB bilangan bulat dari 0 hingga 255Color.FromRgba
untukdouble
nilai RGB dengan transparansiColor.FromRgba
untuk nilai RGB bilangan bulat dengan transparansiColor.FromHsla
untukdouble
nilai HSL dengan transparansiColor.FromUint
untuk nilai yanguint
dihitung sebagai (B + 256 * (G + 256 * (R + 256 * A)))Color.FromHex
string
untuk format digit heksadesimal dalam bentuk "#AARRGGBB" atau "#RRGGBB" atau "#ARGB" atau "#RGB", di mana setiap huruf sesuai dengan digit heksadesimal untuk saluran alfa, merah, hijau, dan biru. Metode ini utama digunakan untuk konversi warna XAML seperti yang dibahas dalam Bab 7, XAML vs. kode.
Setelah dibuat, Color
nilai tidak dapat diubah. Karakteristik warna dapat diperoleh dari properti berikut:
Ini semua double
adalah nilai mulai dari 0 hingga 1.
Color
juga mendefinisikan 240 bidang baca-saja statis publik untuk warna umum. Pada saat buku ditulis, hanya 17 warna umum yang tersedia.
Bidang baca-saja statis publik lainnya menentukan warna dengan semua saluran warna diatur ke nol:
Beberapa metode instans memungkinkan memodifikasi warna yang ada untuk membuat warna baru:
Terakhir, dua properti baca-saja statis menentukan nilai warna khusus:
Color.Default
, semua saluran diatur ke –1Color.Accent
Color.Default
dimaksudkan untuk menegakkan skema warna platform, dan akibatnya memiliki arti yang berbeda dalam konteks yang berbeda pada platform yang berbeda. Secara default, skema warna platform adalah:
- iOS: Teks gelap pada latar belakang terang
- Android: Teks terang pada latar belakang gelap (dalam buku) atau teks gelap pada latar belakang terang (untuk Desain Bahan melalui AppCompat di cabang utama repositori kode sampel)
- UWP: Teks gelap pada latar belakang terang
Nilai menghasilkan Color.Accent
warna khusus platform (dan terkadang dapat dipilih pengguna) yang terlihat di latar belakang gelap atau terang.
Mengubah skema warna aplikasi
Berbagai platform memiliki skema warna default seperti yang ditunjukkan dalam daftar di atas.
Saat menargetkan Android, Anda dapat beralih ke skema gelap terang dengan menentukan tema cahaya dalam file Android.Manifest.xml.
Untuk platform Windows, tema warna biasanya dipilih oleh pengguna, tetapi Anda dapat menambahkan atribut yang RequestedTheme
diatur ke atau Light
Dark
di file App.xaml platform. Secara default, file App.xaml dalam proyek UWP berisi atribut yang RequestedTheme
diatur ke Light
.
Ukuran dan atribut font
Atur FontFamily
properti ke Label
string seperti "Times Roman" untuk memilih keluarga font. Namun, Anda perlu menentukan keluarga font yang didukung pada platform tertentu, dan platform tidak konsisten dalam hal ini.
Atur FontSize
properti ke Label
double
untuk menentukan perkiraan tinggi font. Lihat Bab 5, Menangani Ukuran, untuk detail selengkapnya tentang memilih ukuran font dengan cerdas.
Anda dapat memperoleh salah satu dari beberapa ukuran font yang bergantung pada platform yang telah ditetapkan sebelumnya. Metode statis Device.GetNamedSize
dan kelebihan beban mengembalikan nilai ukuran font yang double
sesuai dengan platform berdasarkan anggota NamedSize
enumerasi (Default
, , Micro
Small
, Medium
, dan Large
). Nilai yang Medium
dikembalikan dari anggota belum tentu sama Default
dengan . Sampel NamedFontSizes menampilkan teks dengan ukuran bernama ini.
Atur FontAttributes
properti ke Label
anggota enumerasi ini FontAttributes
, , Bold
, Italic
atau None
. Anda dapat menggabungkan Bold
anggota dan Italic
dengan operator C# bitwise OR.
Teks yang diformat
Dalam semua contoh sejauh ini, seluruh teks yang Label
ditampilkan oleh telah diformat secara seragam. Untuk memvariasikan pemformatan dalam string teks, jangan atur Text
properti .Label
Sebagai gantinya FormattedText
, atur properti ke objek jenis FormattedString
.
FormattedString
memiliki Spans
properti yang merupakan kumpulan Span
objek. Setiap Span
objek memiliki properti , , FontFamily
FontSize
, FontAttributes
, ForegroundColor
, dan BackgroundColor
sendiriText
.
Sampel VariableFormattedText menunjukkan penggunaan FormattedText
properti untuk satu baris teks, dan VariableFormattedParagraph menunjukkan teknik untuk seluruh paragraf, seperti yang ditunjukkan di sini:
Program NamedFontSizes menggunakan satu Label
dan FormattedString
objek untuk menampilkan semua ukuran font bernama untuk setiap platform.