Silverlight 4：列表框在其项目缩小时不会缩小

Question

从this question，我将问题深入到一个列表框，当列表框项目缩小时，它不会调整大小。当项目的大小增加时它会相应地调整大小，但当项目的大小减小时它不会缩小。

项目可以增长/缩小，因为项目包含文本框，会随着输入调整大小。

Jeremiah 建议用更多代码开始一个新问题，所以我们开始吧：

我们邪恶的列表框是 UserControl 的一部分，它包含一个带有标签 (Horizo​​ntalAlignment=Center) 的 StackPanel、列表框 (HA=Left) 和一个按钮 (HA=Right)。列表框项数据链接到 ObservableCollection

您会在 ListBox 和 ListBoxItems 上认出漂亮的 BackgroundColors。我用它们来判断项目或列表框本身是否没有缩小。我发现 Items 缩小了，但 Listbox 没有。

好的，这是我的 UserControl 的代码：

<StackPanel VerticalAlignment="Top" HorizontalAlignment="Left">
  <StackPanel.Background>
    <SolidColorBrush Color="{StaticResource ColorBasicDark}"/>
  </StackPanel.Background>

  <sdk:Label x:Name="LabelServiceName" FontSize="{StaticResource FontSizeMedium}" Margin="2" HorizontalAlignment="Center" Content="LabelServiceName">
    <sdk:Label.Foreground>
      <SolidColorBrush Color="{StaticResource ColorBasicLight}"/>
    </sdk:Label.Foreground>
  </sdk:Label>

  <ListBox x:Name="ListBoxCharacteristics" BorderBrush="{x:Null}" Margin="0" HorizontalContentAlignment="Left" FontSize="9.333" HorizontalAlignment="Left">
    <ListBox.Foreground>
      <SolidColorBrush Color="{StaticResource ColorBasicLight}"/>
    </ListBox.Foreground>

    <!-- DataTemplate to display the content -->
    <ListBox.ItemTemplate>
      <DataTemplate>
        <StackPanel x:Name="StackPanelBorder" Orientation="Horizontal" HorizontalAlignment="Left">
          <TextBox x:Name="TextBoxCharacteristicName" Style="{StaticResource InputTextBox}" Text="{Binding Name}" />
          <TextBox x:Name="TextBoxSep" Style="{StaticResource ReadOnlyTextBox}" Text="=" />
          <TextBox x:Name="TextBoxFuncOrValue" Style="{StaticResource InputTextBox}" Text="{Binding Value.Text}" />
          <TextBox x:Name="TextBoxValue" Style="{StaticResource ReadOnlyTextBox}" />
          <Button x:Name="ButtonRemove" Style="{StaticResource BasicButtonStyle}" Content="-" Click="ButtonRemove_Click" />
        </StackPanel>
      </DataTemplate>
    </ListBox.ItemTemplate>

    <ListBox.ItemContainerStyle>
      <Style TargetType="ListBoxItem">
        <Setter Property="HorizontalAlignment" Value="Left" />
        <Setter Property="Background" Value="Yellow" />
      </Style>
    </ListBox.ItemContainerStyle>

    <ListBox.Background>
      <SolidColorBrush Color="Red" />
    </ListBox.Background>
  </ListBox>

  <Button x:Name="ButtonAddCharaDisplayObject" Style="{StaticResource BasicButtonStyle}" Content="+" HorizontalAlignment="Right" Click="ButtonAddCharaDisplayObject_Click" />
</StackPanel>

我不知道为什么当项目的大小缩小时列表框不会缩小，尽管我已将列表框的大小设置为 Auto 并将 Horizo​​ntalAlignment 设置为 Left

提前致谢， 弗兰克

Answer 1

我终于在this post找到了解决方案。问题是，从 Silverlight 3 开始，ListBox 使用 VirtualizationStackPanel 来显示 ListItems。除了 StackPanel，VirtualizationStackPanel 使用它获得的所有空间，并且从不返回。因此，当列表中最大的项目缩小时，ListBox 本身可能会缩小，因为现在有未使用的空间，由于 VirtualizationStackPanel 没有正确缩小，ListBox 的宽度（和高度）仍将保持不变。

要解决这个问题，我们可以强制 ListBox 使用 StackPanel 而不是 VirtualizationStackPanel。请注意，这可能会以性能为代价！

<ListBox HorizontalContentAlignment="Left" FontSize="9.333" HorizontalAlignment="Left"> 

    ... // other listbox related stuff

    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel />
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>

</ListBox> 

Answer 2

嗯...我没有你所有的代码。但是，我将您上面的内容简化为这一点并且它有效。

我希望这能以某种方式帮助您解决问题。再一次，它可能是导致问题的此控件的父级。它也可能是您正在应用的一种风格。尝试从您的控制中删除所有不必存在的东西，然后慢慢添加回来以找到罪魁祸首。

我创建了一个新的 silverlight 应用程序，这实际上是其中唯一的东西。列表框按预期增长和缩小。

XAML：

<UserControl
    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" 
    mc:Ignorable="d"
    x:Class="Test.MainPage">

    <Grid x:Name="LayoutRoot">
        <StackPanel VerticalAlignment="Top" HorizontalAlignment="Left"> 
          <StackPanel.Background> 
            <SolidColorBrush Color="Black"/> 
          </StackPanel.Background> 

          <ListBox x:Name="ListBox" BorderBrush="{x:Null}" Margin="0" HorizontalContentAlignment="Left" FontSize="9.333" HorizontalAlignment="Left"> 
            <ListBox.Foreground> 
              <SolidColorBrush Color="Silver"/> 
            </ListBox.Foreground> 

            <!-- DataTemplate to display the content --> 
            <ListBox.ItemTemplate> 
              <DataTemplate> 
                <StackPanelOrientation="Horizontal" HorizontalAlignment="Left"> 
                  <TextBox FontSize="30" Text="{Binding}" />      
                </StackPanel> 
              </DataTemplate> 
            </ListBox.ItemTemplate> 

            <ListBox.ItemContainerStyle> 
              <Style TargetType="ListBoxItem"> 
                <Setter Property="HorizontalAlignment" Value="Left" /> 
                <Setter Property="Background" Value="Yellow" /> 
              </Style> 
            </ListBox.ItemContainerStyle> 

            <ListBox.Background> 
              <SolidColorBrush Color="Red" /> 
            </ListBox.Background>   

          </ListBox> 

            <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" Height="30">
                <Button Content="Add" Click="Add_Click" Width="100"/>
                <Button Content="Remove" Click="Remove_Click"  Width="100"/> 
            </StackPanel>  
        </StackPanel>       
    </Grid>
</UserControl>

代码背后：

using System;
using System.Windows;
using System.Windows.Controls;

namespace Test
{
    public partial class MainPage : UserControl
    {
        public MainPage()
        {
            // Required to initialize variables
            InitializeComponent();

            Count = 8;
        }

        private int Count;

        private void Add_Click(object sender, System.Windows.RoutedEventArgs e)
        {
            Count = Count * 8;

            ListBox.Items.Add("Hi Mom (" + Count.ToString() + ")");
        }

        private void Remove_Click(object sender, System.Windows.RoutedEventArgs e)
        {
            ListBox.Items.RemoveAt(ListBox.Items.Count-1);
        }
    }
}