Udostępnij za pośrednictwem


Xamarin.Forms Powiązania względne

Powiązania względne umożliwiają ustawienie źródła powiązania względem położenia elementu docelowego powiązania. Są one tworzone przy użyciu RelativeSource rozszerzenia znaczników i ustawiane jako Source właściwość wyrażenia powiązania.

Rozszerzenie RelativeSource znaczników jest obsługiwane przez klasę RelativeSourceExtension , która definiuje następujące właściwości:

  • Mode, typu RelativeBindingSourceMode, opisuje lokalizację źródła powiązania względem położenia elementu docelowego powiązania.
  • AncestorLevel, typu int, opcjonalny poziom przodków do wyszukania, gdy Mode właściwość to FindAncestor. Element pomija AncestorLevelnn-1 wystąpienia klasy .AncestorType
  • AncestorType, typu , typ Typeprzodka do wyszukania, gdy Mode właściwość to FindAncestor.

Uwaga

Analizator XAML umożliwia RelativeSourceExtension skrót klasy jako RelativeSource.

Właściwość Mode powinna być ustawiona na jeden z elementów RelativeBindingSourceMode członkowskich wyliczenia:

  • TemplatedParent wskazuje element, do którego jest stosowany szablon, w którym istnieje powiązany element. Aby uzyskać więcej informacji, zobacz Wiązanie z szablonem elementu nadrzędnego.
  • Self wskazuje element, na którym jest ustawiane powiązanie, co pozwala powiązać jedną właściwość tego elementu z inną właściwością na tym samym elemecie. Aby uzyskać więcej informacji, zobacz Wiązanie z siebie.
  • FindAncestor wskazuje element nadrzędny w drzewie wizualnym powiązanego elementu. Ten tryb powinien służyć do powiązania z kontrolką przodka reprezentowaną AncestorType przez właściwość . Aby uzyskać więcej informacji, zobacz Wiązanie z obiektem nadrzędnym.
  • FindAncestorBindingContextBindingContext wskazuje element przodka w drzewie wizualnym powiązanego elementu. Ten tryb powinien służyć do powiązania z BindingContext obiektem nadrzędnym reprezentowanym AncestorType przez właściwość . Aby uzyskać więcej informacji, zobacz Wiązanie z obiektem nadrzędnym.

Właściwość Mode jest właściwością RelativeSourceExtension content klasy. W związku z tym w przypadku wyrażeń znaczników XAML wyrażonych za pomocą nawiasów klamrowych można wyeliminować Mode= część wyrażenia.

Aby uzyskać więcej informacji na temat Xamarin.Forms rozszerzeń znaczników, zobacz Rozszerzenia znaczników XAML.

Wiązanie z własnym

Tryb Self powiązania względnego jest używany do powiązania właściwości elementu z inną właściwością w tym samym elemecie:

<BoxView Color="Red"
         WidthRequest="200"
         HeightRequest="{Binding Source={RelativeSource Self}, Path=WidthRequest}"
         HorizontalOptions="Center" />

W tym przykładzie właściwość BoxView ustawia jej WidthRequest właściwość na stały rozmiar, a HeightRequest właściwość wiąże się z właściwością WidthRequest . W związku z tym obie właściwości są równe, a więc kwadrat jest rysowany:

Zrzut ekranu przedstawiający powiązanie względne trybu samodzielnego w systemach iOS i Android

Ważne

W przypadku powiązania właściwości elementu z inną właściwością w tym samym elemecie właściwości muszą być tego samego typu. Alternatywnie można określić konwerter powiązania, aby przekonwertować wartość.

Typowym zastosowaniem tego trybu powiązania jest ustawienie obiektu BindingContext na właściwość na siebie. Poniższy kod przedstawia przykład tego:

<ContentPage ...
             BindingContext="{Binding Source={RelativeSource Self}, Path=DefaultViewModel}">
    <StackLayout>
        <ListView ItemsSource="{Binding Employees}">
            ...
        </ListView>
    </StackLayout>
</ContentPage>

W tym przykładzie właściwość BindingContext strony jest ustawiona na DefaultViewModel samą właściwość. Ta właściwość jest definiowana w pliku za pomocą kodu dla strony i udostępnia wystąpienie modelu viewmodel. Powiązanie ListView z właściwością Employees modelu viewmodel.

Wiązanie z obiektem nadrzędnym

FindAncestor Tryby powiązań względnych i FindAncestorBindingContext są używane do powiązania z elementami nadrzędnymi określonego typu w drzewie wizualizacji. Tryb FindAncestor jest używany do powiązania z elementem nadrzędnym, który pochodzi z Element typu. Tryb FindAncestorBindingContext jest używany do powiązania z BindingContext elementem nadrzędnym.

Ostrzeżenie

Właściwość musi być ustawiona AncestorType na Type wartość w przypadku korzystania z FindAncestor trybów powiązania względnego i FindAncestorBindingContext w przeciwnym razie XamlParseException zgłaszana jest wartość .

Mode Jeśli właściwość nie jest jawnie ustawiona, ustawienie AncestorType właściwości na typ, z którego pochodziElement, spowoduje niejawne ustawienie Mode właściwości na FindAncestorwartość . Podobnie ustawienie AncestorType właściwości na typ, który nie pochodzi, Element spowoduje niejawne ustawienie Mode właściwości na FindAncestorBindingContextwartość .

Uwaga

Powiązania względne, które korzystają z FindAncestorBindingContext trybu, zostaną ponownie zastosować po BindingContext zmianie elementu przodków.

Poniższy kod XAML przedstawia przykład, w którym Mode właściwość zostanie niejawnie ustawiona na FindAncestorBindingContextwartość :

<ContentPage ...
             BindingContext="{Binding Source={RelativeSource Self}, Path=DefaultViewModel}">
    <StackLayout>
        <ListView ItemsSource="{Binding Employees}">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <StackLayout Orientation="Horizontal">
                            <Label Text="{Binding Fullname}"
                                   VerticalOptions="Center" />
                            <Button Text="Delete"
                                    Command="{Binding Source={RelativeSource AncestorType={x:Type local:PeopleViewModel}}, Path=DeleteEmployeeCommand}"
                                    CommandParameter="{Binding}"
                                    HorizontalOptions="EndAndExpand" />
                        </StackLayout>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </StackLayout>
</ContentPage>

W tym przykładzie właściwość BindingContext strony jest ustawiona na DefaultViewModel samą właściwość. Ta właściwość jest definiowana w pliku za pomocą kodu dla strony i udostępnia wystąpienie modelu viewmodel. Powiązanie ListView z właściwością Employees modelu viewmodel. Element DataTemplate, który definiuje wygląd każdego elementu w elemencie ListView, zawiera Buttonelement . Właściwość przycisku Command jest powiązana z właściwością DeleteEmployeeCommand w modelu viewmodel elementu nadrzędnego. Naciśnięcie przycisku Button usuwa pracownika:

Zrzut ekranu przedstawiający powiązanie względne trybu FindAncestor w systemach iOS i Android

Ponadto właściwość opcjonalna AncestorLevel może pomóc w uściślaniu wyszukiwania przodków w scenariuszach, w których istnieje prawdopodobnie więcej niż jeden element nadrzędny tego typu w drzewie wizualizacji:

<Label Text="{Binding Source={RelativeSource AncestorType={x:Type Entry}, AncestorLevel=2}, Path=Text}" />

W tym przykładzie Label.Text właściwość wiąże się z Text właściwością drugiego Entry napotkanego na ścieżce w górę, zaczynając od elementu docelowego powiązania.

Uwaga

Właściwość powinna być ustawiona AncestorLevel na 1, aby znaleźć obiekt nadrzędny najbliżej elementu docelowego powiązania.

Wiązanie z szablonowym elementem nadrzędnym

TemplatedParent Tryb powiązania względnego służy do wiązania z szablonu kontrolki z wystąpieniem obiektu środowiska uruchomieniowego, do którego jest stosowany szablon (znany jako szablon nadrzędny). Ten tryb ma zastosowanie tylko wtedy, gdy powiązanie względne znajduje się w szablonie kontrolki i jest podobne do ustawienia elementu TemplateBinding.

Poniższy kod XAML przedstawia przykład TemplatedParent trybu powiązania względnego:

<ContentPage ...>
    <ContentPage.Resources>
        <ControlTemplate x:Key="CardViewControlTemplate">
            <Frame BindingContext="{Binding Source={RelativeSource TemplatedParent}}"
                   BackgroundColor="{Binding CardColor}"
                   BorderColor="{Binding BorderColor}"
                   ...>
                <Grid>
                    ...
                    <Label Text="{Binding CardTitle}"
                           ... />
                    <BoxView BackgroundColor="{Binding BorderColor}"
                             ... />
                    <Label Text="{Binding CardDescription}"
                           ... />
                </Grid>
            </Frame>
        </ControlTemplate>
    </ContentPage.Resources>
    <StackLayout>        
        <controls:CardView BorderColor="DarkGray"
                           CardTitle="John Doe"
                           CardDescription="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla elit dolor, convallis non interdum."
                           IconBackgroundColor="SlateGray"
                           IconImageSource="user.png"
                           ControlTemplate="{StaticResource CardViewControlTemplate}" />
        <controls:CardView BorderColor="DarkGray"
                           CardTitle="Jane Doe"
                           CardDescription="Phasellus eu convallis mi. In tempus augue eu dignissim fermentum. Morbi ut lacus vitae eros lacinia."
                           IconBackgroundColor="SlateGray"
                           IconImageSource="user.png"
                           ControlTemplate="{StaticResource CardViewControlTemplate}" />
        <controls:CardView BorderColor="DarkGray"
                           CardTitle="Xamarin Monkey"
                           CardDescription="Aliquam sagittis, odio lacinia fermentum dictum, mi erat scelerisque erat, quis aliquet arcu."
                           IconBackgroundColor="SlateGray"
                           IconImageSource="user.png"
                           ControlTemplate="{StaticResource CardViewControlTemplate}" />
    </StackLayout>
</ContentPage>

W tym przykładzie Frameelement , który jest elementem głównym obiektu ControlTemplate, ma ustawiony BindingContext na wystąpienie obiektu środowiska uruchomieniowego, do którego zastosowano szablon. W związku z tym element Frame i jego elementy podrzędne rozpoznają swoje wyrażenia powiązania względem właściwości każdego CardView obiektu:

Zrzut ekranu przedstawiający powiązanie względne trybu SzablondParent w systemach iOS i Android

Aby uzyskać więcej informacji na temat szablonów kontrolek, zobacz Xamarin.Forms Szablony kontrolek.