Xamarin.Forms Kurz editoru

Článek
Developer (Začátečník)
8 min do dokončení

Než se pustíte do tohoto kurzu, měli byste úspěšně dokončit tyto položky:

Vytvořte svůj první Xamarin.Forms rychlý start k aplikaci .
Kurz k objektu StackLayout

V tomto kurzu se naučíte:

Vytvořte v XAML.Xamarin.FormsEditor
Reakce na změny textu v objektu Editor
Přizpůsobení chování Editor

V sadě Visual Studio 2019 nebo Visual Studio pro Mac vytvoříte jednoduchou aplikaci, která předvádí, jak přizpůsobit chování objektu Editor. Na následujících snímcích obrazovky je zachycena finální aplikace:

K zobrazení změn uživatelského rozhraní bez opětovného sestavení aplikace použijete také Opětovné načítání za provozu Xamarin.Forms XAML.

Vytvoření editoru

7 min zbývá

Visual Studio
Visual Studio pro Mac

K dokončení tohoto kurzu byste měli mít Visual Studio 2019 (nejnovější vydanou verzi) s nainstalovanou sadou funkcí Vývoj mobilních aplikací pomocí .NET. Kromě toho budete potřebovat spárovaný Mac pro sestavení aplikace z kurzu v iOSu. Informace o instalaci platformy Xamarin najdete v článku Instalace Xamarinu. Informace o připojení sady Visual Studio 2019 k hostiteli buildu pro Mac najdete v článku Spárování s počítačem Mac pro vývoj na platformě Xamarin.iOS.

Spusťte Visual Studio a vytvořte novou prázdnou Xamarin.Forms aplikaci s názvem EditorTutorial.

Důležité

Fragmenty kódu C# a XAML v tomto kurzu vyžadují, aby řešení mělo název EditorTutorial. Použití jiného názvu způsobí při kopírování kódu z tohoto kurzu do řešení chyby sestavení.

Další informace o knihovně .NET Standard, která se vytvoří, najdete v tématu Anatomie Xamarin.Forms aplikace v podrobném Xamarin.Forms kurzu Rychlý start.
V Průzkumníkovi řešení v projektu EditorTutorial poklikáním otevřete soubor MainPage.xaml. Pak v souboru MainPage.xaml odeberte veškerý kód šablony a nahraďte ho následujícím kódem:
```
<?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="EditorTutorial.MainPage">
    <StackLayout Margin="20,35,20,20">
        <Editor Placeholder="Enter multi-line text here"
                HeightRequest="200" />
    </StackLayout>
</ContentPage>
```
Tento kód deklarativně definuje uživatelské rozhraní pro stránku, která se skládá z objektu Editor v objektu StackLayout. Vlastnost Editor.Placeholder určuje zástupný text, který se ukáže při prvním zobrazení objektu Editor. Vlastnost HeightRequest pak určuje výšku objektu Editor v jednotkách nezávislých na zařízení.
Na panelu nástrojů sady Visual Studio stiskněte tlačítko Spustit (trojúhelníkové tlačítko, která se podobá tlačítku Přehrát), aby se aplikace spustila ve zvoleném vzdáleném simulátoru iOSu nebo emulátoru Androidu:

Poznámka:

Android indikuje výšku objektu Editor, ale iOS ne.

V sadě Visual Studio zastavte aplikaci.

K dokončení tohoto kurzu byste měli mít Visual Studio pro Mac (nejnovější vydanou verzi) s nainstalovanou podporou pro platformy iOS a Android. Kromě toho budete také potřebovat Xcode (nejnovější vydanou verzi). Další informace o instalaci platformy Xamarin najdete v článku Instalace Xamarinu.

Spusťte Visual Studio pro Mac a vytvořte novou prázdnou Xamarin.Forms aplikaci s názvem EditorTutorial.

Důležité

Fragmenty kódu C# a XAML v tomto kurzu vyžadují, aby řešení mělo název EditorTutorial. Použití jiného názvu způsobí při kopírování kódu z tohoto kurzu do řešení chyby sestavení.

Další informace o knihovně .NET Standard, která se vytvoří, najdete v tématu Anatomie Xamarin.Forms aplikace v podrobném Xamarin.Forms kurzu Rychlý start.
V Oblasti řešení v projektu EditorTutorial poklikáním otevřete soubor MainPage.xaml. Pak v souboru MainPage.xaml odeberte veškerý kód šablony a nahraďte ho následujícím kódem:
```
<?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="EditorTutorial.MainPage">
    <StackLayout Margin="20,35,20,20">
        <Editor Placeholder="Enter multi-line text here"
                HeightRequest="200" />
    </StackLayout>
</ContentPage>
```
Tento kód deklarativně definuje uživatelské rozhraní pro stránku, která se skládá z objektu Editor v objektu StackLayout. Vlastnost Editor.Placeholder určuje zástupný text, který se ukáže při prvním zobrazení objektu Editor. Vlastnost HeightRequest pak určuje výšku objektu Editor v jednotkách nezávislých na zařízení.
Na panelu nástrojů sady Visual Studio pro Mac stiskněte tlačítko Spustit (trojúhelníkové tlačítko, které se podobá tlačítku Přehrát), aby se aplikace spustila ve zvoleném simulátoru iOSu nebo emulátoru Androidu:

Poznámka:

Android indikuje výšku objektu Editor, ale iOS ne.

V sadě Visual Studio pro Mac zastavte aplikaci.

Reakce na změny textu

5 min zbývá

Visual Studio
Visual Studio pro Mac

V souboru MainPage.xaml můžete upravit deklaraci objektu Editor tak, aby nastavila obslužnou rutinu pro události TextChanged a Completed:
```
<Editor Placeholder="Enter multi-line text here"
        HeightRequest="200"
        TextChanged="OnEditorTextChanged"
        Completed="OnEditorCompleted" />
```
Tento kód nastaví událost TextChanged na obslužnou rutinu události s názvem OnEditorTextChanged a událost Completed na obslužnou rutinu události s názvem OnEditorCompleted. Obě obslužné rutiny událostí vytvoříme v následujícím kroku.
V Průzkumníkovi řešení v projektu EditorTutorial rozbalte uzel MainPage.xaml a poklikáním otevřete soubor MainPage.xaml.cs. Potom v souboru MainPage.xaml.cs přidejte do třídy obslužné rutiny událostí OnEditorTextChanged a OnEditorCompleted:
```
void OnEditorTextChanged(object sender, TextChangedEventArgs e)
{
    string oldText = e.OldTextValue;
    string newText = e.NewTextValue;
}

void OnEditorCompleted(object sender, EventArgs e)
{
    string text = ((Editor)sender).Text;
}
```
Když se text v objektu Editor změní, spustí se metoda OnEditorTextChanged. Argument sender je objekt Editor odpovídající za vyvolání události TextChanged a dá se použít pro přístup k objektu Editor. Argument TextChangedEventArgs poskytuje starou a novou textovou hodnotu (před změnou textu a po ní).

Jakmile se úpravy dokončí, metoda OnEditorCompleted se spustí. Toho dosáhnete zrušením výběru objektu Editor nebo také stisknutím tlačítka Hotovo v iOSu. Argument sender je objekt Editor odpovídající za vyvolání události TextChanged a dá se použít pro přístup k objektu Editor.

Důležité

Jakýkoliv text zadaný do objektu Editor se uloží ve vlastnosti Text.
Na panelu nástrojů sady Visual Studio stiskněte tlačítko Spustit (trojúhelníkové tlačítko, která se podobá tlačítku Přehrát), aby se aplikace spustila ve zvoleném vzdáleném simulátoru iOSu nebo emulátoru Androidu:

Nastavte zarážky v těchto dvou obslužných rutinách událostí, zadejte text do objektu Editor a sledujte spuštění události TextChanged. Zrušte výběr objektu Editor, abyste mohli sledovat spuštění události Completed.

Další informace o událostech naleznete v části Události a interaktivita v průvodci editorem Xamarin.Forms.Editor

V souboru MainPage.xaml můžete upravit deklaraci objektu Editor tak, aby nastavila obslužnou rutinu pro události TextChanged a Completed:
```
<Editor Placeholder="Enter multi-line text here"
        HeightRequest="200"
        TextChanged="OnEditorTextChanged"
        Completed="OnEditorCompleted" />
```
Tento kód nastaví událost TextChanged na obslužnou rutinu události s názvem OnEditorTextChanged a událost Completed na obslužnou rutinu události s názvem OnEditorCompleted. Obě obslužné rutiny událostí vytvoříme v následujícím kroku.
V Oblasti řešení v projektu EditorTutorial rozbalte uzel MainPage.xaml a poklikáním otevřete soubor MainPage.xaml.cs. Potom v souboru MainPage.xaml.cs přidejte do třídy obslužné rutiny událostí OnEditorTextChanged a OnEditorCompleted:
```
void OnEditorTextChanged(object sender, TextChangedEventArgs e)
{
    string oldText = e.OldTextValue;
    string newText = e.NewTextValue;
}

void OnEditorCompleted(object sender, EventArgs e)
{
    string text = ((Editor)sender).Text;
}
```
Když se text v objektu Editor změní, spustí se metoda OnEditorTextChanged. Argument sender je objekt Editor odpovídající za vyvolání události TextChanged a dá se použít pro přístup k objektu Editor. Argument TextChangedEventArgs poskytuje starou a novou textovou hodnotu (před změnou textu a po ní).

Jakmile se úpravy dokončí, metoda OnEditorCompleted se spustí. Toho dosáhnete zrušením výběru objektu Editor nebo také stisknutím tlačítka Hotovo v iOSu. Argument sender je objekt Editor odpovídající za vyvolání události TextChanged a dá se použít pro přístup k objektu Editor.

Důležité

Jakýkoliv text zadaný do objektu Editor se uloží ve vlastnosti Text.
Na panelu nástrojů sady Visual Studio pro Mac stiskněte tlačítko Spustit (trojúhelníkové tlačítko, které se podobá tlačítku Přehrát), aby se aplikace spustila ve zvoleném simulátoru iOSu nebo emulátoru Androidu:

Nastavte zarážky v těchto dvou obslužných rutinách událostí, zadejte text do objektu Editor a sledujte spuštění události TextChanged. Zrušte výběr objektu Editor, abyste mohli sledovat spuštění události Completed.

Další informace o událostech naleznete v části Události a interaktivita v průvodci editorem Xamarin.Forms.Editor

Přizpůsobení chování

2 min zbývá

Visual Studio
Visual Studio pro Mac

V souboru MainPage.xaml můžete úpravou deklarace objektu Editor přizpůsobit jeho chování:
```
<Editor Placeholder="Enter multi-line text here"
        AutoSize="TextChanges"
        MaxLength="200"
        IsSpellCheckEnabled="false"
        IsTextPredictionEnabled="false" />
```
Tento kód nastavuje vlastnosti, které přizpůsobují chování objektu Editor. Vlastnost AutoSize je nastavená na TextChanges, což znamená, že výška objektu Editor se bude při přidávání textu zvětšovat a při odebírání textu zmenšovat. Vlastnost MaxLength omezuje délku vstupu, která je pro objekt Editor povolená. Kromě toho je vlastnost IsSpellCheckEnabled nastavená na false, čímž se zakazuje kontrola pravopisu, a vlastnost IsTextPredictionEnabled je nastavená na false, čímž se zakazuje automatické prediktivní vkládání textu.
Pokud aplikace stále běží, uložte změny do souboru a uživatelské rozhraní aplikace se v simulátoru nebo emulátoru aktualizuje automaticky. V ostatních případech na panelu nástrojů sady Visual Studio stiskněte tlačítko Spustit (trojúhelníkové tlačítko, které se podobá tlačítku Přehrát), aby se aplikace spustila ve zvoleném vzdáleném simulátoru iOSu nebo emulátoru Androidu. Zadejte text do objektu Editor a sledujte, jak se výška objektu Editor zvyšuje při přidávání textu a snižuje při jeho odebírání. Všimněte si také, že maximálně je možné zadat 200 znaků:

V sadě Visual Studio zastavte aplikaci.

Další informace o přizpůsobení Editor chování najdete v průvodci editoremXamarin.Forms.

V souboru MainPage.xaml můžete úpravou deklarace objektu Editor přizpůsobit jeho chování:
```
<Editor Placeholder="Enter multi-line text here"
        AutoSize="TextChanges"
        MaxLength="200"
        IsSpellCheckEnabled="false"
        IsTextPredictionEnabled="false" />
```
Tento kód nastavuje vlastnosti, které přizpůsobují chování objektu Editor. Vlastnost AutoSize je nastavená na TextChanges, což znamená, že výška objektu Editor se bude při přidávání textu zvětšovat a při odebírání textu zmenšovat. Vlastnost MaxLength omezuje délku vstupu, která je pro objekt Editor povolená. Kromě toho je vlastnost IsSpellCheckEnabled nastavená na false, čímž se zakazuje kontrola pravopisu, a vlastnost IsTextPredictionEnabled je nastavená na false, čímž se zakazuje automatické prediktivní vkládání textu.
Pokud aplikace stále běží, uložte změny do souboru a uživatelské rozhraní aplikace se v simulátoru nebo emulátoru aktualizuje automaticky. V ostatních případech na panelu nástrojů sady Visual Studio pro Mac stiskněte tlačítko Spustit (trojúhelníkové tlačítko, které se podobá tlačítku Přehrát), aby se aplikace spustila ve zvoleném simulátoru iOSu nebo emulátoru Androidu. Zadejte text do objektu Editor a sledujte, jak se výška objektu Editor zvyšuje při přidávání textu a snižuje při jeho odebírání. Všimněte si také, že maximálně je možné zadat 200 znaků:

V sadě Visual Studio pro Mac zastavte aplikaci.

Další informace o přizpůsobení Editor chování najdete v průvodci editoremXamarin.Forms.

Sdílet prostřednictvím

Xamarin.Forms Kurz editoru

Vytvoření editoru

Reakce na změny textu

Přizpůsobení chování

Gratulujeme!

Další kroky

Sdílet prostřednictvím

Xamarin.Forms Kurz editoru

Vytvoření editoru

Reakce na změny textu

Přizpůsobení chování

Gratulujeme!

Další kroky

Související odkazy