Xamarin.Forms Kurz popisku
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.Forms
Label
- Změnit vzhled objektu
Label
- Zobrazit v jediném objektu
Label
text, který má více formátů
V sadě Visual Studio 2019 nebo Visual Studio pro Mac vytvoříte jednoduchou aplikaci, která předvádí, jak zobrazit text v objektu Label
. 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í popisku
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 LabelTutorial.
Důležité
Fragmenty kódu C# a XAML v tomto kurzu vyžadují, aby řešení mělo název LabelTutorial. 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 LabelTutorial 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="LabelTutorial.MainPage"> <StackLayout Margin="20,35,20,20"> <Label Text="Welcome to Xamarin.Forms!" HorizontalOptions="Center" /> </StackLayout> </ContentPage>
Tento kód deklarativně definuje uživatelské rozhraní pro stránku, která se skládá z objektu
Label
v objektuStackLayout
. VlastnostLabel.Text
určuje text, který se zobrazí, a vlastnostHorizontalOptions
určuje, že objektLabel
bude vodorovně zarovnaný na střed.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:
Změna vzhledu
V souboru MainPage.xaml můžete úpravou deklarace objektu
Label
změnit jeho vzhled:<Label Text="Welcome to Xamarin.Forms!" TextColor="Blue" FontAttributes="Italic" FontSize="22" TextDecorations="Underline" HorizontalOptions="Center" />
Tento kód nastavuje vlastnosti, které změní vzhled objektu
Label
. VlastnostTextColor
nastavuje barvu textu v objektuLabel
. VlastnostFontAttributes
nastavuje písmo v popisku na kurzívu a vlastnostFontSize
určuje velikost písma. Dále se pro objektLabel
nastavením vlastnostiTextDecorations
použije podtržení textu a text se vodorovně zarovná na střed nastavením vlastnostiHorizontalOptions
na hodnotuCenter
.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. Všimněte si, že vzhled objektu
Label
se změnil:Další informace o nastavení
Label
vzhledu najdete v průvodci Xamarin.Forms popiskem .
Zobrazení formátovaného textu
V souboru MainPage.xaml můžete upravit deklaraci objektu
Label
tak, aby bylo možné zobrazit text používající více formátů v jediném objektuLabel
.<Label TextColor="Gray" FontSize="Medium"> <Label.FormattedText> <FormattedString> <Span Text="This sentence contains " /> <Span Text="words that are emphasized, " FontAttributes="Italic" /> <Span Text="and underlined." TextDecorations="Underline" /> </FormattedString> </Label.FormattedText> </Label>
Tento kód zobrazí v jediném objektu
Label
text, který používá více formátů. Text v prvním elementuSpan
se zobrazí pomocí formátování nastaveného pro objektLabel
, zatímco text ve druhé a třetí instanci elementuSpan
se zobrazí pomocí formátování nastaveného pro objektLabel
a dalšího formátování nastaveného u jednotlivých elementůSpan
.Poznámka:
Vlastnost
FormattedText
je typuFormattedString
, který obsahuje jednu nebo více instancí elementuSpan
.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. Všimněte si, že vzhled objektu
Label
se změnil:V sadě Visual Studio zastavte aplikaci.
Další informace o nastavení
Span
vzhledu naleznete v části Formátování textu v průvodci Xamarin.Forms popiskem .
Gratulujeme!
Blahopřejeme k dokončení tohoto kurzu, ve kterém jste se naučili provádět tyto akce:
- Vytvořte v XAML.Xamarin.Forms
Label
- Změnit vzhled objektu
Label
- Zobrazit v jediném objektu
Label
text, který má více formátů
Další kroky
Pokud se chcete dozvědět více o základech vytváření mobilních aplikací, Xamarin.Formspokračujte kurzem Button.
Související odkazy
Máte s touto částí nějaké problémy? Pokud ano, dejte nám prosím vědět, abychom tuto část mohli vylepšit.