WPF Chatbox控件

时间:2016-03-22 21:38:52

标签: c# wpf textbox wpf-controls chat

目前我正在使用聊天客户端,并将我的客户端从Windows窗体(因为表格很糟糕)更改为WPF。我不确定哪个控件可用于实现聊天框。我可以使用TextBox,但是当它已满时,它不会显示完整的内容。我也尝试使用ListBox,但是当我尝试添加项目时,它们不会显示。我使用此代码向其添加内容:

internal void AddMessage(string message)
{
    listBox_messages.Items.Add(message);
    listBox_messages.Items.Refresh();
}

有人知道哪种控制最适合此目的吗?

感谢您的帮助!

编辑: 我为此实现了一个TextBox并将其禁用。但是我没有显示我通过这种方法附加的文本。 我的班级:

using System.ComponentModel;
using System.Windows;

namespace Chat_Client
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        /// <summary>
        /// MainWindow constructor
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            textBox_messages.AppendText("Test" + "\n");
            textBox_messages.AppendText("Test" + "\n");
            textBox_messages.AppendText("Test" + "\n");

            Closing += OnWindowClosing;
        }

        private void OnWindowClosing(object sender, CancelEventArgs e)
        {
            Program.Shutdown();
        }

        private void button_connect_Click(object sender, RoutedEventArgs e)
        {
            if(Program.Connected)
            {
                Program.Disconnect();
            }
            else
            {
                Program.Connect();
            }            
        }

        private void button_sendMessage_Click(object sender, RoutedEventArgs e)
        {

        }

        internal void AddMessage(string message)
        {
            textBox_messages.AppendText(message + "\n");
        }
    }
}

显示测试字符串,但AddMessage方法添加的文本不是。我可以验证该方法是否被调用,我只是在此方法中使用断点检查它。任何人都知道如何发生这种情况?

3 个答案:

答案 0 :(得分:3)

<强>更新

如果Program类从UI线程以外的另一个线程调用AddMessage(string),则必须使用Dispatcher来更新UI。

Application.Current.Dispatcher.BeginInvoke(new Action(() =>
{
    mainWindow.AddMessage(message);
}));

MVVM是使用WPF的方法。

  1. 将您的消息添加到ViewModel类中的ObservableCollection(ChatViewModel.cs):
  2. public class ChatViewModel
    {
        public ObservableCollection<string> Messages { get; } = new ObservableCollection<string>();
    
        internal void AddMessage(string message)
        {
            Messages.Add(message);
        }
    }
    
    1. 将此ViewModel设置为View(ChatView.xaml)
    2. 的DataContext
      public ChatView : UserControl
      {
          public ChatView()
          {
              InitializeComponent();
              DataContext = new ChatViewModel();
          }
      }
      
      1. 在XAML-Code中,将ObservableCollection绑定到ItemsSourceListBox属性:
      2. <ListBox ItemsSource="{Binding Messages}") />
        

        当您向Messages集合添加消息时,它应该出现在ListBox中。这不是一个完整的例子,但它应该引导你走向正确的方向。

答案 1 :(得分:2)

*响应您的编辑:您从哪里调用AddMessage()?我尝试了你的代码并调用了AddMessage(“foo”);从按钮点击事件和工作正常。

对于聊天框,我会使用TextBox编写聊天消息,并使用ScrollViewer将其包装起来进行滚动。在TextBox上使用AppendText()编写消息后,可以调用ScrollToEnd()滚动到TextBox的底部。

在XAML中:

<ScrollViewer x:Name="ScrollViewer" ScrollChanged="ScrollViewer_OnScrollChanged"> <TextBox x:Name="ChatBox"/> </ScrollViewer>

在背后的代码中:

    private void WriteToChat(string message)
    {
        ChatBox.AppendText(message);
        ChatBox.ScrollToEnd();
    }

    private bool _autoScroll = true;
    private void ScrollViewer_OnScrollChanged(object sender, ScrollChangedEventArgs e)
    {
        if (e.ExtentHeightChange == 0)
        {
            _autoScroll = ScrollViewer.VerticalOffset == ScrollViewer.ScrollableHeight;
        }

        if (_autoScroll && e.ExtentHeightChange != 0)
        {
            ScrollViewer.ScrollToVerticalOffset(ScrollViewer.ExtentHeight);
        }
    }

答案 2 :(得分:0)

您可以使用TextBox并在Xaml文件中将VerticalAlignment设置为Stretch。

&LT; TextBox x:Name =“textbox”VerticalAlignment =“Stretch”&gt;