第一次在 XAML 开发，无法进行聊天

Question

我第一次在 XAML 中编写应用程序，我从不同的来源学习并尝试制作一个应用程序。现在我正在努力制作一个好看的聊天，但是运行遇到一个我根本无法解决的错误。

主窗口中出现错误的部分：

<chat:ChatViewModel/>

这将调用创建聊天的用户控件 CharViewModel。这是此用户控件的 XAML 部分：

<UserControl.Resources>
    <DataTemplate DataType="{x:Type local:IncomingMessage}">
        <Grid >
            <Border Background="Orange" CornerRadius="15 15 0 15" Margin="10 12">
                <TextBlock Margin="15" TextWrapping="Wrap" Foreground="CadetBlue" Text="{Binding MessageContent}"/>
            </Border>
            <TextBlock Text="Thu 5:45PM" HorizontalAlignment="Left" VerticalAlignment="Bottom" FontSize="10" Margin="10 0"/>
        </Grid>
    </DataTemplate>

    <DataTemplate DataType="{x:Type local:OutgoingMessage}">
        <Grid >
            <Border Background="Gray" CornerRadius="15 15 0 15" Margin="10 12">
                <TextBlock Margin="15" TextWrapping="Wrap" Foreground="CadetBlue" Text="{Binding MessageContent}"/>
            </Border>
            <TextBlock Text="Thu 5:45PM" HorizontalAlignment="Right" VerticalAlignment="Bottom" FontSize="10" Margin="10 0"/>
        </Grid>
    </DataTemplate>
</UserControl.Resources>

<UserControl.DataContext>
    <local:MessageList/>
</UserControl.DataContext>

<Grid>
    <ItemsControl ItemsSource="{Binding Messages}"/>
</Grid>

这是 C# 代码：

public partial class ChatViewModel : UserControl
{
    public ChatViewModel()
    {
        InitializeComponent();
    }
}

这是我的消息列表的样子：

class MessageList : ViewModelBase
{
    public MessageList()
    {
        Messages = new ObservableCollection<Message>();
    }
    public ObservableCollection<Message> Messages { get; set; }
}

最后，这是 MainWindow.cs 中用于从文本文件创建消息列表的代码。每条消息的格式为“David/Hi 你好吗？”在文本文件中：

var ListMessage = new MessageList();
using (StreamReader file = new StreamReader("../Utilisateur/Chat.txt"))
{
    string text;
    while ((text = file.ReadLine()) != null)
    {
        string[] list = text.Split('/');
        if (list[0] == "David")
        {
            ListMessage.Messages.Add(new OutgoingMessage { MessageContent = list[1] });
        }
        else
        {
            ListMessage.Messages.Add(new IncomingMessage { MessageContent = list[1] });
        }
                    
    }
}

消息 class 如下所示：

public class Message : ViewModelBase
{
    ///Sender Name
    public string SenderName { get; set; }

    ///Text of the message
    private string _messageContent;
    public string MessageContent
    {
        get
        {
            return _messageContent;
        }
        set
        {
            _messageContent = value;
            OnPropertyChanged("MessageContent");
        }
    }

    ///True if message has been read
    public bool MessageRead;
    
    ///Time the message was sent
    public DateTimeOffset MessageSentTime { get; set; }
}

还有我从网上复制的ViewModelBase，因为我不完全明白它是如何工作的

public class ViewModelBase : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;

    protected void OnPropertyChanged([CallerMemberName] string propName = null)
    {
        var handler = PropertyChanged;
        if (handler != null)
        {
            handler(this, new PropertyChangedEventArgs(propName));
        }
    }
}

这里我有一个文本文件，每一行代表一条消息，格式为“NameOfTheTender/Message”。

然后我想将消息显示为小气泡，o运行ge 和 window 的左侧，如果我收到消息，灰色和右侧，如果我发送它。目前 window 上没有显示任何内容。 How the window looks like right now

Answer 1

UserControl 的 DataContext 中的

<local:MessageList/> 和 Window 后面的代码中的 new MessageList() 创建了两个不同的 MessageList 实例。向其中一个添加项目对另一个没有影响。

您的 UserControl 不应设置自己的 DataContext。从 UserControl 的 XAML:

中删除此 DataContent 分配

<UserControl.DataContext>
    <local:MessageList/>
</UserControl.DataContext>

为了使 UserControl 绑定到在 MainWindow 中创建的 MessageList 实例，只需将其分配给 Window 的 DataContext：

var ListMessage = new MessageList();
DataContext = ListMessages;

DataContext 属性的值现在将由 UserControl 继承。

第一次在 XAML 开发，无法进行聊天

First time developing in XAML, cannot make my chat work

c#

wpf

xaml

chat