[.net] RelativeSource와 함께 WPF 바인딩을 어떻게 사용합니까?

Bechir Bejaoui는 그의 기사 에서 WPF의 RelativeSources 사용 사례를 공개합니다 .

RelativeSource는 특정 객체의 속성을 객체 자체의 다른 속성에 바인딩하려고 할 때, 특정 객체의 속성을 상대 부모 중 하나에 바인딩하려고 할 때 특히 바인딩 케이스에 사용되는 태그 확장입니다. 사용자 지정 컨트롤 개발 및 일련의 바운드 데이터 차등을 사용하는 경우 종속성 속성 값을 XAML에 바인딩 할 때 이러한 모든 상황은 상대 소스 모드로 표시됩니다. 모든 사례를 하나씩 공개하겠습니다.

1. 모드 자체 :

높이가 항상 너비와 같기를 원하는 사각형 인이 경우를 상상해보십시오. 우리는 요소 이름을 사용 하여이 작업을 수행 할 수 있습니다

<Rectangle Fill="Red" Name="rectangle"
                Height="100" Stroke="Black"
                Canvas.Top="100" Canvas.Left="100"
                Width="{Binding ElementName=rectangle,
                Path=Height}"/>

그러나이 경우 바인딩 객체의 이름, 즉 사각형을 표시해야합니다. RelativeSource를 사용하여 동일한 목적에 다르게 도달 할 수 있습니다

<Rectangle Fill="Red" Height="100"
               Stroke="Black"
               Width="{Binding RelativeSource={RelativeSource Self},
               Path=Height}"/>

이 경우 바인딩 객체의 이름을 언급 할 의무가 없으며 높이가 변경 될 때마다 너비는 항상 높이와 같습니다.

너비를 높이의 절반으로 매개 변수화하려면 바인딩 태그 확장에 변환기를 추가하여이 작업을 수행 할 수 있습니다. 다른 경우를 상상해 봅시다.

 <TextBlock Width="{Binding RelativeSource={RelativeSource Self},
               Path=Parent.ActualWidth}"/>

위의 경우는 주어진 요소의 주어진 속성을 직접 부모의 속성 중 하나에 묶는 데 사용됩니다.이 요소에는 Parent라는 속성이 있습니다. 이것은 다른 상대 소스 모드 인 FindAncestor 모드로 연결됩니다.

1. 모드 찾기

이 경우 주어진 요소의 속성은 부모 중 하나 인 Corse에 연결됩니다. 위의 경우와의 주요 차이점은 속성을 연결하는 계층 구조에서 상위 유형과 상위 순위를 결정하는 것은 사용자의 책임입니다. 그건 그렇고이 XAML 조각으로 놀아보십시오.

<Canvas Name="Parent0">
    <Border Name="Parent1"
             Width="{Binding RelativeSource={RelativeSource Self},
             Path=Parent.ActualWidth}"
             Height="{Binding RelativeSource={RelativeSource Self},
             Path=Parent.ActualHeight}">
        <Canvas Name="Parent2">
            <Border Name="Parent3"
            Width="{Binding RelativeSource={RelativeSource Self},
           Path=Parent.ActualWidth}"
           Height="{Binding RelativeSource={RelativeSource Self},
              Path=Parent.ActualHeight}">
               <Canvas Name="Parent4">
               <TextBlock FontSize="16"
               Margin="5" Text="Display the name of the ancestor"/>
               <TextBlock FontSize="16"
                 Margin="50"
            Text="{Binding RelativeSource={RelativeSource
                       FindAncestor,
                       AncestorType={x:Type Border},
                       AncestorLevel=2},Path=Name}"
                       Width="200"/>
                </Canvas>
            </Border>
        </Canvas>
     </Border>
   </Canvas>

위 상황은 일련의 테두리 안에 포함 된 두 개의 TextBlock 요소와 계층 적 부모를 나타내는 캔버스 요소입니다. 두 번째 TextBlock은 상대 소스 수준에서 주어진 부모의 이름을 표시합니다.

따라서 AncestorLevel = 2를 AncestorLevel = 1로 변경하고 어떻게되는지보십시오. 그런 다음 조상의 유형을 AncestorType = Border에서 AncestorType = Canvas로 변경하고 어떻게되는지보십시오.

표시되는 텍스트는 조상 유형 및 레벨에 따라 변경됩니다. 그러면 조상 수준이 조상 유형에 적합하지 않으면 어떻게됩니까? 좋은 질문입니다. 물어 보려고한다는 것을 알고 있습니다. 응답은 예외가 발생하지 않으며 TextBlock 수준에 아무것도 표시되지 않습니다.

1. TemplatedParent

이 모드에서는 지정된 ControlTemplate 속성을 ControlTemplate이 적용된 컨트롤의 속성에 연결할 수 있습니다. 여기에 문제를 잘 이해하려면 다음 예가 있습니다.

<Window.Resources>
<ControlTemplate x:Key="template">
        <Canvas>
            <Canvas.RenderTransform>
                <RotateTransform Angle="20"/>
                </Canvas.RenderTransform>
            <Ellipse Height="100" Width="150"
                 Fill="{Binding
            RelativeSource={RelativeSource TemplatedParent},
            Path=Background}">

              </Ellipse>
            <ContentPresenter Margin="35"
                  Content="{Binding RelativeSource={RelativeSource
                  TemplatedParent},Path=Content}"/>
        </Canvas>
    </ControlTemplate>
</Window.Resources>
    <Canvas Name="Parent0">
    <Button   Margin="50"
              Template="{StaticResource template}" Height="0"
              Canvas.Left="0" Canvas.Top="0" Width="0">
        <TextBlock FontSize="22">Click me</TextBlock>
    </Button>
 </Canvas>

주어진 컨트롤의 속성을 컨트롤 템플릿에 적용하려면 TemplatedParent 모드를 사용할 수 있습니다. 이 태그 확장과 비슷한 것이 있는데, 첫 번째 것의 일종 인 TemplateBinding 인 TemplateBinding이지만, 첫 번째 런타임 직후에 평가되는 TemplatedParent와 대조적으로 컴파일 타임에 TemplateBinding이 평가됩니다. 아래 그림에서 알 수 있듯이 배경과 내용은 단추 내에서 컨트롤 템플릿에 적용됩니다.

답변

  <ControlTemplate>
        <CheckBox IsChecked="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Value, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
 </ControlTemplate>

<CheckBox ...... CommandParameter="{Binding RelativeSource={RelativeSource Self},Path=IsChecked}" />

<CheckBox IsChecked="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type iDP:XamDataGrid}}, Path=DataContext.IsHeaderChecked, Mode=TwoWay}" />

RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type iDP:XamDataGrid}}

RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type iDP:XamDataGrid, AncestorLevel=1}}

<Binding RelativeSource="{RelativeSource TemplatedParent}"/>

{Binding RelativeSource={RelativeSource TemplatedParent}}