如何為Windows Phone 8消息傳遞應用程序綁定ViewModel

Question

 My model:

 public class MyMessageModel
  {
    public string DisplaySender { get; set; }
   //how does the below observable collection needs to be changed ,
   //if I want to add another field to itemssource template.
   //e.g. public DateTime Timestamp { get; set; }
    public ObservableCollection<string> MessagesExchanged { get; set; }
    public string NewMessage { get; set; }
  }

Chat.xaml:

<TextBlock  Name="lblFromUserName" Text="{Binding DisplaySender ,Mode=TwoWay}" Height="65" Style="{StaticResource PhoneTextNormalStyle}" FontSize="35"/>

<ItemsControl ItemsSource="{Binding Path=MessagesExchanged}">
   <ItemsControl.ItemTemplate>
    <DataTemplate>

           <TextBlock Text="{Binding ????,Mode=TwoWay}" />
           <TextBlock Text="{Binding Path=Timestamp}" HorizontalAlignment="Right" VerticalAlignment="Bottom"   Grid.Row="1"/>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
<ItemsControl
<StackPanel Orientation="Horizontal" Grid.Row="1">
            <TextBox Grid.Column="0" Name="txtNewMessage" Text="{Binding NewMessage,Mode=TwoWay}" Margin="0,0,0,0" Width="350"/>
            <Button  Grid.Column="1" Command="{Binding SendClickCommand,Mode=TwoWay}"        Name="btnSend" Content="Send"  Width="100" />

</StackPanel>

Chat.xaml.cs如下所示：

 public class Chat: PhoneApplicationPage
{


    private MyMessageViewModel _MyMessageViewModel;

    public Conversation()
    {
        InitializeComponent();
        _MyMessageViewModel = new MyMessageViewModel();
        this.DataContext = _MyMessageViewModel;
    }

}

我的ViewModel MyMessageViewModel如下所示：

public System.Windows.Input.ICommand SendClickCommand
    {
        get
        {
            return new DelegateCommand((o) =>
            {

                Task.Factory.StartNew(() =>
                {
                    //loop through the selected items and clear everything
                    Deployment.Current.Dispatcher.BeginInvoke(() =>
                       {
                           try
                           {
                              //DO YOUR WORK HERE: TAKE THE NEW MESSAGE AND APPEND IT TO THE MESSAGES EXCHANGED
                           }
                           catch (Exception)
                           {

                               throw;
                           }



                       });
                });
            });
        }
    }

現在，當用戶在上面稱為Chat.xaml的視圖中時（用戶將從主頁訪問此頁面），我想在其頂部加載DisplaySender值，該值將在整個對話過程中固定。作為主頁的導航參數。

而且，每次用戶單擊“發送”按鈕時，SendClickCommand中的添加僅通過從txtNewMessage字段添加新消息來更新MessagesExchanged集合，然后再清除此字段。

我在這里有兩個問題：

當用戶首次訪問Chat.xaml時，如何綁定三個字段的數據，例如DisplaySender（非空值將作為導航參數傳遞），MessagesExchanged（最初啟動新對話時為空，否則它將具有導航參數中的一個非空值）和NewMessage（最初，該值始終為空）。

其次，在SendClickCommand通知的屬性中，我如何從txtNewMessage中獲取文本並更新ObservableCollection MessagesExchanged，最后清除txtNewMessage的值。以及如何將MessagesExchanged的值綁定到datatemplate textblock字段？

Answer 1

我猜您正在嘗試從HomePage導航到ChatPage時傳遞MyMessageModel類的對象。

所以定義一個屬性

private MyMessageModel currentMessageModel;

public MyMessageModel CurrentMessageModel
{
    get { return currentMessageModel; }
    set { currentMessageModel = value; }
}

並在ChatPage的OnNavigatedTo方法中設置

  CurrentMessageModel=PassedObjectOfMessageModel

XAML：

<TextBlock  Name="lblFromUserName" Text="{Binding CurrentMessageModel.DisplaySender ,Mode=TwoWay}" Height="65" Style="{StaticResource PhoneTextNormalStyle}" FontSize="35"/>
<ItemsControl ItemsSource="{Binding Path=CurrentMessageModel.MessagesExchanged}">
   //No need for data template as collection only contains string
<ItemsControl
<StackPanel Orientation="Horizontal" Grid.Row="1">
        <TextBox Grid.Column="0" Name="txtNewMessage" Text="{Binding NewMessage,Mode=TwoWay}" Margin="0,0,0,0" Width="350"/>
        <Button  Grid.Column="1" Command="{Binding SendClickCommand,Mode=TwoWay}"        Name="btnSend" Content="Send"  Width="100" />
</StackPanel>

//C＃

CurrentMessageModel.MessagesExchanged.Add(txtNewMessage.Text);

並且您不需要任何文本塊來顯示ObservableCollection，因為您的集合僅包含字符串，因此只需將ItemsSource設置為集合即可顯示數據。