Tutoriel .NET MAUI – Créez votre première application multiplateforme en C#

Windows macOS

Modifiez votre code

Lorsque vous développez des applications avec .NET MAUI, Rechargement à chaud XAML est disponible lorsque vous déboguez votre application. Cela signifie que vous pouvez modifier l’interface utilisateur XAML pendant que l’application est en cours d’exécution et que l’interface utilisateur est automatiquement mise à jour.

Revenez à Visual Studio et laissez l'application en cours d'exécution. Dans l'Explorateur de solutions, double-cliquez sur le fichier MainPage.xaml sous le projet MyFirstMauiApp. Si vous ne voyez pas le volet Explorateur de solutions, sélectionnez Afficher > Explorateur de solutions dans le menu principal (ou appuyez sur CTRL+ALT+L).

Volet Explorateur de solutions avec le fichier MainPage.xaml en surbrillance.

Retournez au fichier MainPage.xaml dans VS Code et laissez l’application en cours d’exécution.

Volet Explorateur de solutions avec le fichier MainPage.xaml en surbrillance.

Actuellement, le Text du deuxième Label de la ligne 17 est défini pour indiquer Hello, World!, comme indiqué dans le code suivant:

MainPage.xaml
<Label
    Text="Hello, World!" 
    Style="{StaticResource Headline}"
    SemanticProperties.HeadingLevel="Level1"  />

Mettez à jour le texte pour lire Hello, .NET MAUI! :

MainPage.xaml
<Label
    Text="Hello, .NET MAUI!" 
    Style="{StaticResource Headline}"
    SemanticProperties.HeadingLevel="Level1"  />

L'interface utilisateur de l'application se met à jour automatiquement lorsque vous apportez des modifications.

Windows exécutant l'application .NET MAUI. Un

Mac exécutant l'application .NET MAUI. Un

Lors du développement d'applications avec .NET MAUI, vous pouvez également utiliser .NET Rechargement à chaud XAML pour recharger votre code C#. Modifions la logique dans l'application pour incrémenter le décompte de 10 au lieu de 1 lorsque vous cliquez sur le bouton.

Ouvrez MainPage.xaml.cs (ce fichier est imbriqué sous MainPage.xaml, ou vous pouvez cliquer avec le bouton droit et sélectionner Afficher le code dans le menu).

Sélection déroulante pour afficher le code derrière MainPage.xaml

La méthode OnCounterClicked sur ce fichier contient actuellement le code suivant :

MainPage.xaml.cs
private void OnCounterClicked(object sender, EventArgs e)
{
    count++;

    if (count == 1)
        CounterBtn.Text = $"Clicked {count} time";
    else
        CounterBtn.Text = $"Clicked {count} times";

    SemanticScreenReader.Announce(CounterBtn.Text);
}

Mettez à jour lecount++; par incrément de 10 en le modifiant en count += 10;.

MainPage.xaml.cs
private void OnCounterClicked(object sender, EventArgs e)
{
    count += 10;

    if (count == 1)
        CounterBtn.Text = $"Clicked {count} time";
    else
        CounterBtn.Text = $"Clicked {count} times";

    SemanticScreenReader.Announce(CounterBtn.Text);
}

Pour appliquer les modifications apportées au code, enregistrez le fichier et sélectionnez le bouton Rechargement à chaud dans Visual Studio ou sélectionnez ALT+F10.

Sélection déroulante pour afficher le code derrière MainPage.xaml

Sélectionnez le bouton Cliquez-moi et voyez-le augmenter de 10. Bravo ! Vous pouvez fermer l'application en cours d'exécution maintenant.

Compteur mis à jour en incréments de 10

Continuer