从代码隐藏（C#、WPF）添加时，用户控件无法在 ListBox 中正确显示

Posted 2023-02-19

【中文标题】从代码隐藏（C#、WPF）添加时，用户控件无法在 ListBox 中正确显示

【英文标题】：UserControls aren't displayed properly in ListBox when added from Code-behind (C#, WPF)

【发布时间】：2021-08-27 08:07:19

【问题描述】：

我得到了一个简单的UserControl，它基本上只是一个有 6 列和一堆文本块的网格。

XAML：

<UserControl x:Class="MyApplication.TimeAccountItem"
             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" 
             xmlns:local="clr-namespace:MyApplication"
             mc:Ignorable="d">
    <UserControl.Resources>
        <local:TimeSpanConverter x:Key="TimeSpanConverter"/>
        <Style TargetType="TextBlock">
            <Setter Property="FontSize" Value="14"/>
            <Setter Property="Margin" Value="10,5"/>
            <Setter Property="TextAlignment" Value="Center"/>
        </Style>
    </UserControl.Resources>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="48"/>
            <ColumnDefinition Width="2*"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <TextBlock Grid.Column="0" x:Name="tb_Id" Text="Binding User, FallbackValue=0"/>
        <TextBlock Grid.Column="1" x:Name="tb_Employee" Text="Binding Alias, FallbackValue=Employee"/>
        <TextBlock Grid.Column="2" x:Name="tb_Updated" Text="Binding Updated, StringFormat=dd.MM.yyy, FallbackValue=00.00.0000"/>
        <TextBlock Grid.Column="3" x:Name="tb_Total" Text="Binding Total, Converter=StaticResource TimeSpanConverter, FallbackValue=00:00 h"/>
        <TextBlock Grid.Column="4" x:Name="tb_Claimed" Text="Binding Claimed, Converter=StaticResource TimeSpanConverter, FallbackValue=00:00 h"/>
        <TextBlock Grid.Column="5" x:Name="tb_Remaining" Text="Binding Remaining, Converter=StaticResource TimeSpanConverter, FallbackValue=00:00 h"/>
    </Grid>
</UserControl>

CS：

public partial class TimeAccountItem : UserControl

    public TimeAccount content  get; set; 

    public OvertimeListBoxItem(TimeAccount timeAccount)
    
        content = timeAccount;
        this.DataContext = content;  
    

    public OvertimeListBoxItem()
    
        InitializeComponent();
    

在我的 MainWindow 上，我有一个 ListBox，我想在其中“输出”这些 UserControl。

当我在 XAML 中执行此操作时，一切正常。

<ListBox Height="400" Margin="10,0" HorizontalContentAlignment="Stretch" BorderThickness="0" Name="listbox">
    <local:TimeAccountItem/>
    <local:TimeAccountItem/>
    <local:TimeAccountItem/>
    <local:TimeAccountItem/>
    <local:TimeAccountItem/>
</ListBox>

但不是来自代码隐藏

foreach (TimeAccount ta in timeAccountList)

    listbox.Items.Add(new TimeAccountItem(ta));

我悬停其中一个项目以显示发生了什么。已经给我的 UserControl 一个固定的高度而不是 Auto，但这也没有帮助。

我在这里做错了什么？

提前致谢！

【参考方案1】：

带有 TimeAccount 参数的 UserControl 构造函数缺少 InitializeComponent 调用：

public TimeAccountItem(TimeAccount timeAccount)

    DataContext = timeAccount;  
    InitializeComponent();

---

但是，您根本不应该这样做。

相反，声明一个适当的 ItemTemplate：

<ListBox ...>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <local:TimeAccountItem/>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

然后从 UserControl 中删除显式 DataContext 分配

public partial class TimeAccountItem : UserControl

    public TimeAccountItem()
    
        InitializeComponent();
    

并将数据项集合而不是 UI 元素分配给 ListBox 的 ItemsSource 属性：

listbox.ItemSource = timeAccountList;

【讨论】：

你是对的。我没有调用InitializeComponent，因为我忘记将: this() 添加到参数化构造函数中。但无论如何，你的解决方案是更好的解决方案，非常感谢！