Fonctions dans x :Bind avec WinUI

Les applications WinUI vous permettent d’utiliser des fonctions comme étape finale du chemin de liaison de données dans l’extension de balisage {x:Bind}. Cette fonctionnalité simplifie la conversion de valeur et permet aux liaisons de dépendre de plusieurs paramètres, ce qui rend votre application plus dynamique et plus efficace.

Dans l’exemple suivant, l’arrière-plan et le premier plan de l’élément sont liés aux fonctions qui effectuent une conversion en fonction du paramètre de couleur.

<DataTemplate x:DataType="local:ColorEntry">
    <Grid Background="{x:Bind local:ColorEntry.Brushify(Color), Mode=OneWay}" Width="240">
        <TextBlock Text="{x:Bind ColorName}" Foreground="{x:Bind TextColor(Color)}" Margin="10,5" />
    </Grid>
</DataTemplate>

public class ColorEntry
{
    public string ColorName { get; set; }
    public Color Color { get; set; }

    public static SolidColorBrush Brushify(Color c)
    {
        return new SolidColorBrush(c);
    }

    public SolidColorBrush TextColor(Color c)
    {
        return new SolidColorBrush(((c.R * 0.299 + c.G * 0.587 + c.B * 0.114) > 150) ? Colors.Black : Colors.White);
    }
}

Utilisation des attributs XAML

<object property="{x:Bind pathToFunction.FunctionName(functionParameter1, functionParameter2, ...), bindingProperties}" ... />

Chemin d’accès à la fonction

Spécifiez le chemin d’accès à la fonction comme d’autres chemins de propriété. Le chemin d’accès peut inclure les points (.), les indexeurs ou les casters pour localiser la fonction.

Utilisez la XMLNamespace:ClassName.MethodName syntaxe pour spécifier des fonctions statiques. Par exemple, utilisez la syntaxe suivante pour établir une liaison à des fonctions statiques dans code-behind.

<Window 
     xmlns:local="using:MyNamespace">
     ...
    <StackPanel>
        <TextBlock x:Name="BigTextBlock" FontSize="20" Text="Big text" />
        <TextBlock FontSize="{x:Bind local:MyHelpers.Half(BigTextBlock.FontSize)}" 
                   Text="Small text" />
    </StackPanel>
</Window>

namespace MyNamespace
{
    static public class MyHelpers
    {
        public static double Half(double value) => value / 2.0;
    }
}

Vous pouvez également utiliser des fonctions système directement dans le balisage pour accomplir des scénarios simples tels que la mise en forme de date, la mise en forme de texte, les concaténations de texte, etc. Par exemple:

<Window 
     xmlns:sys="using:System"
     xmlns:local="using:MyNamespace">
     ...
     <CalendarDatePicker Date="{x:Bind sys:DateTime.Parse(TextBlock1.Text)}" />
     <TextBlock Text="{x:Bind sys:String.Format('{0} is now available in {1}', local:MyPage.personName, local:MyPage.location)}" />
</Window>

Si vous définissez le mode sur OneWay ou TwoWay, le chemin de la fonction prend en charge la détection des modifications. Le moteur de liaison réévalue la liaison si ces objets changent.

La fonction à laquelle vous devez vous lier doit :

• Avoir accès au code et aux métadonnées – ainsi, interne ou privé fonctionne en C#, mais pour C++, les méthodes doivent être publiques WinRT.
• Prise en charge de la surcharge en fonction du nombre d’arguments, et non du type, et tente de mettre en correspondance la première surcharge avec ce grand nombre d’arguments
• Avoir des types d’arguments qui correspondent aux données transmises : le moteur de liaison n’effectue pas de conversions étroites
• Avoir un type de retour qui correspond au type de la propriété qui utilise la liaison de données

Le moteur de liaison réagit aux notifications de modification de propriété déclenchées avec le nom de la fonction et réévalue les liaisons si nécessaire. Par exemple:

<DataTemplate x:DataType="local:Person">
   <StackPanel>
      <TextBlock Text="{x:Bind FullName}" />
      <Image Source="{x:Bind IconToBitmap(Icon, CancellationToken), Mode=OneWay}" />
   </StackPanel>
</DataTemplate>

public class Person : INotifyPropertyChanged
{
    //Implementation for an Icon property and a CancellationToken property with PropertyChanged notifications
    ...

    //IconToBitmap function is essentially a multi binding converter between several options.
    public Uri IconToBitmap (Uri icon, Uri cancellationToken)
    {
        var foo = new Uri(...);        
        if (isCancelled)
        {
            foo = cancellationToken;
        }
        else 
        {
            if (fullName.Contains("Sr"))
            {
               //pass a different Uri back
               foo = new Uri(...);
            }
            else
            {
                foo = icon;
            }
        }
        return foo;
    }

    //Ensure FullName property handles change notification on itself as well as IconToBitmap since the function uses it
    public string FullName
    {
        get { return fullName; }
        set
        {
            fullName = value;
            OnPropertyChanged();
            OnPropertyChanged("IconToBitmap"); 
            //this ensures Image.Source binding re-evaluates when FullName changes in addition to Icon and CancellationToken
        }
    }
}

Arguments de fonction

Spécifiez plusieurs arguments de fonction séparés par des virgules (,).

• Chemin de liaison : utilisez la même syntaxe que si vous liez directement à cet objet.
  • Si vous définissez le mode sur OneWay ou TwoWay, la liaison détecte les modifications et réévalue lorsque l’objet change.
• Chaîne constante placée entre guillemets : incluez des guillemets pour le désigner en tant que chaîne. Utilisez l'accent circonflexe (^) pour échapper les guillemets dans des chaînes de caractères.
• Nombre constant : par exemple, -123.456.
• Boolean : spécifiez « x :True » ou « x :False ».

Liaisons de fonctions bidirectionnelles

Dans un scénario de liaison bidirectionnel, vous devez spécifier une deuxième fonction pour la direction inverse de la liaison. Utilisez la BindBack propriété de liaison pour cette fonction. Dans l’exemple suivant, la fonction prend un argument, qui est la valeur qui doit être renvoyée au modèle.

<TextBlock Text="{x:Bind a.MyFunc(b), BindBack=a.MyFunc2, Mode=TwoWay}" />

Voir aussi

• Extension de balisage {x:Bind}