Sdílet prostřednictvím

Hello, Android Multiscreen: Rychlý start

Tento dvoudílný průvodce rozbalí aplikaci Telefon word pro zpracování druhé obrazovky. Základní stavební bloky aplikací pro Android jsou představeny podrobněji v architektuře Androidu.

V názorné části této příručky přidáte druhou obrazovku pro Telefon word aplikaci, abyste mohli sledovat historii čísel přeložených pomocí aplikace. Poslední aplikace bude mít druhou obrazovku, která zobrazí čísla, která byla přeložena, jak je znázorněno na snímku obrazovky vpravo:

Ukázkové snímky obrazovky aplikace

Doprovodné podrobné recenze, které byly vytvořeny a diskutují o architektuře, navigaci a dalších nových konceptech Androidu.

Požadavky

Vzhledem k tomu, že tato příručka přebírá místo, kde Hello, Android opustí, vyžaduje dokončení rychlého startu Hello, Android.

Názorný postup

V tomto názorném postupu přidáte obrazovku Historie překladu do aplikace Telefon word.

Začněte otevřením aplikace Telefon word v sadě Visual Studio a úpravou souboru Main.axml z Průzkumník řešení.

Tip

Novější verze sady Visual Studio podporují otevírání .xml souborů v android Designeru.

Android Designer podporuje soubory .axml i .xml.

Aktualizace rozložení

Z panelu nástrojů přetáhněte tlačítko na návrhovou plochu a umístěte ho pod přeložené zobrazení textu Telefon Word TextView. V podokně Vlastnosti změňte ID tlačítka na@+id/TranslationHistoryButton

Přetažení nového tlačítka

Nastavte vlastnost Text tlačítka na @string/translationHistoryhodnotu . Android Designer to interpretuje doslova, ale provedete několik změn, aby se text tlačítka zobrazoval správně:

Nastavení textu tlačítka historie překladu

Rozbalte uzel hodnot ve složce Resources v Průzkumník řešení a poklikejte na soubor prostředků řetězce Strings.xml:

Otevřít Strings.xml

translationHistory Do souboru Strings.xml přidejte název řetězce a hodnotu a uložte ho:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="translationHistory">Translation History</string>
    <string name="ApplicationName">Phoneword</string>
</resources>

Text tlačítka Historie překladu by se měl aktualizovat tak, aby odrážel novou hodnotu řetězce:

Tlačítko odráží novou řetězcovou hodnotu.

Když je na návrhové ploše vybráno tlačítko Historie překladu, najděte enabled nastavení v podokně Vlastnosti a nastavte jeho hodnotu tak, aby false se tlačítko zakázalo. To způsobí, že tlačítko bude tmavší na návrhové ploše:

Tlačítko Zakázat historii překladu

Vytvoření druhé aktivity

Vytvořte druhou aktivitu, která umožní druhou obrazovku. V Průzkumník řešení klikněte pravým tlačítkem na projekt Telefon word a zvolte Přidat > novou položku...:

Přidání nového souboru

V dialogovém okně Přidat novou položku zvolte Aktivitu jazyka Visual C# > a pojmenujte soubor aktivity TranslationHistoryActivity.cs.

Kód šablony v TranslationHistoryActivity.cs nahraďte následujícím kódem:

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);
        }
    }
}

V této třídě vytváříte ListActivity a naplňujete ji programově, takže pro tuto aktivitu nemusíte vytvářet nový soubor rozložení. Tento článek je podrobněji popsán v tématu Hello, Android Multiscreen Deep Dive.

Přidání seznamu

Tato aplikace shromažďuje telefonní čísla (která uživatel přeložil na první obrazovce) a předává je na druhou obrazovku. Telefonní čísla se ukládají jako seznam řetězců. Chcete-li podporovat seznamy (a záměry, které se používají později), přidejte na začátek MainActivity.cs následující using direktivy:

using System.Collections.Generic;
using Android.Content;

Dále vytvořte prázdný seznam, který se dá vyplnit telefonními čísly. Třída MainActivity bude vypadat takto:

[Activity(Label = "Phoneword", MainLauncher = true)]
public class MainActivity : Activity
{
    static readonly List<string> phoneNumbers = new List<string>();
    ...// OnCreate, etc.
}

MainActivity Do třídy přidejte následující kód pro registraci tlačítka Historie překladu translateButton (tento řádek umístěte za deklaraci):

Button translationHistoryButton = FindViewById<Button> (Resource.Id.TranslationHistoryButton);

Na konec OnCreate metody přidejte následující kód pro připojení tlačítka Historie překladu:

translationHistoryButton.Click += (sender, e) =>
{
    var intent = new Intent(this, typeof(TranslationHistoryActivity));
    intent.PutStringArrayListExtra("phone_numbers", phoneNumbers);
    StartActivity(intent);
};

Aktualizujte tlačítko Přeložit, aby se telefonní číslo přidalo do seznamu .phoneNumbers Obslužná rutina Click by se měla podobat následujícímu translateButton kódu:

// 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;
    }
};

Uložte a sestavte aplikaci, abyste měli jistotu, že nedošlo k žádným chybám.

Spuštění aplikace

Nasaďte aplikaci do emulátoru nebo zařízení. Následující snímky obrazovky znázorňují spuštěnou Telefon word aplikaci:

Ukázkové snímky obrazovky

Začněte otevřením projektu Telefon word v Visual Studio pro Mac a úpravou souboru Main.axml z oblasti řešení.

Tip

Novější verze sady Visual Studio podporují otevírání .xml souborů v android Designeru.

Android Designer podporuje soubory .axml i .xml.

Aktualizace rozložení

Z panelu nástrojů přetáhněte tlačítko na návrhovou plochu a umístěte ho pod přeložené zobrazení textu Telefon Word TextView. Na panelu Vlastnosti změňte ID tlačítka na@+id/TranslationHistoryButton:

Přetažení nového tlačítka

Nastavte vlastnost Text tlačítka na @string/translationHistoryhodnotu . Android Designer to interpretuje doslova, ale provedete několik změn, aby se text tlačítka zobrazoval správně:

Nastavení textu tlačítka historie překladu

Rozbalte uzel hodnot ve složce Resources v oblasti řešení a poklikejte na soubor prostředků řetězce Strings.xml:

Otevření řetězců

translationHistory Do souboru Strings.xml přidejte název řetězce a hodnotu a uložte ho:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="translationHistory">Translation History</string>
    <string name="ApplicationName">Phoneword</string>
</resources>

Text tlačítka Historie překladu by se měl aktualizovat tak, aby odrážel novou hodnotu řetězce:

Tlačítko odráží novou řetězcovou hodnotu.

Když je na návrhové ploše zaškrtnuté tlačítko Historie překladu, otevřete kartu Chování v oblasti Vlastnosti a poklikáním na zaškrtávací políčko Povoleno tlačítko zakažte. To způsobí, že tlačítko bude tmavší na návrhové ploše:

Tlačítko Zakázat historii překladu

Vytvoření druhé aktivity

Vytvořte druhou aktivitu, která umožní druhou obrazovku. V oblasti řešení klikněte na ikonu šedého ozubeného kolečka vedle projektu Telefon word a zvolte Přidat > nový soubor...:

V dialogovém okně Nový soubor zvolte Aktivita Androidu>, pojmenujte aktivitu TranslationHistoryActivitya potom klikněte na Přidat.

Nahraďte kód TranslationHistoryActivity šablony následujícím kódem:

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);
        }
    }
}

V této třídě ListActivity se vytvoří a naplní programově, takže pro tuto aktivitu nemusíte vytvářet nový soubor rozložení. Toto je podrobněji vysvětleno v podrobném zobrazení Hello, Android MultiScreen.

Přidání seznamu

Tato aplikace shromažďuje telefonní čísla (která uživatel přeložil na první obrazovce) a předává je na druhou obrazovku. Telefonní čísla se ukládají jako seznam řetězců. Chcete-li podporovat seznamy (a záměry, které se používají později), přidejte na začátek MainActivity.cs následující using direktivy:

using System.Collections.Generic;
using Android.Content;

Dále vytvořte prázdný seznam, který se dá vyplnit telefonními čísly. Třída MainActivity bude vypadat takto:

[Activity(Label = "Phoneword", MainLauncher = true)]
public class MainActivity : Activity
{
    static readonly List<string> phoneNumbers = new List<string>();
    ...// OnCreate, etc.
}

MainActivity Do třídy přidejte následující kód pro registraci tlačítka TranslationHistory History (tento řádek umístěte za TranslationHistoryButton deklaraci):

Button translationHistoryButton = FindViewById<Button> (Resource.Id.TranslationHistoryButton);

Na konec OnCreate metody přidejte následující kód pro připojení tlačítka Historie překladu:

translationHistoryButton.Click += (sender, e) =>
{
    var intent = new Intent(this, typeof(TranslationHistoryActivity));
    intent.PutStringArrayListExtra("phone_numbers", phoneNumbers);
    StartActivity(intent);
};

Aktualizujte tlačítko Přeložit, aby se telefonní číslo přidalo do seznamu .phoneNumbers Obslužná rutina Click by se měla podobat následujícímu TranslateHistoryButton kódu:

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;
    }
};

Spuštění aplikace

Nasaďte aplikaci do emulátoru nebo zařízení. Následující snímky obrazovky znázorňují spuštěnou Telefon word aplikaci:

Ukázkové snímky obrazovky

Blahopřejeme k dokončení první víceobrazovkové aplikace Xamarin.Android! Teď je čas rozeseknout nástroje a dovednosti, které jste se právě naučili – další možností je Hello, Android Multiscreen Deep Dive.

  • Last updated on