WPF: How do I use properties of user controls in my main window?

Question

I made a user control that works and want to use it multiple times in my main window. It has a property Result that is shown in a label. In my main window I have a label that should show the sum of all Results.

This is the user control (it works, just important there's a property Result I want to use):

using System.ComponentModel;
using System.Windows;

namespace WpfApp2
{
    public partial class CardSelectionControl : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;

        public int Level
        {
            get { return (int)GetValue(LevelProperty); }
            set { SetValue(LevelProperty, value); }
        }
        public int SelectedIndex
        {
            get { return (int)GetValue(SelectedIndexProperty); }
            set { SetValue(SelectedIndexProperty, value); }
        }

        public int Result
        {
            get { return (int)GetValue(ResultProperty); }
            set { SetValue(ResultProperty, value); }
        }


        public static readonly DependencyProperty ResultProperty =
            DependencyProperty.Register("Result", typeof(int), typeof(CardSelectionControl), new PropertyMetadata(20));

        public static readonly DependencyProperty LevelProperty =
            DependencyProperty.Register("Level", typeof(int), typeof(CardSelectionControl), new PropertyMetadata(4, new PropertyChangedCallback(OnChanged)));

        public static readonly DependencyProperty SelectedIndexProperty =
            DependencyProperty.Register("SelectedIndex", typeof(int), typeof(CardSelectionControl), new PropertyMetadata(0));

        private static void OnChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            CardSelectionControl control = (CardSelectionControl)d;
            control.Recalculate();
        }

        public void Recalculate()
        {
            //calculates a new value for level
        }



        public CardSelectionControl()
        {
            DataContext = this;
            InitializeComponent();
        }
    }
}

This main window:

<Window x:Class="WpfApp2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp2" xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
        mc:Ignorable="d"
        Title="MainWindow">
    <StackPanel x:Name="panel1">
        <local:CardSelectionControl x:Name="control1" Result="{Binding Costs1}" ></local:CardSelectionControl>
        <local:CardSelectionControl x:Name="control2" Result="{Binding Costs2}" ></local:CardSelectionControl>

        <Label Height="50" Content="{Binding TotalCosts}"></Label>
    </StackPanel>
</Window>

and its code behind:

using System.ComponentModel;
using System.Windows;

namespace WpfApp2
{
    public partial class MainWindow : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;

        public int Costs1
        {
            get { return (int)GetValue(CostsProperty); }
            set { SetValue(CostsProperty, value); }
        }

        public static readonly DependencyProperty CostsProperty =
            DependencyProperty.Register("Costs1", typeof(int), typeof(CardSelectionControl), new PropertyMetadata(0));

        public int Costs2
        {
            get { return (int)GetValue(Costs2Property); }
            set { SetValue(Costs2Property, value); }
        }

        public static readonly DependencyProperty Costs2Property =
            DependencyProperty.Register("Costs2", typeof(int), typeof(CardSelectionControl), new PropertyMetadata(0));



        public int TotalCosts
        {
            get { return (int)GetValue(TotalCostsProperty); }
            set { SetValue(TotalCostsProperty, value); }
        }

        public static readonly DependencyProperty TotalCostsProperty =
            DependencyProperty.Register("TotalCosts", typeof(int), typeof(MainWindow), new PropertyMetadata(0));



        public MainWindow()
        {
            InitializeComponent();
            DataContext = this;
        }
    }
}

How do I bind to Result? Costs1 and Costs2 don't have a value. And how do I combine these bindings and bind them to the label? I thought about creating a method calcTotal() and implement a new PropertyChangedCallback for each Cost Property, is that possible?

`Result="{Binding Costs1}"` does not work because you have set `DataContext = this;` in the UserControl's constructor. Remove that assignment. If there are Bindings in the UserControl's XAML to its own properties, use `RelativeSource={RelativeSource AncestorType=UserControl}` for those Bindings. — Clemens, Jun 06 '22 at 05:37

score 0 · Accepted Answer · answered Jun 05 '22 at 23:16

0

I think you should be using a different binding:

Result="{Binding Costs1, RelativeSource={RelativeSource AncestorType={x:Type Window}}}

or uses x:Name="MainWindow" on the Window element and

Result="{Binding Costs1, ElementName=MainWindow}

answered Jun 05 '22 at 23:16

Wouter

2,540
19
31

WPF: How do I use properties of user controls in my main window?

1 Answers1