Bagikan melalui

Ringkasan Bab 5. Berurusan dengan ukuran

  • Artikel

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.

Beberapa ukuran dalam telah ditemui Xamarin.Forms sejauh ini:

  • Tinggi bilah status iOS adalah 20
  • BoxView memiliki lebar dan tinggi default 40
  • Default Padding dalam a Frame adalah 20
  • Default Spacing pada StackLayout adalah 6
  • Metode Device.GetNamedSize mengembalikan ukuran font numerik

Ukuran ini bukan piksel. Sebaliknya, mereka adalah unit independen perangkat yang diakui secara independen oleh setiap platform.

Piksel, titik, dps, DIP, dan DIU

Di awal sejarah Apple Mac dan Microsoft Windows, pemrogram bekerja dalam satuan piksel. Namun, munculnya tampilan resolusi lebih tinggi memerlukan pendekatan yang lebih virtual dan abstrak untuk koordinat layar. Di dunia Mac, programmer bekerja di unit titik, secara tradisional 1/72 inci, sementara pengembang Windows menggunakan unit independen perangkat (DIU) berdasarkan 1/96 inci.

Perangkat seluler, bagaimanapun, umumnya dipegang jauh lebih dekat ke wajah dan memiliki resolusi yang lebih tinggi daripada layar desktop, yang menyiratkan bahwa kepadatan piksel yang lebih besar dapat ditoleransi.

Programmer yang menargetkan perangkat Apple i Telepon dan iPad terus bekerja di unit titik, tetapi ada 160 titik ini hingga inci. Tergantung pada perangkat, mungkin ada 1, 2, atau 3 piksel ke titik tersebut.

Android mirip. Programmer bekerja dalam satuan piksel independen kepadatan (dps), dan hubungan antara dps dan piksel didasarkan pada 160 dps dengan inci.

Ponsel Windows dan perangkat seluler juga telah menetapkan faktor penskalakan yang menyiratkan sesuatu yang dekat dengan 160 unit independen perangkat ke inci.

Catatan

Xamarin.Forms tidak lagi mendukung ponsel atau perangkat seluler berbasis Windows.

Singkatnya, programmer yang Xamarin.Forms menargetkan ponsel dan tablet dapat mengasumsikan bahwa semua unit pengukuran didasarkan pada kriteria berikut:

  • 160 unit ke inci, setara dengan
  • 64 unit ke sentimeter

Properti dan Height baca-saja Width yang ditentukan dengan VisualElement memiliki nilai "tiruan" default –1. Hanya ketika elemen telah berukuran dan diakomodasi dalam tata letak, properti ini akan mencerminkan ukuran aktual elemen dalam unit independen perangkat. Ukuran ini mencakup set apa pun Padding pada elemen tetapi bukan Margin.

Elemen visual mengaktifkan SizeChanged peristiwa saat Width atau Height telah berubah. Sampel WhatSize menggunakan kejadian ini untuk menampilkan ukuran layar program.

Ukuran metrik

MetricalBoxView menggunakan WidthRequest dan HeightRequest untuk menampilkan BoxView tinggi satu inci dan lebar satu sentimeter.

Estimasi ukuran font

Sampel FontSizes menunjukkan cara menggunakan aturan 160-unit-ke-the-inci untuk menentukan ukuran font dalam satuan titik. Konsistensi visual di antara platform yang menggunakan teknik ini lebih baik daripada Device.GetNamedSize.

Paskan teks ke ukuran yang tersedia

Dimungkinkan untuk mencocokkan blok teks dalam persegi panjang tertentu dengan menghitung FontSize menggunakan Label kriteria berikut:

  • Penspasian baris adalah 120% dari ukuran font (130% pada platform Windows).
  • Lebar karakter rata-rata adalah 50% dari ukuran font.

Sampel EstimatedFontSize menunjukkan teknik ini. Program ini ditulis sebelum Margin properti tersedia, sehingga menggunakan ContentView dengan Padding pengaturan untuk mensimulasikan margin.

Cuplikan layar tiga kali lipat dari perkiraan ukuran font

Jam yang pas untuk ukuran

Sampel FitToSizeClock menunjukkan penggunaan Device.StartTimer untuk memulai timer yang secara berkala memberi tahu aplikasi ketika saatnya untuk memperbarui jam. Ukuran font diatur ke seperenam lebar halaman untuk membuat tampilan sebesar mungkin.

Masalah aksesibilitas

Program EstimatedFontSize dan program FitToSizeClock keduanya berisi kelemahan yang halus: Jika pengguna mengubah pengaturan aksesibilitas ponsel di Android atau Windows 10 Mobile, program tidak lagi dapat memperkirakan seberapa besar teks dirender berdasarkan ukuran font. Sampel AccessibilityTest menunjukkan masalah ini.

Teks yang pas secara emmpirik

Cara lain untuk menyesuaikan teks ke persegi panjang adalah dengan menghitung ukuran teks yang dirender secara emmpirik dan menyesuaikannya ke atas atau ke bawah. Program dalam buku memanggil GetSizeRequest elemen visual untuk mendapatkan ukuran elemen yang diinginkan. Metode itu telah tidak digunakan lagi, dan program seharusnya memanggil Measure.

LabelUntuk , argumen pertama harus lebar kontainer (untuk memungkinkan pembungkusan), sementara argumen kedua harus diatur ke Double.PositiveInfinity untuk membuat tinggi tidak dibatasi. Sampel EmpiricalFontSize menunjukkan teknik ini.