[DataTemplate / UserControl] 데이터 템플릿안에 유저컨트롤 값 바인딩하기

 

데이터템플릿 안의 유저컨트롤에 걍 값을 바인딩하면 오류가 난다.

        
	public string UserName { set; get; }//오류발생
        public UserControl1()
        {
            InitializeComponent();
            //UserName 값을 받아서 유저컨트롤에서 특정행위를 하고싶다.
        }

 

이때는 DependencyProperty 등록을 해주면된다.

 

사용되는 데이터

    public class Person
    {
        public int Age { set; get; }
        public string Name { set; get; }
    }

메인창

아래보면 llistboxPerson 리스트박스에 DataTemplate1 으로 나타내고있다.

DataTemplate1 안에는 또 UserControl1이 있으며 UserName="{Binding Name}" 값을 바인딩하고 있다.

<Window
        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:i="http://schemas.microsoft.com/expression/2010/interactivity" xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions" xmlns:local="clr-namespace:테스트용" mc:Ignorable="d" x:Class="테스트용.MainWindow"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <DataTemplate x:Key="DataTemplate1">
            <Grid Height="85" Width="252">
                <local:UserControl1 HorizontalAlignment="Stretch" Height="Auto" Margin="0,2,0,0" VerticalAlignment="Stretch" Width="Auto" UserName="{Binding Name}"/>                
            </Grid>
        </DataTemplate>
    </Window.Resources>
    <Grid >
        <Grid.Background>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="#FF686868" Offset="0"/>
                <GradientStop Color="#FF606060" Offset="1"/>
            </LinearGradientBrush>
        </Grid.Background>        
        <Grid.RowDefinitions>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <ListBox Margin="12,12,0,118" ItemTemplate="{DynamicResource DataTemplate1}" Name="llistboxPerson" HorizontalAlignment="Left" Width="479" />
    </Grid>
</Window>

데이터템플릿

유저컨트롤의 UserName="{Binding Name}" 이런씩으로 값을 바인딩하고 있다.

    <Window.Resources>
        <DataTemplate x:Key="DataTemplate1">
            <Grid Height="85" Width="252">
                <local:UserControl1 HorizontalAlignment="Stretch" Height="Auto" Margin="0,2,0,0" VerticalAlignment="Stretch" Width="Auto" UserName="{Binding Name}"/>                
            </Grid>
        </DataTemplate>
    </Window.Resources>

 

유저컨트롤

.xaml

    <Grid>
        <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="데이터템플릿의 바인딩값을 유저컨트롤에 넘겨주기" VerticalAlignment="Top" Background="#FF8F8F8F" Width="296" />
        <Label Content="{Binding Path=Name}" Height="36" HorizontalAlignment="Left" Margin="127,22,0,0" Name="label1" VerticalAlignment="Top" Width="157" />
        <Label Content="유저컨트롤바인딩값:" Height="36" HorizontalAlignment="Left" Margin="5,22,0,0" Name="label2" VerticalAlignment="Top" Width="124" />
    </Grid>

.cs

    /// <summary>
    /// UserControl1.xaml에 대한 상호 작용 논리
    /// </summary>
    public partial class UserControl1 : UserControl
    {

        /// <summary>
        /// The dependency property of the ProgressReporter UserControl to display in the GUI
        /// </summary>
        public static DependencyProperty PercentProperty = DependencyProperty.Register("UserName", typeof(string), typeof(UserControl1));
        /// <summary>
        /// The PercentToShow value
        /// </summary>
        public string UserName
        {
            get
            {
                return (string)GetValue(PercentProperty);
            }
            set
            {
                SetValue(PercentProperty, value);
            }
        }

        public UserControl1()
        {
            InitializeComponent();            
        }
    }

추가정보

http://msdn.microsoft.com/query/dev10.query?appId=Dev10IDEF1&l=KO-KR&k=k(SYSTEM.WINDOWS.DEPENDENCYPROPERTY);k(TargetFrameworkMoniker-%22.NETFRAMEWORK%2cVERSION%3dV4.0%22);k(DevLang-CSHARP)&rd=true