Bagikan melalui


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.LabelText 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, HeadTruncationMiddleTruncation, atau TailTruncation) untuk mengontrol bagaimana beberapa baris dalam pemisah paragraf atau dipotong.

Warna teks dan latar belakang

Atur TextColor properti dan BackgroundColor ke LabelColor 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, , HorizontalExeAlignmentVerticalOptions, 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:

Argumen adalah double nilai mulai dari 0 hingga 1.

Anda juga dapat menggunakan beberapa metode statis untuk membuat Color nilai:

  • Color.FromRgb untuk double nilai RGB dari 0 hingga 1
  • Color.FromRgb untuk nilai RGB bilangan bulat dari 0 hingga 255
  • Color.FromRgba untuk double nilai RGB dengan transparansi
  • Color.FromRgba untuk nilai RGB bilangan bulat dengan transparansi
  • Color.FromHsla untuk double nilai HSL dengan transparansi
  • Color.FromUint untuk nilai yang uint dihitung sebagai (B + 256 * (G + 256 * (R + 256 * A)))
  • Color.FromHexstring 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 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 LightDark 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 Labeldouble 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, , MicroSmall, Medium, dan Large). Nilai yang Medium dikembalikan dari anggota belum tentu sama Defaultdengan . Sampel NamedFontSizes menampilkan teks dengan ukuran bernama ini.

Atur FontAttributes properti ke Label anggota enumerasi ini FontAttributes , , Bold, Italicatau 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 , , FontFamilyFontSize, 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:

Cuplikan layar tiga kali dari paragraf berformat variabel

Program NamedFontSizes menggunakan satu Label dan FormattedString objek untuk menampilkan semua ukuran font bernama untuk setiap platform.