Liaisons de base
Parcourir l’exempleUne liaison de données d’interface utilisateur d’application multiplateforme .NET (.NET MAUI) lie une paire de propriétés entre deux objets, dont au moins l’un est généralement un objet d’interface utilisateur. Ces deux objets sont appelés la cible et la source :
- La cible est l’objet (et la propriété) sur lequel la liaison de données est définie.
- La source est l’objet (et la propriété) référencé par la liaison de données.
Dans le cas le plus simple, les données circulent de la source vers la cible, ce qui signifie que la valeur de la propriété cible est définie à partir de la valeur de la propriété source. Toutefois, dans certains cas, les données peuvent également circuler de la cible vers la source ou dans les deux sens.
Important
La cible est toujours l’objet sur lequel la liaison de données est définie même si elle fournit des données plutôt que de recevoir des données.
Liaisons avec un contexte de liaison
Considérez l’exemple XAML suivant, dont l’intention est de faire pivoter un Label en manipulant un Slider:
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="DataBindingDemos.BasicCodeBindingPage"
Title="Basic Code Binding">
<StackLayout Padding="10, 0">
<Label x:Name="label"
Text="TEXT"
FontSize="48"
HorizontalOptions="Center"
VerticalOptions="Center" />
<Slider x:Name="slider"
Maximum="360"
VerticalOptions="Center" />
</StackLayout>
</ContentPage>
Sans liaisons de données, vous devez définir l’événement ValueChanged de l’élément Slider sur un gestionnaire d’événements qui accède à la propriété Value de l’élément Slider et définit cette valeur sur la propriété Rotation de l’objet Label. La liaison de données automatise cette tâche, de sorte que le gestionnaire d’événements et le code qu’il contient ne sont plus nécessaires.
Vous pouvez définir une liaison sur une instance de n’importe quelle classe qui dérive de BindableObject et qui inclut les dérivés Element, VisualElement, View et View. La liaison est toujours définie sur l’objet cible. La liaison fait référence à l’objet source. Pour définir la liaison de données, utilisez les deux membres suivants de la classe cible :
- La propriété
BindingContextspécifie l’objet source. - La méthode
SetBindingspécifie la propriété cible et la propriété source.
Dans cet exemple, l’objet Label est la cible de la liaison et l’élément Slider en est la source. Des modifications dans l’élément Slider source affectent la rotation de l’objet Label cible. Les données circulent de la source vers la cible.
La méthode SetBinding définie par BindableObject a un argument de type BindingBase à partir duquel la classe Binding dérive, mais d’autres méthodes SetBinding sont définies par la classe BindableObjectExtensions. Le code-behind pour le code XAML utilise une méthode d’extension plus simple SetBinding de la BindableObjectExtensions classe :
public partial class BasicCodeBindingPage : ContentPage
{
public BasicCodeBindingPage()
{
InitializeComponent();
label.BindingContext = slider;
label.SetBinding(Label.RotationProperty, "Value");
}
}
L’objet Label est la cible de la liaison et constitue donc l’objet sur lequel cette propriété est définie et sur lequel la méthode est appelée. La propriété BindingContext indique la source de la liaison, à savoir l’élément Slider. La méthode SetBinding est appelée sur la cible de la liaison, mais spécifie la propriété cible et la propriété source. La propriété cible est spécifiée en tant qu’objet BindableProperty : Label.RotationProperty. La propriété source est spécifiée en tant que chaîne et indique la propriété Value de l’élément Slider.
Important
La propriété cible doit reposer sur une propriété pouvant être liée. Par conséquent, l’objet cible doit être une instance d’une classe qui dérive de BindableObject. Pour plus d’informations, consultez Propriétés pouvant être liées.
La propriété source est spécifiée sous forme de chaîne. En interne, la réflexion est utilisée pour accéder à la propriété réelle. Dans ce cas particulier, toutefois, la propriété Value repose également sur une propriété pouvant être liée.
Lorsque vous manipulez l’objet Slider, l’objet Label pivote en conséquence :
Vous pouvez également spécifier la liaison de données en XAML :
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="DataBindingDemos.BasicXamlBindingPage"
Title="Basic XAML Binding">
<StackLayout Padding="10, 0">
<Label Text="TEXT"
FontSize="80"
HorizontalOptions="Center"
VerticalOptions="Center"
BindingContext="{x:Reference Name=slider}"
Rotation="{Binding Path=Value}" />
<Slider x:Name="slider"
Maximum="360"
VerticalOptions="Center" />
</StackLayout>
</ContentPage>
Comme dans le code, la liaison de données est définie sur l’objet cible, qui est l’objet Label. Deux extensions de balisage XAML sont utilisées pour définir la liaison de données :
- L’extension de balisage
x:Referenceest nécessaire pour référencer l’objet source, qui est l’objet Slider nomméslider. - L’extension de balisage
Bindinglie la propriétéRotationde l’objet Label à la propriétéValuede l’élément Slider.
Pour plus d’informations sur les extensions de balisage XAML, consultez Consommer des extensions de balisage XAML.
Remarque
La propriété source est spécifiée avec la propriété de l’extension PathBinding de balisage, qui correspond à la Path propriété de la Binding classe.
Les extensions de balisage XAML telles que x:Reference et Binding peuvent avoir des attributs de propriété de contenu définis, ce qui signifie pour des extensions de balisage XAML que le nom de propriété n’a pas besoin d’apparaître. La propriété Name est la propriété de contenu de x:Reference et la propriété Path est la propriété de contenu de Binding, ce qui signifie que vous pouvez les éliminer des expressions :
<Label Text="TEXT"
FontSize="80"
HorizontalOptions="Center"
VerticalOptions="Center"
BindingContext="{x:Reference slider}"
Rotation="{Binding Value}" />
Liaisons sans contexte de liaison
La propriété BindingContext est un composant important des liaisons de données, mais elle n’est pas toujours nécessaire. L’objet source peut à la place être spécifié dans l’appel SetBinding ou l’extension de Binding balisage :
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="DataBindingDemos.AlternativeCodeBindingPage"
Title="Alternative Code Binding">
<StackLayout Padding="10, 0">
<Label x:Name="label"
Text="TEXT"
FontSize="40"
HorizontalOptions="Center"
VerticalOptions="CenterAndExpand" />
<Slider x:Name="slider"
Minimum="-2"
Maximum="2"
VerticalOptions="CenterAndExpand" />
</StackLayout>
</ContentPage>
Dans cet exemple, il Slider est défini pour contrôler la Scale propriété du Label. Pour cette raison, la Slider valeur est définie pour une plage de -2 à 2.
Le fichier code-behind définit la liaison avec la SetBinding méthode, avec le deuxième argument étant un constructeur pour la Binding classe :
public partial class AlternativeCodeBindingPage : ContentPage
{
public AlternativeCodeBindingPage()
{
InitializeComponent();
label.SetBinding(Label.ScaleProperty, new Binding("Value", source: slider));
}
}
Le constructeur Binding possède 6 paramètres, si bien que le paramètre source est spécifié avec un argument nommé. L’argument est l’élément slider.
Remarque
La classe VisualElement définit également les propriétés ScaleX et ScaleY, qui peuvent redimensionner l’élément VisualElement dans les directions horizontale et verticale.
Vous pouvez également spécifier la liaison de données en XAML :
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="DataBindingDemos.AlternativeXamlBindingPage"
Title="Alternative XAML Binding">
<StackLayout Padding="10, 0">
<Label Text="TEXT"
FontSize="40"
HorizontalOptions="Center"
VerticalOptions="Center"
Scale="{Binding Source={x:Reference slider},
Path=Value}" />
<Slider x:Name="slider"
Minimum="-2"
Maximum="2"
VerticalOptions="Center" />
</StackLayout>
</ContentPage>
Dans cet exemple, l’extension de Binding balisage a deux propriétés définies et SourcePath, séparées par une virgule. La propriété Source est définie sur une extension de balisage x:Reference qui possède autrement la même syntaxe que la définition de BindingContext.
La propriété de contenu de l’extension de balisage Binding est Path, mais la partie Path= de l’extension de balisage peut être éliminée seulement s’il s’agit de la première propriété dans l’expression. Pour éliminer la partie Path=, vous devez échanger les deux propriétés :
Scale="{Binding Value, Source={x:Reference slider}}" />
Bien que les extensions de balisage XAML soient généralement délimitées par des accolades, elles peuvent également être exprimées en tant qu’éléments objets :
<Label Text="TEXT"
FontSize="40"
HorizontalOptions="Center"
VerticalOptions="Center">
<Label.Scale>
<Binding Source="{x:Reference slider}"
Path="Value" />
</Label.Scale>
</Label>
Dans cet exemple, les propriétés et Path les Source propriétés sont des attributs XAML standard. Les valeurs apparaissent entre guillemets et les attributs ne sont pas séparés par une virgule. L’extension de balisage x:Reference peut également devenir un élément objet :
<Label Text="TEXT"
FontSize="40"
HorizontalOptions="Center"
VerticalOptions="Center">
<Label.Scale>
<Binding Path="Value">
<Binding.Source>
<x:Reference Name="slider" />
</Binding.Source>
</Binding>
</Label.Scale>
</Label>
Cette syntaxe n’est pas courante, mais elle est parfois nécessaire lorsque des objets complexes sont impliqués.
Les exemples présentés jusqu'à présent définissent la propriété BindingContext et la propriété Source de Binding sur une extension de balisage x:Reference pour référencer une autre vue dans la page. Ces deux propriétés sont de type Object et elles peuvent être définies sur n’importe quel objet incluant des propriétés qui conviennent pour des sources de liaison. Vous pouvez également définir la ou Source la BindingContext propriété sur une x:Static extension de balisage pour référencer la valeur d’une propriété ou d’un champ statique, ou une StaticResource extension de balisage pour référencer un objet stocké dans un dictionnaire de ressources, ou directement à un objet, qui est souvent une instance d’un viewmodel.
Remarque
La propriété BindingContext peut également être définie sur un objet Binding, afin que les propriétés Source et Path de Binding définissent le contexte de liaison.
Héritage de contexte de liaison
Vous pouvez spécifier l’objet source à l’aide de la BindingContext propriété ou de la Source propriété de l’objet Binding . Si les deux sont définis, la propriété Source de Binding est prioritaire sur BindingContext.
Important
La BindingContext valeur de propriété est héritée par le biais de l’arborescence visuelle.
L’exemple XAML suivant illustre l’héritage du contexte de liaison :
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="DataBindingDemos.BindingContextInheritancePage"
Title="BindingContext Inheritance">
<StackLayout Padding="10">
<StackLayout VerticalOptions="Fill"
BindingContext="{x:Reference slider}">
<Label Text="TEXT"
FontSize="80"
HorizontalOptions="Center"
VerticalOptions="End"
Rotation="{Binding Value}" />
<BoxView Color="#800000FF"
WidthRequest="180"
HeightRequest="40"
HorizontalOptions="Center"
VerticalOptions="Start"
Rotation="{Binding Value}" />
</StackLayout>
<Slider x:Name="slider"
Maximum="360" />
</StackLayout>
</ContentPage>
Dans cet exemple, la BindingContext propriété de l’objet StackLayout est définie sur l’objet slider . Ce contexte de liaison est hérité par les deux objets Label et BoxView, qui ont tous les deux leur propriété Rotation définie sur la propriété Value de l’élément Slider :
Commentaires
Bientôt disponible : Tout au long de 2024, nous allons supprimer progressivement GitHub Issues comme mécanisme de commentaires pour le contenu et le remplacer par un nouveau système de commentaires. Pour plus d’informations, consultez https://aka.ms/ContentUserFeedback.
Envoyer et afficher des commentaires pour