Halo, Android Multiscreen: Mulai Cepat
Panduan dua bagian ini memperluas aplikasi Telepon word untuk menangani layar kedua. Sepanjang jalan, Blok Penyusun Aplikasi Android dasar diperkenalkan dengan penyelaman yang lebih dalam tentang arsitektur Android.
Dalam bagian panduan panduan ini, Anda akan menambahkan layar kedua ke aplikasi Telepon word untuk melacak riwayat angka yang diterjemahkan menggunakan aplikasi. Aplikasi akhir akan memiliki layar kedua yang menampilkan angka yang "diterjemahkan", seperti yang diilustrasikan oleh cuplikan layar di sebelah kanan:
Deep Dive yang menyertainya meninjau apa yang dibangun dan membahas arsitektur, navigasi, dan konsep Android baru lainnya yang ditemui di sepanjang jalan.
Persyaratan
Karena panduan ini mengambil tempat Halo, Android tidak aktif, panduan ini memerlukan penyelesaian Mulai Cepat Hello, Android.
Panduan
Dalam panduan ini, Anda akan menambahkan layar Riwayat Terjemahan ke aplikasi Telepon word.
Mulailah dengan membuka aplikasi Telepon word di Visual Studio dan mengedit file Main.axml dari Penjelajah Solusi.
Tip
Rilis Visual Studio yang lebih baru mendukung pembukaan file .xml di dalam Android Designer.
File .axml dan .xml didukung di Android Designer.
Memperbarui tata letak
Dari Kotak Alat, seret Tombol ke permukaan desain dan letakkan di bawah TextView Terjemahan Telepon Word. Di panel Properti, ubah Id tombol menjadi@+id/TranslationHistoryButton
Atur properti Teks tombol ke @string/translationHistory. Android Designer akan menginterpretasikan ini secara harfiah, tetapi Anda akan membuat beberapa perubahan sehingga teks tombol muncul dengan benar:
Perluas simpul nilai di bawah folder Sumber Daya di Penjelajah Solusi dan klik dua kali file sumber daya string, Strings.xml:
translationHistory Tambahkan nama dan nilai string ke file Strings.xml dan simpan:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="translationHistory">Translation History</string>
<string name="ApplicationName">Phoneword</string>
</resources>
Teks tombol Riwayat Terjemahan harus diperbarui untuk mencerminkan nilai string baru:
Dengan tombol Riwayat Terjemahan dipilih pada permukaan desain, temukan enabled pengaturan di panel Properti dan atur nilainya ke false untuk menonaktifkan tombol. Ini akan menyebabkan tombol menjadi lebih gelap pada permukaan desain:
Membuat aktivitas kedua
Buat Aktivitas kedua untuk menyalakan layar kedua. Di Penjelajah Solusi, klik kanan proyek Telepon word dan pilih Tambahkan > Item Baru...:
Dalam dialog Tambahkan Item Baru, pilih Aktivitas Visual C# > dan beri nama file Aktivitas TranslationHistoryActivity.cs.
Ganti kode templat di TranslationHistoryActivity.cs dengan yang berikut ini:
using System;
using System.Collections.Generic;
using Android.App;
using Android.OS;
using Android.Widget;
namespace Phoneword
{
[Activity(Label = "@string/translationHistory")]
public class TranslationHistoryActivity : ListActivity
{
protected override void OnCreate(Bundle bundle)
{
base.OnCreate(bundle);
// Create your application here
var phoneNumbers = Intent.Extras.GetStringArrayList("phone_numbers") ?? new string[0];
this.ListAdapter = new ArrayAdapter<string>(this, Android.Resource.Layout.SimpleListItem1, phoneNumbers);
}
}
}
Di kelas ini, Anda membuat ListActivity dan mengisinya secara terprogram, sehingga Anda tidak perlu membuat file tata letak baru untuk Aktivitas ini. Ini dibahas secara lebih rinci di Hello, Android Multiscreen Deep Dive.
Menambahkan daftar
Aplikasi ini mengumpulkan nomor telepon (yang telah diterjemahkan pengguna di layar pertama) dan meneruskannya ke layar kedua. Nomor telepon disimpan sebagai daftar string. Untuk mendukung daftar (dan Niat, yang digunakan nanti), tambahkan arahan berikut using ke bagian atas MainActivity.cs:
using System.Collections.Generic;
using Android.Content;
Selanjutnya, buat daftar kosong yang dapat diisi dengan nomor telepon.
Kelas MainActivity akan terlihat seperti ini:
[Activity(Label = "Phoneword", MainLauncher = true)]
public class MainActivity : Activity
{
static readonly List<string> phoneNumbers = new List<string>();
...// OnCreate, etc.
}
MainActivity Di kelas , tambahkan kode berikut untuk mendaftarkan tombol Riwayat Terjemahan (tempatkan baris ini setelah translateButton deklarasi):
Button translationHistoryButton = FindViewById<Button> (Resource.Id.TranslationHistoryButton);
Tambahkan kode berikut ke akhir OnCreate metode untuk menghubungkan tombol Riwayat Terjemahan:
translationHistoryButton.Click += (sender, e) =>
{
var intent = new Intent(this, typeof(TranslationHistoryActivity));
intent.PutStringArrayListExtra("phone_numbers", phoneNumbers);
StartActivity(intent);
};
Perbarui tombol Terjemahkan untuk menambahkan nomor telepon ke daftar phoneNumbers. Handler Click untuk translateButton harus menyerupai kode berikut:
// Add code to translate number
string translatedNumber = string.Empty;
translateButton.Click += (sender, e) =>
{
// Translate user's alphanumeric phone number to numeric
translatedNumber = Core.PhonewordTranslator.ToNumber(phoneNumberText.Text);
if (string.IsNullOrWhiteSpace(translatedNumber))
{
translatedPhoneWord.Text = "";
}
else
{
translatedPhoneWord.Text = translatedNumber;
phoneNumbers.Add(translatedNumber);
translationHistoryButton.Enabled = true;
}
};
Simpan dan buat aplikasi untuk memastikan tidak ada kesalahan.
Menjalankan aplikasi
Sebarkan aplikasi ke emulator atau perangkat. Cuplikan layar berikut mengilustrasikan aplikasi Telepon word yang sedang berjalan:
Mulailah dengan membuka proyek Telepon word di Visual Studio untuk Mac dan mengedit file Main.axml dari Solution Pad.
Tip
Rilis Visual Studio yang lebih baru mendukung pembukaan file .xml di dalam Android Designer.
File .axml dan .xml didukung di Android Designer.
Memperbarui tata letak
Dari Kotak Alat, seret Tombol ke permukaan desain dan letakkan di bawah TextView Terjemahan Telepon Word. Di pad Properti, ubah Id tombol menjadi @+id/TranslationHistoryButton:
Atur properti Teks tombol ke @string/translationHistory. Android Designer akan menginterpretasikan ini secara harfiah, tetapi Anda akan membuat beberapa perubahan sehingga teks tombol muncul dengan benar:
Perluas node nilai di bawah folder Sumber Daya di Solution Pad dan klik dua kali file sumber daya string, Strings.xml:
translationHistory Tambahkan nama dan nilai string ke file Strings.xml dan simpan:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="translationHistory">Translation History</string>
<string name="ApplicationName">Phoneword</string>
</resources>
Teks tombol Riwayat Terjemahan harus diperbarui untuk mencerminkan nilai string baru:
Dengan tombol Riwayat Terjemahan dipilih pada permukaan desain, buka tab Perilaku di Pad Properti dan klik dua kali kotak centang Diaktifkan untuk menonaktifkan tombol. Ini akan menyebabkan tombol menjadi lebih gelap pada permukaan desain:
Membuat aktivitas kedua
Buat Aktivitas kedua untuk menyalakan layar kedua. Di Pad Solusi, klik ikon gigi abu-abu di samping proyek Telepon word dan pilih Tambahkan > File Baru...:
Dari dialog File Baru, pilih Aktivitas Android>, beri nama Aktivitas TranslationHistoryActivity, lalu klik Tambahkan.
Ganti kode templat dengan TranslationHistoryActivity yang berikut ini:
using System;
using System.Collections.Generic;
using Android.App;
using Android.OS;
using Android.Widget;
namespace Phoneword
{
[Activity(Label = "@string/translationHistory")]
public class TranslationHistoryActivity : ListActivity
{
protected override void OnCreate(Bundle bundle)
{
base.OnCreate(bundle);
// Create your application here
var phoneNumbers = Intent.Extras.GetStringArrayList("phone_numbers") ?? new string[0];
this.ListAdapter = new ArrayAdapter<string>(this, Android.Resource.Layout.SimpleListItem1, phoneNumbers);
}
}
}
Di kelas ini, ListActivity dibuat dan diisi secara terprogram, sehingga Anda tidak perlu membuat file tata letak baru untuk Aktivitas ini. Ini dijelaskan secara lebih rinci dalam Halo, Android Multiscreen Deep Dive.
Menambahkan daftar
Aplikasi ini mengumpulkan nomor telepon (yang telah diterjemahkan pengguna di layar pertama) dan meneruskannya ke layar kedua. Nomor telepon disimpan sebagai daftar string. Untuk mendukung daftar (dan Niat, yang digunakan nanti), tambahkan arahan berikut using ke bagian atas MainActivity.cs:
using System.Collections.Generic;
using Android.Content;
Selanjutnya, buat daftar kosong yang dapat diisi dengan nomor telepon. Kelas MainActivity akan terlihat seperti ini:
[Activity(Label = "Phoneword", MainLauncher = true)]
public class MainActivity : Activity
{
static readonly List<string> phoneNumbers = new List<string>();
...// OnCreate, etc.
}
MainActivity Di kelas , tambahkan kode berikut untuk mendaftarkan tombol Riwayat TranslationHistory (tempatkan baris ini setelah TranslationHistoryButton deklarasi):
Button translationHistoryButton = FindViewById<Button> (Resource.Id.TranslationHistoryButton);
Tambahkan kode berikut ke akhir OnCreate metode untuk menghubungkan tombol Riwayat Terjemahan:
translationHistoryButton.Click += (sender, e) =>
{
var intent = new Intent(this, typeof(TranslationHistoryActivity));
intent.PutStringArrayListExtra("phone_numbers", phoneNumbers);
StartActivity(intent);
};
Perbarui tombol Terjemahkan untuk menambahkan nomor telepon ke daftar phoneNumbers. Handler Click untuk TranslateHistoryButton harus menyerupai kode berikut:
translateButton.Click += (sender, e) =>
{
// Translate user's alphanumeric phone number to numeric
translatedNumber = Core.PhonewordTranslator.ToNumber(phoneNumberText.Text);
if (string.IsNullOrWhiteSpace(translatedNumber))
{
translatedPhoneWord.Text = "";
}
else
{
translatedPhoneWord.Text = translatedNumber;
phoneNumbers.Add(translatedNumber);
translationHistoryButton.Enabled = true;
}
};
Menjalankan aplikasi
Sebarkan aplikasi ke emulator atau perangkat. Cuplikan layar berikut mengilustrasikan aplikasi Telepon word yang sedang berjalan:
Selamat atas penyelesaian aplikasi Xamarin.Android multi-layar pertama Anda! Sekarang saatnya untuk membedah alat dan keterampilan yang baru saja Anda pelajari - selanjutnya adalah Hello, Android Multiscreen Deep Dive.