使用ListBox中的嵌套UserControl自定义UserControl

时间:2014-06-19 12:59:42

标签: c# wpf user-controls listbox

我正在尝试在UserControl中呈现自定义ListBox,但不会呈现任何内容。我遇到了this question and solution这个简单的例子,但我的情况有点不同。我有PersonControlPerson个对象,CoupleControl可以引用两个PersonControl个控件。

我已经在CoupleControl尝试了几件尚无法解决的事情。我评论了其中一种方式:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="1*" />
        <ColumnDefinition Width="1*" />
    </Grid.ColumnDefinitions>

    <Control:PersonControl Grid.Column="0"
                           x:Name="LeftPerson" />
    <Control:PersonControl Grid.Column="1"
                           x:Name="RightPerson" />
    <!-- This is how I'd like to do it in case I create other controls
         I wish to replace the PersonControls (e.g. AnimalControl) -->
    <!--<UserControl Grid.Column="0"
                     x:Name="LeftPerson" />-->
    <!--<UserControl Grid.Column="1"
                     x:Name="RightPerson" />-->
</Grid>

列表框的相关WPF代码段:

<ListBox Grid.Row="1"
         ItemsSource="{Binding Persons}">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <Control:CoupleControl />
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

在代码隐藏中:

public ObservableCollection<CoupleControl> Persons { get; private set; }

Person joe = new Person("Joe", "Smith", Person.SexType.Male);
Person jane = new Person("Jane", "Smith", Person.SexType.Female);

PersonControl joeControl = new PersonControl();
PersonControl janeControl = new PersonControl();
joeControl.DataContext = joe;
janeControl.DataContext = jane;
CoupleControl coupleControl = new CoupleControl();
coupleControl.LeftPerson.DataContext = joe;
coupleControl.RightPerson.DataContext = jane;
//coupleControl.LeftPerson.Content = joeControl;    // Also doesn't work
//coupleControl.RightPerson.Content = janeControl;  // Also doesn't work

Persons.Add(coupleControl);

有人可以帮我将CoupleControl转换为ListBox吗?

1 个答案:

答案 0 :(得分:0)

为了我的口味,你的方法有点代码太重,为什么不在XAML中设置DataContext?

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition />
        <ColumnDefinition />
    </Grid.ColumnDefinitions>

    <Control:PersonControl DataContext="{Binding LeftPerson}" />
    <Control:PersonControl DataContext="{Binding RightPerson}" Grid.Column="1" />
</Grid>

如果不是那么复杂,甚至可能完全放弃UserControls?在这种情况下,使用DataTemplates可以更快更简单。假设我们在Window资源中定义了PersonCouple的模板(Couple只是一个具有LeftPerson和RightPerson属性的类):

<Window.Resources>
    <DataTemplate x:Key="personTemplate" DataType="TestWPF:Person">
            <Border BorderThickness="1" BorderBrush="Green" CornerRadius="5">
                <StackPanel>
                    <TextBlock Text="{Binding FirstName}" />
                    <TextBlock Text="{Binding LastName}" Margin="3,0,0,0" />
                </StackPanel>
            </Border>
        </DataTemplate>

         <DataTemplate x:Key="coupleTemplate" DataType="TestWPF:Couple">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition />
                    <ColumnDefinition />
                </Grid.ColumnDefinitions>

                <ContentControl Content="{Binding LeftPerson}"
                                ContentTemplate="{StaticResource personTemplate}" />
                <ContentControl Content="{Binding RightPerson}" 
                                ContentTemplate="{StaticResource personTemplate}" Grid.Column="1" />
            </Grid>
        </DataTemplate>
</Window.Resources>

然后为ListBox设置ItemTemplate

<ListBox Grid.Row="1" ItemsSource="{Binding Persons}" ItemTemplate="{StaticResource coupleTemplate}" />

通过这种方式,您可以为所需类型创建更多模板,并在ListBox中将它们设置为一行。