mvvmcross从选项卡式导航到viewmodel

时间:2016-12-01 13:15:36

标签: c# mvvm xamarin.forms mvvmcross

我有一个使用mvvmcross的Xamarin Forms应用程序。在那里我通过TabbedPages导航。每个页面后面都有一个xaml +代码和viewmodel。

第一页的相关代码:

public MvxCommand ConnectToSelectedCommand => new MvxCommand(ConnectToSelectedDeviceAsync, CanDisplayServices);

    private async void ConnectToSelectedDeviceAsync()
    {
        ShowViewModel<ServiceListViewModel>(new MvxBundle(new Dictionary<string, string> { { DeviceIdKey, SystemDevices.FirstOrDefault().Id.ToString() } }));
    }

我可以使用以下方法从主视图模型中的按钮调用不同的视图模型:

public function destroyFile($file_name)
{
    $file = storage_path('documents').'/'.$file_name;
    Storage::delete($file);
    return redirect('/documents');
}

在我的主ViewModel中。但我希望能够使用选项卡在ViewModels之间导航。目前,如果我点击一个标签页,那么它会打开页面,但没有关联的ViewModel。

请帮忙!

2 个答案:

答案 0 :(得分:0)

终于设法解决了这个问题。这很简单,我无法在任何地方找到答案。我只需要在页面的代码隐藏中添加一个bindingcontext。

public ServiceListPage()
    {
        InitializeComponent();
        this.BindingContext = new ViewModels.ServiceListViewModel(Plugin.BLE.CrossBluetoothLE.Current.Adapter, UserDialogs.Instance);
    }

答案 1 :(得分:0)

因此,要使MvvmCross将页面绑定到VM,您需要做的是将MvxTabbedPage作为Root TabbedPosition,并将页面放入选项卡作为Detail TabbedPosition。然后,在MvxTabbedPage的ViewModel中,您必须导航到所有“详细信息”选项卡的ViewModel。这是一个例子。

namespace NameSpace
{
    // Tabbed Detail Page
    [MvxTabbedPagePresentation(Title = "Home", Icon = "ic_home_black.png")]
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class HomePage : MvxContentPage<HomeViewModel>
    {
        public HomePage()
        {
            InitializeComponent();
        }
    }
    // Tabbed Root Page
    [MvxTabbedPagePresentation(TabbedPosition.Root, WrapInNavigationPage = true)]
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class TabbedPage : MvxTabbedPage<TabbedViewModel>
    {
        public TabbedProjectDetailsPage()
        {
            InitializeComponent();
        }
    }
    // Tabbed Detail ViewModel
    public class HomeViewModel : MvxViewModel
    {
        IMvxNavigationService _navigation;
        public HomeViewModel(IMvxNavigationService navigation)
        {
            _navigation = navigation;
        }
    }
    // Tabbed Root ViewModel
    public class TabbedViewModel : MvxNavigationViewModel
    {
        public TabbedProjectDetailsViewModel(IMvxLogProvider log, IMvxNavigationService navigation) : base(log, navigation)
        {
        }
        MvxCommand _navHome;
        public ICommand NavigateHome
        {
            get
            {
                _navHome = _navHome ?? new MvxCommand(async () =>
                {
                    await NavigationService.Navigate<HomeViewModel>();
                });
                return _navHome;
            }
        }

        public void ShowViewModels()
        {
            this.NavigateHome.Execute(null);
        }
        bool appeared = false;
        public override void ViewAppearing()
        {
            base.ViewAppearing();
            if (!appeared)
            {
                ShowViewModels();
            }
            appeared = true;
        }
    }
}