Bagikan melalui

Ringkasan Bab 2. Anatomi aplikasi

  • 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.

Dalam aplikasi Xamarin.Forms , objek yang menempati ruang di layar dikenal sebagai elemen visual, dienkapsulasi oleh VisualElement kelas . Visual Elements dapat dibagi menjadi tiga kategori yang sesuai dengan kelas ini:

Turunan Page menempati seluruh layar, atau hampir seluruh layar. Seringkali, anak dari halaman adalah Layout turunan untuk mengatur elemen visual anak. Anak-anak dapat menjadi kelas atau turunan Layout lain Layout (sering disebut elemen), yang merupakan objek yang familier seperti teks, bitmap, penggeser, tombol, kotak daftar, View dan sebagainya.

Bab ini menunjukkan cara membuat aplikasi dengan berfokus pada Label, yang merupakan turunan View yang menampilkan teks.

Menyapa

Dengan platform Xamarin terinstal, Anda dapat membuat solusi baru Xamarin.Forms di Visual Studio atau Visual Studio untuk Mac. Solusi Halo menggunakan Pustaka Kelas Portabel untuk kode umum.

Catatan

Pustaka Kelas Portabel telah digantikan oleh pustaka .NET Standard. Semua kode sampel dari buku telah dikonversi untuk menggunakan pustaka standar .NET.

Sampel ini menunjukkan solusi yang Xamarin.Forms dibuat di Visual Studio tanpa modifikasi. Solusinya terdiri dari empat proyek:

  • Halo, Pustaka Kelas Portabel (PCL) yang dibagikan oleh proyek lain
  • Hello.Droid, proyek aplikasi untuk Android
  • Hello.iOS, proyek aplikasi untuk iOS
  • Hello.UWP, proyek aplikasi untuk Platform Windows Universal (Windows 10 dan Windows 10 Mobile)

Catatan

Xamarin.Formstidak lagi mendukung Windows 8.1, Windows Telepon 8.1, atau Windows 10 Mobile, tetapi Xamarin.Forms aplikasi berjalan di desktop Windows 10.

Anda dapat membuat salah satu proyek aplikasi ini sebagai proyek startup, lalu membangun dan menjalankan program pada perangkat atau simulator.

Di banyak Xamarin.Forms program, Anda tidak akan memodifikasi proyek aplikasi. Ini sering tetap kecil stubs hanya untuk memulai program. Sebagian besar fokus Anda adalah pustaka yang umum untuk semua aplikasi.

Di dalam file

Visual yang ditampilkan oleh program Hello didefinisikan dalam konstruktor App kelas. App berasal dari Xamarin.Forms kelas Application.

Catatan

Templat solusi Visual Studio untuk Xamarin.Forms membuat halaman dengan file XAML. XAML tidak tercakup dalam buku ini hingga Bab 7.

Bagian Referensi dari proyek Hello PCL mencakup rakitan berikut Xamarin.Forms :

  • Xamarin.Forms. Inti
  • Xamarin.Forms. Xaml
  • Xamarin.Forms. Platform

Bagian Referensi dari lima proyek aplikasi mencakup rakitan tambahan yang berlaku untuk platform individual:

  • Xamarin.Forms. Platform.Android
  • Xamarin.Forms. Platform.iOS
  • Xamarin.Forms. Platform.UWP
  • Xamarin.Forms. Platform.WinRT
  • Xamarin.Forms. Platform.WinRT.Tablet
  • Xamarin.Forms. Platform.WinRT. Telepon

Catatan

Bagian Referensi dari proyek-proyek ini tidak lagi mencantumkan rakitan. Sebagai gantinya, file proyek berisi tag PackageReference yang mereferensikan Xamarin.Forms paket NuGet. Bagian Referensi di Visual Studio mencantumkan Xamarin.Forms paket daripada Xamarin.Forms rakitan.

Setiap proyek aplikasi berisi panggilan ke metode statis Forms.Init di Xamarin.Forms namespace layanan. Ini menginisialisasi Xamarin.Forms pustaka. Versi yang berbeda didefinisikan Forms.Init untuk setiap platform. Panggilan ke metode ini dapat ditemukan di kelas berikut:

Selain itu, setiap platform harus membuat instans App lokasi kelas di pustaka bersama. Ini terjadi dalam panggilan ke LoadApplication di kelas berikut:

Jika tidak, proyek aplikasi ini adalah program "tidak melakukan apa-apa" normal.

PCL atau SAP?

Anda dapat membuat Xamarin.Forms solusi dengan kode umum baik di Pustaka Kelas Portabel (PCL) atau Proyek Aset Bersama (SAP). Untuk membuat solusi SAP, pilih opsi Bersama di Visual Studio. Solusi HelloSap menunjukkan templat SAP tanpa modifikasi.

Catatan

Pustaka Kelas Portabel telah digantikan oleh pustaka .NET Standard. Semua kode sampel dari buku telah dikonversi untuk menggunakan pustaka standar .NET. Jika tidak, pustaka PCL dan .NET Standard secara konseptual sangat mirip.

Pendekatan pustaka menggabungkan semua kode umum dalam proyek pustaka yang dirujuk oleh proyek aplikasi platform. Dengan pendekatan SAP, kode umum secara efektif ada di semua proyek aplikasi platform dan dibagikan di antara mereka.

Sebagian besar Xamarin.Forms pengembang lebih suka pendekatan pustaka. Dalam buku ini, sebagian besar solusi menggunakan pustaka. Mereka yang menggunakan SAP menyertakan akhiran Sap dalam nama proyek.

Dengan pendekatan SAP, kode dalam proyek bersama dapat menjalankan kode yang berbeda untuk berbagai platform dengan menggunakan arahan prapemrosedur C# (#if, #elif, dan #endif) dengan pengidentifikasi yang telah ditentukan sebelumnya ini:

  • iOS: __IOS__
  • Android: __ANDROID__
  • UWP: WINDOWS_UWP

Di pustaka bersama, Anda dapat menentukan platform apa yang Anda jalankan saat runtime, seperti yang akan Anda lihat nanti di bab ini.

Label untuk teks

Solusi Salam menunjukkan cara menambahkan file C# baru ke proyek Salam . File ini mendefinisikan kelas bernama GreetingsPage yang berasal dari ContentPage. Dalam buku ini, sebagian besar proyek berisi satu ContentPage turunan yang namanya adalah nama proyek dengan akhiran Page ditambahkan.

GreetingsPage Konstruktor membuat contoh Label tampilan, yang merupakan Xamarin.Forms tampilan yang menampilkan teks. Properti Text diatur ke teks yang ditampilkan oleh Label. Program ini mengatur ke LabelContent properti .ContentPage Konstruktor App kelas kemudian membuat instans GreetingsPage dan mengaturnya ke propertinya MainPage .

Teks ditampilkan di sudut kiri atas halaman. Di iOS, ini berarti bilah status halaman tumpang tindih. Ada beberapa solusi untuk masalah ini:

Solusi 1. Sertakan padding pada halaman

Atur Padding properti di halaman. Padding berjenis Thickness, struktur dengan empat properti:

Padding menentukan area di dalam halaman tempat konten dikecualikan. Ini memungkinkan Label untuk menghindari penimpaan bilah status iOS.

Solusi 2. Sertakan padding hanya untuk iOS (hanya SAP)

Atur properti 'Padding' hanya di iOS menggunakan SAP dengan arahan preproscessor C#. Ini ditunjukkan dalam solusi GreetingsSap.

Solusi 3. Sertakan padding hanya untuk iOS (PCL atau SAP)

Dalam versi yang Xamarin.Forms digunakan untuk buku, Padding properti khusus untuk iOS di PCL atau SAP dapat dipilih menggunakan Device.OnPlatform metode atau Device.OnPlatform<T> statis. Metode ini sekarang tidak digunakan lagi

Metode ini Device.OnPlatform digunakan untuk menjalankan kode khusus platform atau untuk memilih nilai khusus platform. Secara internal, mereka menggunakan Device.OS properti baca-saja statis, yang mengembalikan anggota TargetPlatform enumerasi:

Metode Device.OnPlatform , Device.OS properti, dan TargetPlatform enumerasi semuanya sekarang tidak digunakan lagi. Sebagai gantinya Device.RuntimePlatform , gunakan properti dan bandingkan string nilai pengembalian dengan bidang statis berikut:

  • iOS, string "iOS"
  • Android, string "Android"
  • UWP, string "UWP", mengacu pada Platform Windows Universal

Properti Device.Idiom baca-saja statis terkait. Ini mengembalikan anggota TargetIdiom, yang memiliki anggota ini:

Untuk iOS dan Android, cutoff antara Tablet dan Phone adalah lebar potret 600 unit. Untuk platform Windows, Desktop menunjukkan aplikasi UWP yang berjalan di bawah Windows 10, dan Phone menunjukkan aplikasi UWP yang berjalan di bawah aplikasi Windows 10.

Solusi 3a. Mengatur margin pada Label

Properti Margin diperkenalkan terlambat untuk disertakan dalam buku, tetapi juga berjenis Thickness dan Anda dapat mengaturnya untuk Label menentukan area di luar tampilan yang disertakan dalam perhitungan tata letak tampilan.

Properti Padding hanya tersedia di Layout dan Page turunannya. Properti Margin ini tersedia di semua View turunan.

Solusi 4. Tengahkan label di dalam halaman

Anda dapat mempusatkan LabelPage di dalam (atau meletakkannya di salah satu dari delapan tempat lain) dengan mengatur HorizontalOptions properti dan VerticalOptions ke Label nilai jenis LayoutOptions. Struktur LayoutOptions mendefinisikan dua properti:

  • Properti Alignment jenis LayoutAlignment, enumerasi dengan empat anggota: Start, yang berarti kiri atau atas tergantung pada orientasi, Center, End, yang berarti kanan atau bawah tergantung pada orientasi, dan Fill.

  • Properti Expands jenis bool.

Umumnya properti ini tidak digunakan secara langsung. Sebagai gantinya, kombinasi dari kedua properti ini disediakan oleh delapan properti baca-saja statis jenis LayoutOptions:

HorizontalOptions dan VerticalOptions merupakan properti paling penting dalam Xamarin.Forms tata letak, dan dibahas secara lebih rinci dalam Bab 4. Menggulir Tumpukan.

Berikut hasilnya dengan HorizontalOptions properti dan VerticalOptions keduanya Label diatur ke LayoutOptions.Center:

Cuplikan layar tiga kali program salam

Solusi 5. Tengahkan teks di dalam Label

Anda juga dapat mempusatkan teks (atau menempatkannya di delapan lokasi lain di halaman) dengan mengatur HorizontalTextAlignment properti dan VerticalTextAlignment ke Label anggota TextAlignment enumerasi:

  • Start, yang berarti kiri atau atas (tergantung pada orientasi)
  • Center
  • End, yang berarti kanan atau bawah (tergantung pada orientasi)

Kedua properti ini hanya didefinisikan oleh Label, sedangkan HorizontalAlignment properti dan VerticalAlignment didefinisikan oleh View dan diwariskan oleh semua View turunan. Hasil visual mungkin tampak mirip, tetapi sangat berbeda seperti yang ditunjukkan bab berikutnya.