将ViewModel添加到移动视图

我正在为移动设备制作一组单独的视图，而不是为手机使用其他自适应UI状态。我可以通过在我的文件夹中添加一个名为DeviceFamily-Mobile的子文件夹并添加一个新的View来实现此目的，该文件夹的名称与我正在重写的名称相同。将ViewModel添加到移动视图

我有以下View将工作，并显示移动设备/模拟器上的“移动”。

<Page x:Class="MyApp.PayeesPage" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:behaviors="using:Template10.Behaviors" 
     xmlns:controls="using:Template10.Controls" 
     xmlns:core="using:Microsoft.Xaml.Interactions.Core" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:interactivity="using:Microsoft.Xaml.Interactivity" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:models="using:MyApp.Models" 
     xmlns:viewModels="using:MyApp.ViewModels" 
     xmlns:views="using:MyApp.Views" 
     mc:Ignorable="d"> 

    <RelativePanel Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
     <TextBlock x:Name="MobileTextBlock" 
        Foreground="{ThemeResource ForegroundColorBrush}" 
        Text="MOBILE" /> 
    </RelativePanel> 
</Page>

但是，如果我尝试设置DataContext让我实际显示一些有用的东西，就像这样：

<Page.DataContext> 
    <viewModels:PayeesPageViewModel x:Name="ViewModel" /> 
</Page.DataContext>

然后我得到一个错误导航至PayeesPage时：

无法投射“Windows.UI.Xaml.Controls.TextBlock”类型的对象以键入“MyApp.ViewModels.PayeesPageViewModel”。

这与我在原始PayeesPage上设置DataContext的方法相同，它工作正常。有没有其他方法可以在这些替代View上设置DataContext，还是我错过了什么？

来源

2016-07-05 dub stylee

事实证明，移动电话View需要与原始Page具有相同的x:Class。 ReSharper在我试图将其称为MyApp.Views.PayeesPage时抱怨，因为它已经存在，所以我将其更改为MyApp.PayeesPage。但是，当我将它切换回来以便两者都使用相同的x:Class时，一切都按预期开始工作。

不幸的是，我从ReSharper那里得到了一堆红色的涟漪，但事情正如他们应该的那样工作。万一有人遇到这个问题在未来：

查看/ PayeesPage.xaml：

<Page x:Class="MyApp.Views.PayeesPage" 
...>

查看/ DeviceFamily，移动/ PayeesPage.xaml：

<Page x:Class="MyApp.Views.PayeesPage" 
...>

来源

2016-07-05 18:54:23

THX为了分享您的解决方案，有很多关于DeviceFamily-Type文件夹的文章，例如http://igrali.com/2015/08/02/three-ways-to-set-specific-devicefamily-xaml-views-in -uwp/ –

这是一个冰文章 - 我得到了很多我的信息。我的问题是，我发现的任何信息都没有指出需要共享相同'x：Class'的视图，因此在这种情况下，来自ReSharper的红色波浪曲线有点误导。 –

将ViewModel添加到移动视图

回答

相关问题