导航到其他页面IocContainers和MVVM指示灯

Question

我正在用MVVM light制作一个WindowsUniversal10应用程序。

但是现在，如果我单击ShowWeatherPage上的项目，我会导航到ShowWeatherDetailPage以获取有关单击项目的更多详细信息。但是我不知道我怎么能做到这一点。你能帮我做这个吗？

下面你可以找到我的代码。我使用IocContainers，每个页面都有一个viewmodel，只有命令绑定。

public class IocContainer
{
    static IocContainer()
    {
        SimpleIoc.Default.Register<ApplicationViewModel>(false);
        SimpleIoc.Default.Register<ShowWeatherViewModel>(false);
        SimpleIoc.Default.Register<ShowWeatherPage>(false);
        SimpleIoc.Default.Register<ShowWeatherDetailPage>(false);
        SimpleIoc.Default.Register<ShowWeatherDetailViewModel>(false);
    }

    public static ShowWeatherPage ShowWeatherPage
    {
        get { return SimpleIoc.Default.GetInstance<ShowWeatherPage>(); }
    }

    public static ShowWeatherViewModel ShowWeatherViewModel
    {
        get { return SimpleIoc.Default.GetInstance<ShowWeatherViewModel>(); }
    }

    public static ApplicationViewModel ApplicationViewModel
    {
        get { return SimpleIoc.Default.GetInstance<ApplicationViewModel>(); }
    }

    public static ShowWeatherDetailPage ShowWeatherDetailPage
    {
        get { return SimpleIoc.Default.GetInstance<ShowWeatherDetailPage>(); }
    }

    public static ShowWeatherDetailViewModel ShowWeatherDetailViewModel
    {
        get { return SimpleIoc.Default.GetInstance<ShowWeatherDetailViewModel>(); }
    }
}


  
  
ApplicationViewModel
public class ApplicationViewModel: ViewModelBaseClass
{
    private Page _currentPage = IocContainer.ShowWeatherPage;

    public Page CurrentPage
    {
        get
        {
            return _currentPage;
        }
        set
        {
            if (_currentPage != value)
            {
                _currentPage = value;
                OnPropertyChanged();
            }
        }
    }

    public void Navigate(Page page, object attribs)
    {
        CurrentPage = page;
    }
}


  
  
ShowWeatherViewModel
public class ShowWeatherViewModel: ViewModelBaseClass
{
    #region variables

    private Item _selectedVillage = null;

    #endregion variables

    #region properties

    public Item SelectedVillage
    {
        get
        {
            return _selectedVillage;
        }
        set
        {
            if (_selectedVillage != value)
            {
                _selectedVillage = value;
                ShowDetailPage();
            }
        }
    }

    #endregion properties

    #region constructor

    public ShowWeatherViewModel()
    { }

    #endregion constructor

    #region methodes

    private void ShowDetailPage()
    {
        ApplicationViewModel appVm = new ApplicationViewModel();
        appVm.Navigate(IocContainer.ShowWeatherPage, SelectedVillage);
    }

    #endregion methodes
}


  
  
ShowWeatherDetailViewModel
public class ShowWeatherDetailViewModel: ViewModelBaseClass
{ }


  
  
ViewModelBaseClass
public class ViewModelBaseClass: INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;

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


  
  
Pages
MainPage
<Page
    x:Class="BALaboVoorbeeld.UWP.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:BALaboVoorbeeld.UWP"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    DataContext="{Binding Source={StaticResource ioc}, Path=ApplicationViewModel}"
    mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Page Content="{Binding CurrentPage, Mode=TwoWay}" />
    </Grid>
</Page>


  
  
ShowWeatherPage
<Page
    x:Class="BALaboVoorbeeld.UWP.Pages.ShowWeatherPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:BALaboVoorbeeld.UWP.Pages"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    DataContext="{Binding Source={StaticResource ioc}, Path=ShowWeatherViewModel}"
    mc:Ignorable="d" Width="450">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="100" />
            <ColumnDefinition Width="240" />
            <ColumnDefinition Width="60" />
            <ColumnDefinition Width="1*" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="1" />
            <RowDefinition Height="40" />
            <RowDefinition Height="1*" />
            <RowDefinition Height="40" />
        </Grid.RowDefinitions>
        <TextBlock Text="Village:" 
                   HorizontalAlignment="Right" Margin="4" VerticalAlignment="Center"
                   Grid.Row="1" Grid.Column="0" />
        
        <Button  HorizontalAlignment="Stretch" Margin="4" VerticalAlignment="Center"
                 Grid.Row="1" Grid.Column="2" Command="{Binding ShowWeahter}" >
            <SymbolIcon Symbol="Find" />
        </Button>
        <ListBox Grid.Row="2" Grid.Column="0"  Grid.ColumnSpan="3"
                 ItemContainerStyle="{StaticResource lstidflt}" 
                 SelectedItem="{Binding SelectedVillage, Mode=TwoWay}"
                 ItemTemplate="{StaticResource weatheritemdt}"
                 ItemsSource="{Binding VillageList}" />
    </Grid>
</Page>


  
  
ShowWeatherDetailPage
<Page
    x:Class="BALaboVoorbeeld.UWP.Pages.ShowWeatherDetailPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:BALaboVoorbeeld.UWP.Pages"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <TextBlock Text="Yes we did it ☻"/>
    </Grid>
</Page>

Answer 1

您可以使用MVVM Light的导航服务导航到另一个视图。

http://www.mvvmlight.net/doc/nav1.cshtml

https://marcominerva.wordpress.com/2014/10/10/navigationservice-in-mvvm-light-v5/