Search code examples
.netwpfbindingmultibinding

2 Properties in One Binding?


Can I combine 2 elements in one biding?

<Canvas>
    <Ellipse Fill="Black" x:Name="dot1" Width="16" Height="16" Canvas.Left="124" Canvas.Top="133"/>
    <Ellipse Fill="Black" x:Name="dot2" Width="16" Height="16" Canvas.Left="221" Canvas.Top="40"/>
    <Line Stroke="Black" x:Name="line1" 
          X1="{Binding ElementName=dot1, Path=(Canvas.Left)}" 
          Y1="{Binding ElementName=dot1, Path=(Canvas.Top)}"

          X2="{Binding ElementName=dot2, Path=(Canvas.Left)}" 
          Y2="{Binding ElementName=dot2, Path=(Canvas.Top)}"
          />
</Canvas>

I need not only to bind the Line Start and End Points to the dots Left and Right, but the addition of (Left + Width / 2) and (Top + Height / 2) (centers).

Is that possible?


Solution

  • Yes, use a MultiBinding and implement the formula in a IMultiValueConverter.

    Edit:

    Something like this where only X1 uses the MultiBindingand the rest are unchanged.

    <Canvas>
        <Ellipse Fill="Black" x:Name="dot1" Width="16" Height="16" Canvas.Left="124" Canvas.Top="133"/>
        <Ellipse Fill="Black" x:Name="dot2" Width="16" Height="16" Canvas.Left="221" Canvas.Top="40"/>
        <Line Stroke="Black" x:Name="line1" 
        Y1="{Binding ElementName=dot1, Path=(Canvas.Top)}"
    
        X2="{Binding ElementName=dot2, Path=(Canvas.Left)}" 
        Y2="{Binding ElementName=dot2, Path=(Canvas.Top)}">
            <Line.X1>
                <MultiBinding Converter="{StaticResource myMultiValueConverter}">
                    <Binding Path="(Canvas.Top)"/>
                    <Binding Path="(Canvas.Left)"/>
                </MultiBinding>
            </Line.X1>
        </Line>
    </Canvas>