windows phone7mvvm进阶

说明

mvvm中的我们可以将一个实现 ICommand的object绑定到对应的elment来和viewmodel交互，mvvm会帮我们更新页面绑定的数据源；今天我们接着做一个添加好友的功能.

很简单就是获取用户输入并把输入的对象添加到集合中..

1.在viewmodel里添加属性Friend

 private Friend _friend;
/// <summary>
/// 接收输入构造的Friend
/// </summary>
public Friend Friend
{
get
{
return _friend;
}
set
{
if (value == _friend)
{
return;
}
_friend = value;
RaisePropertyChanged("Friend");
}
}

2.在页面添加接受输入控件

3.添加绑定和保存按钮

 <TextBlock Canvas.Left="75" Canvas.Top="20" Height="40" Text="Name" Width="58" />
<TextBox Canvas.Left="145" Canvas.Top="0" Height="60" x:Name="txtName" Text="{Binding Friend.Name, Mode=TwoWay}" Width="250" Padding="1" FontSize="18" IsEnabled="{Binding IsNameEditable}" />
<TextBlock Canvas.Left="62" Canvas.Top="65" Height="30" x:Name="textBlock2" Text="Address" />
<TextBox Canvas.Left="145" Canvas.Top="48" Height="60" x:Name="txtAddress" Text="{Binding Friend.Address, Mode=TwoWay}" Width="250" FontSize="18" />
<TextBlock Canvas.Left="33" Canvas.Top="118" Height="30" x:Name="textBlock3" Text="PhoneNum" />
<TextBox Canvas.Left="145" Canvas.Top="102" Height="62" x:Name="txtPhoneNum" Text="{Binding Friend.PhoneNum, Mode=TwoWay}" Width="250" FontSize="18" />

 <Button Canvas.Left="167" Canvas.Top="163" Content="Save" Height="69" x:Name="save" Width="123" Command="{Binding AddCommand}" />

4.添加保存对应的AddCommand并在ViewModel里添加AddCommand（你知道的）

using System;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Ink;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace HelloWp7.ViewModel
{
public class AddCommand:ICommand
{
private readonly MainViewModel _viewModel;
public AddCommand(MainViewModel viewModel)
{
_viewModel = viewModel;
}
public bool CanExecute(object parameter)
{
return true;
}
public event EventHandler CanExecuteChanged;
public void Execute(object parameter)
{
_viewModel.Add(_viewModel.Friend);
}
}
}

viewmode里添加属性和add方法：

 public ICommand AddCommand
{
get;
private set;
}

 /// <summary>
/// save
/// </summary>
/// <param name="friend"></param>
public void Add(Friend friend)
{
friendService.AddFriend(friend); //添加到集合
this.Friends = new ObservableCollection<Friend>(friendService.GetFriendsSet());
this.Friend = new Friend(); //清空
}

并在viewmode的构造函数里初始化addCommand

 public MainViewModel()
{
//初始化数据
_title = "Friends Book";
_friends = new ObservableCollection<Friend>(friendService.GetFriends());
RefreshCommand = new RefreshCommand(this); //刷新事件
AddCommand = new AddCommand(this);
}

在FriendService里很简单，就是将以好友名称为主键将Friend添加到集合中

using System;
using System.Collections.Generic;
using System.Linq;
namespace HelloWp7.Model
{
public class FriendService
{
public List<Friend> GetFriends()
{
List<Friend> friends = new List<Friend>() {
new Friend(){ Name="Johnny", Address="北京", PhoneNum="13621010899"},
new Friend(){ Name="David", Address="上海", PhoneNum="23621010899"},
new Friend(){ Name="John", Address="天津", PhoneNum="33621010899"},
new Friend(){ Name="Susan", Address="武汉", PhoneNum="43621010899"},
new Friend(){ Name="Badboy", Address="深圳", PhoneNum="53621010899"},
new Friend(){ Name="Jobs", Address="广州", PhoneNum="11621010899"},
new Friend(){ Name="kevin", Address="深圳", PhoneNum="53621010899"}
};
return friends;
}
/// <summary>
/// 静态变量作为数据容器
/// </summary>
private static List<Friend> _friends = new List<Friend>() {
new Friend(){ Name="Jay", Address="台北", PhoneNum="8888888888"}
};
public List<Friend> GetFriendsSet()
{
return _friends;
}
public void AddFriend(Friend friend)
{
bool isHave = false;
int index = 0;
foreach (var item in _friends)
{
if (item.Name == friend.Name)
{
isHave = true;
break;
}
index++;
}
if (isHave)
{
_friends[index] = friend;
}
else
{
_friends.Add(friend);
}
}
}
}

运行时异常，原来没有在viewmodel里初始化Friend原因;

现在运行可以自动添加并更新列表了，效果：

下载 source code