Navigeren tussen pagina's in een Xamarin-project

Xamarin is een softwareplatform dat wordt gebruikt voor platformonafhankelijke mobiele ontwikkeling. Je kunt het gebruiken om apps te maken op iOS, Android, Windows en meer. U kunt een nieuw Xamarin-project maken met Visual Studio en uw app vullen door inhoud, widgets en andere functionaliteiten toe te voegen.

Wanneer u een nieuwe mobiele app maakt, heeft uw app mogelijk meerdere pagina's nodig. Als dit het geval is, heeft de app ook de vereiste functionaliteit nodig om de gebruikers tussen deze pagina's te laten navigeren.

Een Xamarin-project opzetten

Starten, een nieuw Xamarin-project maken. Wanneer u een nieuwe app maakt, is er een standaard hoofdpagina met de naam Hoofdpagina.xaml opgeslagen in de hoofdprojectmap van Xamarin. De Hoofdpagina.xaml pagina fungeert als uw startscherm wanneer u de toepassing voor het eerst start.

De pagina bevat ook een Hoofdpagina.xaml.cs bestand, waar u uw programmeerlogica kunt schrijven met C#. Andere platforms kunnen andere mobiele ontwikkelingsspeltalen die nuttig voor u kunnen zijn om te leren.

1. Navigeren naar Hoofdpagina.xaml en open het.
2. In de MainPage.xaml bestand, wijzigt u de standaardcode. Vervang de inhoud van de Stapellay-out UI-element met een nieuw label:

   <StackLayout Padding = "50">
   <Labeltekst = "Mijn nieuwe mobiele applicatie"
    Horizontale Opties = "Centrum"
    VerticalOptions = "CenterEnExpand"
    FontAttributes = "Vet, cursief"
    Lettergrootte = "24"
    TekstKleur = "zwart" />
   </StackLayout>
   

3. Klik bovenaan het Visual Studio-venster op de groene afspeelknop om de toepassing in de emulator uit te voeren.
4. Wacht tot het project is gecompileerd voordat de emulator wordt gestart.

Een tweede pagina toevoegen aan het Xamarin-project

Momenteel heeft uw Xamarin-project slechts één pagina. Voeg een nieuwe. toe om een ​​nieuwe pagina te maken xaml bestand en vul het met wat inhoud.

1. Klik in Solution Explorer met de rechtermuisknop op het project. Selecteer Toevoegenen klik op Nieuw item.
2. Selecteer Inhoudsopgave van de Xamarin. Formulieren categorie. Geef het nieuwe bestand een naam SecondPage.xamlen klik op Toevoegen.
3. U ziet de nieuwe pagina verschijnen in de Solution Explorer en zal bestaan ​​uit zowel een xaml bestand en een xaml.cs het dossier. De xaml bestand zal bestaan ​​uit UI-elementen en widgets, en de xaml.cs bestand zal bestaan ​​uit andere codelogica en functionaliteit.
4. Open de SecondPage.xaml bestand, dat al een standaardcode zal bevatten. Binnen de Stapellay-out UI-element, vervang het huidige label door een label met de tekst 'Tweede pagina'.

   <Stapellay-out>
   <Labeltekst="Tweede pagina"
    Lettergrootte="42"
    VerticalOptions="CenterEnExpand"
    HorizontalOptions="CenterEnExpand" />
   </StackLayout>

Navigeren naar de tweede pagina vanaf de hoofdpagina

Om naar de tweede pagina te navigeren, voegt u een knop toe die de app activeert om ernaartoe te navigeren.

1. Open MainPage.xaml.
2. Voeg een knop UI-element toe. Voeg de nieuwe knop toe onder het label.

   <Knop Tekst = "Navigeer naar tweede pagina"
    x: Naam = "Knop1"
    AchtergrondKleur = "#2196F3"
    TekstKleur = "Witte rook"
    HoogteRequest = "50" />

3. Open Hoofdpagina.xaml.csen maak een functie met de naam Navigeren naar(). Gebruik in de functie de Navigatie. PushAsync functie om naar de nieuwe pagina te navigeren. U moet het nieuwe pagina-object als argument toevoegen.

   asynchroneleegte NavigateTo (objectafzender, EventArgs e)
   {
    Navigatie. PushAsync(nieuwe TweedePagina());
   }

4. Ga terug naar MainPage.xaml. Voeg de nieuwe toe Navigeren naar() functie in de Geklikt attribuut. Hierdoor wordt de functie geactiveerd wanneer de gebruiker op de knop drukt.

   <Knop Tekst = "Navigeer naar tweede pagina"
    x: Naam = "Knop1"
    Geklikt = "Navigeren naar"
    AchtergrondKleur = "#2196F3"
    TekstKleur = "Witte rook"
    HoogteRequest = "50" />

5. Klik bovenaan het Visual Studio-venster op de groene afspeelknop om de app te starten met behulp van de emulator.
6. Klik op de knop op de hoofdpagina. U ziet dat de app naar de tweede pagina navigeert.

Mobiele applicaties maken met Xamarin

Xamarin is een open-source tool die je kunt gebruiken om mobiele applicaties te ontwikkelen op iOS, Android, Windows en meer. U kunt een nieuw Xamarin-project maken met Visual Studio, de app vullen en meerdere pagina's toevoegen.

Als u meerdere pagina's wilt toevoegen, maakt u nieuwe inhoudspagina's en vult u deze met inhoud. U kunt ook klikgebeurtenissen of andere gebeurtenissen gebruiken om de app te activeren om naar de nieuwe pagina te navigeren.

Er komt veel kijken bij het bouwen van een mobiele applicatie, dus het is belangrijk dat u de basisprincipes begrijpt wanneer u aan de slag gaat. Ontdek enkele van de geweldige cursussen die beschikbaar zijn om van te leren.