Delen via

Functies in x:Bind met WinUI

Met WinUI-apps is het mogelijk functies te gebruiken als de bladknoop van het pad voor gegevensbinding in de {x:Bind} markeringsextensie. Deze functie vereenvoudigt waardeconversie en maakt bindingen mogelijk afhankelijk van meerdere parameters, waardoor uw app dynamischer en efficiënter wordt.

Aanbeveling

Zie voor algemene informatie over het gebruik van gegevensbinding in uw app met {x:Bind} (en voor een vergelijking tussen {x:Bind} en {Binding}), Gegevensbinding uitgebreid en {x:Bind}-markeringsextensie.

In het volgende voorbeeld zijn de achtergrond en voorgrond van het item gebonden aan functies die conversie uitvoeren op basis van de kleurparameter.

<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);
    }
}

XAML-kenmerkgebruik

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

Pad naar de functie

Geef het pad naar de functie op zoals andere eigenschapspaden. Het pad kan dots (.), indexers of casts bevatten om de functie te lokaliseren.

Gebruik de XMLNamespace:ClassName.MethodName syntaxis om statische functies op te geven. Gebruik bijvoorbeeld de volgende syntaxis om te binden aan statische functies in 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;
    }
}

U kunt systeemfuncties ook rechtstreeks in markeringen gebruiken om eenvoudige scenario's zoals datumopmaak, tekstopmaak, tekstsamenvoegingen en meer uit te voeren. Voorbeeld:

<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>

Als u de modus instelt op OneWay of TwoWay, ondersteunt het functiepad wijzigingsdetectie. De bindingengine evalueert de binding opnieuw als deze objecten veranderen.

De functie waaraan u bent gebonden, moet het volgende doen:

  • Zorg dat code en metadata toegankelijk zijn – interne of privé-elementen werken in C#, maar voor C++ moeten methoden openbare WinRT-methoden zijn.
  • Ondersteunt overbelasting op basis van het aantal argumenten, niet op type. Het probeert de eerste overbelasting te vinden met dat aantal argumenten.
  • Argumenttypen hebben die overeenkomen met de gegevens die worden doorgegeven: de bindingsengine voert geen narrowing conversies uit
  • Een retourtype hebben dat overeenkomt met het type eigenschap dat gebruikmaakt van de binding

De bindingsengine reageert op wijzigingsmeldingen van eigenschappen die worden geactiveerd met de functienaam en evalueert zo nodig bindingen opnieuw. Voorbeeld:

<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
        }
    }
}

Aanbeveling

Gebruik functies in x:Bind om dezelfde scenario's te bereiken als wat werd ondersteund via Converters en MultiBinding in WPF.

Functieargumenten

Geef meerdere functieargumenten op, gescheiden door komma's (,).

  • Bindingspad: gebruik dezelfde syntaxis als als als u rechtstreeks aan dat object was gebonden.
    • Als u de modus instelt op OneWay of TwoWay, detecteert de binding wijzigingen en evalueert deze opnieuw wanneer het object wordt gewijzigd.
  • Constante tekenreeks tussen aanhalingstekens – Neem aanhalingstekens op om deze aan te wijzen als een tekenreeks. Gebruik het dakje (^) om aanhalingstekens in tekenreeksen te maskeren.
  • Constant getal, bijvoorbeeld -123,456.
  • Booleaanse waarde: geef op als 'x:True' of 'x:False'.

Aanbeveling

TargetNullValue is van toepassing op het resultaat van de functieaanroep, niet op afhankelijke argumenten.

Tweerichtingsfunctiebindingen

In een tweerichtingsbindingsscenario moet u een tweede functie opgeven voor de omgekeerde richting van de binding. Gebruik de bindingseigenschap BindBack voor deze functie. In het volgende voorbeeld gebruikt de functie één argument. Dit is de waarde die naar het model moet worden gepusht.

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

Zie ook

  • Last updated on