CODEWITHSUNDEEP
c#wpfxaml
Nkn
Nkn

Reputation: 55

How to multibind a parent element property with child usercontrol elements properties

I need to multibind Text property of a text box in my window with text properties of textboxes in child usercontrol.BeloW is the code I tried,but didnt work as expected.

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:uc="clr-namespace:WpfApplication1"
    Title="MainWindow" Height="350" Width="525">
   <Grid>
      <Grid.RowDefinitions>
          <RowDefinition/>
          <RowDefinition/>
      </Grid.RowDefinitions>
      <TextBox Width="150" HorizontalAlignment="Center" 
       VerticalAlignment="Center">
      <TextBox.Text>
            <MultiBinding StringFormat=" {0} {1}}">
                <Binding Path="txtF.Text" RelativeSource="{RelativeSource 
                   Mode=FindAncestor, AncestorType={x:Type UserControl}}"/>
                <Binding Path="txtl.Text"  RelativeSource="{RelativeSource 
                   Mode=FindAncestor, AncestorType={x:Type UserControl}}"/>
            </MultiBinding>
      </TextBox.Text>
    </TextBox>
   <uc:UserControl1 x:Name="SomeUC"  Grid.Row="1" 
       HorizontalAlignment="Center" VerticalAlignment="Top"/>
   </Grid>
 </Window>
 <UserControl x:Class="WpfApplication1.UserControl1"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup- 
         compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300">
 <Grid>
    <StackPanel Orientation="Horizontal">
        <TextBox x:Name="txtF" Width="120" Height="20" Margin="5"/>
        <TextBox  x:Name="txtL" Width="120" Height="20"/>
    </StackPanel>
</Grid>
</UserControl>

Any help will be highly appreciated. Thanks

Upvotes: 1

Views: 158

Answers (1)

Tobias Hoefer
Tobias Hoefer

Reputation: 1128

You cant access txtF and txtL by name because the TextBoxes inside the UserControl are in a different namescope. Check this link for more information on WPF naming scopes.

The easiest way to do it would probably be to add a 'TextCombined' property to your usercontrol, set it when one of the TextBoxes changes its text and bind to it in your window:

Code-Behind of your UserControl:

public partial class UserControl1 : UserControl
{
    public static readonly DependencyProperty TextCombinedProperty =
        DependencyProperty.Register("TextCombined", typeof(string),
            typeof(UserControl1), new PropertyMetadata(String.Empty));

    public string TextCombined
    {
        get { return (string)GetValue(TextCombinedProperty); }
        set { SetValue(TextCombinedProperty, value); }
    }

    public UserControl1()
    {
        InitializeComponent();
        txtF.TextChanged += OnTextFieldTextChanged;
        txtL.TextChanged += OnTextFieldTextChanged;
    }

    private void OnTextFieldTextChanged(object _, TextChangedEventArgs __)
    {
        SetCurrentValue(TextCombinedProperty, $"{txtF.Text} {txtL.Text}");
    }
}

Window XAML:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition/>
        <RowDefinition/>
    </Grid.RowDefinitions>
    <TextBox Width="150" 
             HorizontalAlignment="Center" 
             VerticalAlignment="Center"
             Text="{Binding ElementName=SomeUC, Path=TextCombined}" />

    <local:UserControl1 x:Name="SomeUC"
                        Grid.Row="1" 
                        HorizontalAlignment="Center"
                        VerticalAlignment="Top"/>
</Grid>

The UserControl XAML does not need to be changed. Hope this works for you.

Upvotes: 2

Related Questions