ListBox导航页面Windows Phone中的MVVM Light

时间:2013-02-24 23:54:56

标签: c# windows-phone mvvm-light

我正在构建基于位置的服务Windows Phone App,这是我的第一个应用程序。我使用MVVM Light在页面导航方面遇到了困难。我正在关注Jesse Liberty Tutorial,到目前为止,当我在FirstPage中单击ListBox上的项目时,它可以导航到SecondPage。

我想要做的是,用户从ListBox FirstPage中选择ListPickerSecondPage中的SecondPage进行选择。因此,用户可以轻松地从<ListBox x:Name="MainMenu" ItemTemplate="{StaticResource MainMenu}" ItemsSource="{Binding Categories}" Margin="0,97,0,0"> <Custom:Interaction.Triggers> <Custom:EventTrigger EventName="SelectionChanged"> <GalaSoft_MvvmLight_Command:EventToCommand Command="{Binding MainMenuCommand, Mode=OneWay}"/> </Custom:EventTrigger> </Custom:Interaction.Triggers> </ListBox> 更改他们想要搜索的内容。

enter image description here

MainPage.xaml中

public MainPage()
{
    InitializeComponent();

    Messenger.Default.Register<CategoryModel>(this,c => NavigationService.Navigate(new Uri("/Views/VenueList.xaml", UriKind.Relative)));
}

MainPage.xaml.cs中

public MainViewModel()
{
     MainMenuCommand = new RelayCommand<CategoryModel>((msg) => GoToVenueList(msg));
}

public RelayCommand<CategoryModel> MainMenuCommand
{
    get;
    private set;
}

private void GoToVenueList(CategoryModel msg)
{
    Messenger.Default.Send(msg);
}

private CategoryModel _selectedItem;
public CategoryModel SelectedItem
{
    get { return _selectedItem; }
    set
    {
        if (_selectedItem == value)
        {
            return;
        }

        var oldValue = _selectedItem;
        _selectedItem = value;

        RaisePropertyChanged("SelectedItem", oldValue, value, true);
    }
}

MainViewModel.cs

<toolkit:ListPicker Margin="0,153,0,0" Background="{StaticResource PhoneAccentBrush}" VerticalAlignment="Top"
                            SelectedItem="{Binding Item, Mode=TwoWay}"
                            ItemsSource="{Binding Categories}"
                            ItemTemplate="{StaticResource CategorySelector}" FullModeHeader="Category" FullModeItemTemplate="{StaticResource FullCategorySelector}" BorderBrush="{StaticResource PhoneAccentBrush}" />

VenueList.xaml

public VenueListViewModel()
{
    Messenger.Default.Register<PropertyChangedMessage<CategoryModel>>(
        this,
        (action) => Item = action.NewValue
    );
}

private CategoryModel _item;
public CategoryModel Item
{
    get
    {
        return _item;
    }
    set
    {
        if (_item == value)
        {
            return;
        }

        _item = value;

        // Update bindings, no broadcast
        RaisePropertyChanged("Item");
    }
}

希望任何人都可以帮助解决我的问题。

VenueListViewModel

{{1}}

2 个答案:

答案 0 :(得分:1)

这是一个典型的情况,您需要两个ViewModel才能相互通信。

在这种情况下,最好的方法,特别是因为您使用mvvm-light,是使用框架的Messaging功能。

如果你需要一些帮助,你会在网上找到大量的例子和文档(在channel9上查找Laurent Bugnion的网络广播,例如this one),这只是注册一个问题。回调某种类型的消息,然后从其他地方发送消息。

这样,您的第一个视图模型会向您的第二个视图模型发送一条消息,说明已选择了哪个列表项。您的目标viewmodel会更新自身以反映这一点。然后你的初始viewmodel命令导航到目标页面,并且当它使用目标viewmodel时它运行良好。

答案 1 :(得分:0)

有几种可能性,我主要使用列表框的SelectedItem解决方案......但也可以使用纯消息传递。

使用解决方案here on stack overflow

查看类似的问题