为同一个 ViewModel 绑定两个不同的视图

Question

这看起来类似于 MVVMCross - Bind the same ViewModel to 2 different Views

但在那之后我没有得到答案，我如何才能 select ViewModel 的一个 View 和另一个 ViewModel 的第二个 View。

例如，我想要一个 ViewModel - LoginViewModel 和两个视图：PhoneLoginPage & TabletLoginPage.

根据 Xamarin.Forms.Device.Idiom 的信息，当它是 Phone 我想显示 PhoneLoginPage 但当它是平板电脑时 - TabletLoginPage 但具有相同的 LoginViewModel 与他们绑定。

如何正确实现？意思是，没有任何卑鄙的把戏...

谢谢

Answer 1

注意：我也支持只有一页。

但我将如何处理两个页面：

如果您使用某种导航服务：

只需根据设备的惯用语在应用程序启动时注册不同的页面。

按照：

if(Device.Idiom == TargetIdiom.Tablet)
{
    SomeNavigationService.Register<LoginViewModel, TabletLoginPage>();
}
else
{
    SomeNavigationService.Register<LoginViewModel, PhoneLoginPage>();
}

如果您在页面代码隐藏中进行导航

根据设备的习语选择页面...

if(Device.Idiom == TargetIdiom.Tablet)
{
    await Navigation.PushAsync(new TabletLoginPage(viewModel));
}
else
{
    await Navigation.PushAsync(new PhoneLoginPage(viewModel));
}

Answer 2

使用 MvvmCross 这是不可能的，在运行时，如果我们为同一个 ViewModel 创建两个视图，我们将得到一个异常。

接下来是我的解决方案：

<ProjectFolder>
    => Pages
        => Mobile
            XMobilePage.xaml
            YMobilePage.xaml
        => Tablets
            XTabletPage.xaml
            YTabletPage.xaml
    => PageModels
        => Mobile
            XMobilePageModel.cs
            YMobilePageModel.cs
        => Tablets
            XTabletPageModel.cs
            YTabletPageModel.cs


class XMobilePage: MvxContentPage<XMobilePageModel> {...}

class XTabletPage: MvxContentPage<XTabletPageModel> {...}

abstract SharedXPageModel
{
    //All Shared Commands and Comand Logic and other shared initialization
    abstract Task NavigateToYPageModel();
}

class XMobilePageModel : SharedXPageModel
{
    Task NavigateToYPageModel() => _mvxNavigationService.Navigate<YMobilePageModel>();
}

class XTabletPageModel : SharedXPageModel
{
    Task NavigateToYPageModel() => _mvxNavigationService.Navigate<YTabletPageModel>();
}

为同一个 ViewModel 绑定两个不同的视图

Bind Two Different Views for same ViewModel

xamarin

xamarin.forms

data-binding

binding

mvvmcross

如果您使用某种导航服务：

如果您在页面代码隐藏中进行导航