windows phone7---mvvm进阶
说明
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原因;
现在运行可以自动添加并更新列表了,效果: