Silverlight 聊天 WrapPanel 崩溃/错误

Question

我的任务是为两个人创建一个简单的 Silverlight 聊天框。我的控件必须遵守以下要求

1. 可滚动
2. 文本如果太长则必须换行
3. 当添加新项目/消息时，它必须将该项目滚动到视图中

现在我已经成功制作了一个用户控件来满足这些要求，但我遇到了一个可能的错误/崩溃，我一生都无法修复。我正在寻找修复该错误的方法，或者寻找创建可滚动聊天控件的不同方法。

这是我一直在使用的代码。我们将从聊天窗口的 XAML 开始。

<ListBox x:Name="lbChatHistory" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2" ScrollViewer.VerticalScrollBarVisibility="Visible" ScrollViewer.HorizontalScrollBarVisibility="Disabled" >
    <ListBox.ItemTemplate>
    <DataTemplate>
        <Grid Background="Beige">
        <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="70"></ColumnDefinition>
        <ColumnDefinition Width="Auto"></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <TextBlock x:Name="lblPlayer" Foreground="{Binding ForeColor}"  Text="{Binding Player}" Grid.Column="0"></TextBlock>
        <ContentPresenter Grid.Column="1" Width="200" Content="{Binding Message}" />
    </Grid>
    </DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

想法是将新项目添加到列表框。该项目（如 XAML 中的布局）是一个简单的 2 列网格。一列用于用户名，一列用于消息。

现在，我添加到列表框的“项目”是一个自定义类。它具有三个属性（Player、ForeColor 和 Message），我在 XAML 中使用它们进行绑定

Player 是要显示的当前用户的字符串。

ForeColor 只是前景色首选项。它有助于区分消息之间的差异。

Message 是一个WrapPanel。我以编程方式在每个单词的空白处中断提供的字符串。然后，对于每个单词，我将一个新的 TextBlock 元素添加到 WrapPanel

这是自定义类。

public class ChatMessage :DependencyObject, INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;

    public static DependencyProperty PlayerProperty = DependencyProperty.Register( "Player", typeof( string ), typeof( ChatMessage ),
                                                                                         new PropertyMetadata(
                                                                                            new PropertyChangedCallback( OnPlayerPropertyChanged ) ) );

    public static DependencyProperty MessageProperty = DependencyProperty.Register( "Message", typeof( WrapPanel ), typeof( ChatMessage ),
                                                                                         new PropertyMetadata(
                                                                                            new PropertyChangedCallback( OnMessagePropertyChanged ) ) );

    public static DependencyProperty ForeColorProperty = DependencyProperty.Register( "ForeColor", typeof( SolidColorBrush ), typeof( ChatMessage ),
                                                                                         new PropertyMetadata(
                                                                                            new PropertyChangedCallback( OnForeColorPropertyChanged ) ) );

    private static void OnForeColorPropertyChanged( DependencyObject d, DependencyPropertyChangedEventArgs e )
    {
        ChatMessage c = d as ChatMessage;
        c.ForeColor = ( SolidColorBrush ) e.NewValue;
    }

    public ChatMessage()
    {
        Message = new WrapPanel();
        ForeColor = new SolidColorBrush( Colors.White );
    }

    private static void OnMessagePropertyChanged( DependencyObject d, DependencyPropertyChangedEventArgs e )
    {
        ChatMessage c = d as ChatMessage;
        c.Message = ( WrapPanel ) e.NewValue;
    }

    private static void OnPlayerPropertyChanged( DependencyObject d, DependencyPropertyChangedEventArgs e )
    {
        ChatMessage c = d as ChatMessage;
        c.Player = e.NewValue.ToString();
    }

    public SolidColorBrush ForeColor
    {
        get { return ( SolidColorBrush ) GetValue( ForeColorProperty ); }
        set
        {
            SetValue( ForeColorProperty, value );
            if(PropertyChanged != null)
                PropertyChanged(this, new PropertyChangedEventArgs( "ForeColor" ));
        }
    }

    public string Player
    {
        get { return ( string ) GetValue( PlayerProperty ); }
        set
        {
            SetValue( PlayerProperty, value );
            if ( PropertyChanged != null )
                PropertyChanged( this, new PropertyChangedEventArgs( "Player" ) );
        }
    }

    public WrapPanel Message
    {
        get { return ( WrapPanel ) GetValue( MessageProperty ); }
        set
        {
            SetValue( MessageProperty, value );
            if ( PropertyChanged != null )
                PropertyChanged( this, new PropertyChangedEventArgs( "Message" ) );
        }
    }
}

最后，我将我的项目添加到列表框中。这是简单的方法。它采用上面的 ChatMessage 类作为参数

public void AddChatItem( ChatMessage msg )
    {
        lbChatHistory.Items.Add( msg );
        lbChatHistory.ScrollIntoView( msg );
    }

现在我已经测试了它并且一切正常。我遇到的问题是当我使用滚动条时。您可以使用侧面滚动条或箭头键向下滚动，但向上滚动时 Silverlight 会崩溃。 FireBug 返回一个带有 XamlParseException 的 ManagedRuntimeError #4004。

我已经非常接近让这个控制起作用了，我可以尝到它的味道！有什么想法我应该做什么或改变吗？有没有比我所采取的方法更好的方法？

提前致谢。

更新

我找到了一种使用 ScrollViewer 和 ItemsControl 而不是 ListBox 控件的替代解决方案。大多数情况下它是稳定的。

Answer 1

我找到了使用 ScrollViewer 和 ItemsControl 而不是 ListBox 控件的替代解决方案。大多数情况下它是稳定的。

这是我现在使用的 XAML。

<ScrollViewer x:Name="lbChatHistoryScroller">
                    <ItemsControl x:Name="lbChatHistory" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2" ScrollViewer.VerticalScrollBarVisibility="Visible" ScrollViewer.HorizontalScrollBarVisibility="Disabled">
                        <ItemsControl.ItemTemplate>
                            <DataTemplate>
                                <Grid Background="Beige">
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="70"></ColumnDefinition>
                                        <ColumnDefinition Width="Auto"></ColumnDefinition>
                                    </Grid.ColumnDefinitions>
                                    <TextBlock x:Name="lblPlayer" Foreground="{Binding ForeColor}" Text="{Binding Player}" Grid.Column="0"></TextBlock>
                                    <ContentPresenter Grid.Column="1" Width="1750" Content="{Binding Message}">
                                    </ContentPresenter>
                                </Grid>
                            </DataTemplate>
                        </ItemsControl.ItemTemplate>
                    </ItemsControl>
                </ScrollViewer>