How can I show a Loading-Dialog in my MvvmCross Application?
At first, i did it like so(MvvmCross standard);
[MvxWindowPresentation(Modal = true)]
public partial class LoadingView : MvxWindow
{
public LoadingView () => InitializeComponent();
}
and whenever i needed the LoadingDialog;
_navigationService.Navigate<LoadingView>());
This looks really weird because the Modal view is a new window, but i want to achieve a overlay in my main-application.
Second, tried it with a normal User Control and the MaterialDesignThemes nugget;
public partial class LoadingView : UserControl
{
public LoadingView () => InitializeComponent();
}
and whenever i needed the LoadingDialog;
var result = await MaterialDesignThemes.Wpf.DialogHost.Show(new LoadingView ());
This doesnt work, because I think have to register the MaterialDesignThemes.Wpf.DialogHost in the Mvx.IoCprovider before.
The DialogHost does not need to be registered. When you place a dialog host instance in XAML like below, the dialog instance will be registered automatically.
<materialDesign:DialogHost>
<materialDesign:DialogHost.DialogContent>
<!-- ...dialog content -->
<materialDesign:DialogHost.DialogContent>
<!-- ...content -->
</materialDesign:DialogHost>
Internally, the dialog hosts are tracked in a static HashSet. A DialogHost instance is registered when its Loaded event in XAML is fired and deregistered when the Unloaded event occurrs, as you can see from the reference source below. The InvalidOperationException (No loaded DialogHost instances.) exception is only thrown if, there are no loaded instances of DialogHost.
private static readonly HashSet<DialogHost> LoadedInstances = new HashSet<DialogHost>();
public DialogHost()
{
this.Loaded += new RoutedEventHandler(this.OnLoaded);
this.Unloaded += new RoutedEventHandler(this.OnUnloaded);
// ...
}
private void OnLoaded(object sender, RoutedEventArgs routedEventArgs)
{
DialogHost.LoadedInstances.Add(this);
}
private void OnUnloaded(object sender, RoutedEventArgs routedEventArgs)
{
DialogHost.LoadedInstances.Remove(this);
}
In other words, the Show method throws an exception, because you call it in places, where the DialogHost control in your XAML markup is not loaded yet and did not fire the Loaded event, or it is already Unloaded again. Consequently, you have to make sure that the dialog is loaded before calling Show, see a similar issue here.
Related
I've got a behavior in my .net Core 3.1 WPF Application, which calls a command inside the ViewModel, after the view is displayed.
public class LoadedBehavior
{
public static DependencyProperty LoadedCommandProperty
= DependencyProperty.RegisterAttached(
"LoadedCommand",
typeof(ICommand),
typeof(LoadedBehavior),
new PropertyMetadata(null, OnLoadedCommandChanged));
private static void OnLoadedCommandChanged
(DependencyObject depObj, DependencyPropertyChangedEventArgs e)
{
if (depObj is FrameworkElement frameworkElement && e.NewValue is ICommand)
{
frameworkElement.Loaded
+= (o, args) => { (e.NewValue as ICommand)?.Execute(null); };
}
}
public static ICommand GetLoadedCommand(DependencyObject depObj)
{
return (ICommand)depObj.GetValue(LoadedCommandProperty);
}
public static void SetLoadedCommand(
DependencyObject depObj,
ICommand value)
{
depObj.SetValue(LoadedCommandProperty, value);
}
}
This Behavior is attached inside the View:
behaviors:LoadedBehavior.LoadedCommand="{Binding LoadedCommand}"
I am working with Prisms RegionManager to inject my Views into specific areas inside the views. When I now try to inject a new view, the loaded command from the old view is called again. This seems like it comes from the bevavior.
For a better understanding, here is also the code which gets called to show a new view inside the specific region
public class NavigationService
{
private readonly IServiceLocator _serviceLocator;
private readonly IRegionManager _regionManager;
public NavigationService(IServiceLocator serviceLocator, IRegionManager regionManager)
{
_serviceLocator = serviceLocator;
_regionManager = regionManager;
}
public void Navigate(string regionName, object view)
{
RemoveAllViews(regionName);
_regionManager.AddToRegion(regionName, view);
}
public void Navigate<T>(string regionName) where T : FrameworkElement
{
var view = _serviceLocator.GetInstance<T>();
Navigate(regionName, view);
}
public void RemoveAllViews(string regionName)
{
_regionManager.Regions[regionName].RemoveAll();
}
}
Can anyone tell me, what I do wrong here? Or is this behavior not the way to go?
Edit
Right after posting this, I found the problem: The Loaded Command gets called multiple times. This seems to be caused by when the content of this view changes. So everytime I add a new view, the parent view calls it's loaded event. Is there a way to run the command only once the view is displayed?
The Loaded event is quite inreliable for triggering action with the intention of one time when the control is loaded. From the reference of the Loaded event for FrameworkElement.
Loaded and Unloaded might both be raised on controls as a result of user-initiated system theme changes. A theme change causes an invalidation of the control template and the contained visual tree, which in turn causes the entire control to unload and reload. Therefore Loaded cannot be assumed to occur only when a page is first loaded through navigation to the page.
In Prism you can act on navigation by creating a custom region behavior. In your example, you want to execute a command on a view model, once the view is added to a region. Create an interface that all your target view models implement with a command that should be executed when the view is displayed first.
public interface IInitializableViewModel
{
ICommand Initialize { get; }
}
Create a region behavior that watches the Views collection of a region and executes a command once, when a view is added to the region. It will check the data context of each view, if it implements the interface, the command is not null and command can execute.
public class InitializableDataContextRegionBehavior : RegionBehavior
{
public const string BehaviorKey = nameof(InitializableDataContextRegionBehavior);
protected override void OnAttach()
{
Region.Views.CollectionChanged += OnViewsCollectionChanged;
}
private void OnViewsCollectionChanged(object sender, NotifyCollectionChangedEventArgs e)
{
if (e.Action == NotifyCollectionChangedAction.Add)
{
foreach (var frameworkElement in e.NewItems.OfType<FrameworkElement>())
{
if (frameworkElement.DataContext is IInitializableViewModel initializableViewModel &&
initializableViewModel.Initialize != null &&
initializableViewModel.Initialize.CanExecute(null))
{
initializableViewModel.Initialize.Execute(null);
}
}
}
}
}
Add the custom region behavior in your Prism application to the region behaviors collection.
protected override void ConfigureDefaultRegionBehaviors(IRegionBehaviorFactory regionBehaviors)
{
base.ConfigureDefaultRegionBehaviors(regionBehaviors);
regionBehaviors.AddIfMissing(InitializableDataContextRegionBehavior.BehaviorKey, typeof(InitializableDataContextRegionBehavior));
}
The command on each view model will execute exactly once, when the corresponding view is added to any region. Using an interface here was easier for demonstration purposes, but you can also create an attached property for your command that you attach to your view and bind to the view model.
Most of my view models subscribe to a common event using Prism's EventAggregator on a WPF project. Basically, a vocal command triggers this event on a view, and as a response the view will publish another event containing its specific message to a text-to-speech module.
However, when I implemented this, I realized that when using RegionManager's RequestNavigate to switch to another view, the previous view model is still somehow active. When I trigger the common event for the most recent view, it is also triggered for the previous view.
Simplified example :
Start at View 1
Trigger common event
Response : message from View 1
RequestNavigate to View 2
Trigger common event
Response : message from View 2, then message from View 1
RequestNavigate to View 3
Trigger common event
Response : message from View 3, then View 2, then View 1
etc.
I placed a breakpoint on View 1, View 2 and View 3's common event, and each time I get a message from a view, its breakpoint is hit.
What I would like is simple : I don't want the previous ViewModel (and possibly View too) to be still somehow active when I'm switching Views. Even better would be for them to be garbage collected, because I also had some weird cases where by navigating to View 1, View 2 and View 1 again, the message for View 1 was sent twice (and its breakpoint also hit twice), so I'm not even sure if multiple references for the ViewModels are created, which could potentially lead to a memory leak.
I tried to reproduce this behavior by creating another project with just the essentials, so here's the code. I'm using Visual Studio 2017 with .net framework 4.5.2 and Ninject.
Shell.xaml
<Window x:Class="PrismTest.Shell"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:prsm="http://prismlibrary.com/"
mc:Ignorable="d">
<Grid>
<ContentControl Name="MainRegion" prsm:RegionManager.RegionName="MainRegion" />
</Grid>
</Window>
NinjectPrismBootstrapper.cs
public class NinjectPrismBootstrapper : NinjectBootstrapper
{
protected override void InitializeModules()
{
base.InitializeModules();
// Text to speech
Kernel.Bind<SpeechSynthesizer>().ToSelf().InSingletonScope();
Kernel.Bind<INarrator>().To<StandardNarrator>().InSingletonScope();
Kernel.Bind<INarratorEventManager>().To<NarratorEventManager>().InSingletonScope();
// View models
Kernel.Bind<MainPageViewModel>().ToSelf();
Kernel.Bind<SecondPageViewModel>().ToSelf();
// Views
Kernel.Bind<object>().To<MainPageView>().InTransientScope().Named(typeof(MainPageView).Name);
Kernel.Bind<object>().To<SecondPageView>().InTransientScope().Named(typeof(SecondPageView).Name);
Kernel.Bind<Shell>().ToSelf();
var narratorEventManager = Kernel.Get<INarratorEventManager>();
var regionManager = Kernel.Get<IRegionManager>();
regionManager.RegisterViewWithRegion("MainRegion", typeof(MainPageView));
}
protected override DependencyObject CreateShell()
{
return (Shell)Kernel.GetService(typeof(Shell));
}
protected override void InitializeShell()
{
base.InitializeShell();
Application.Current.MainWindow = (Shell)this.Shell;
Application.Current.MainWindow.Show();
}
}
MainPageView.xaml (my starting page)
<UserControl x:Class="PrismTest.Views.MainPageView"
namespaces...>
<StackPanel>
<TextBlock Text="Main page"/>
<Button Content="Narrator speaks" Command="{Binding Path=NarratorSpeaksCommand}" />
<Button Content="Next page" Command="{Binding Path=GoToNextPageCommand}"/>
</StackPanel>
</UserControl>
MainPageView.xaml.cs
public partial class MainPageView : UserControl
{
public MainPageView(MainPageViewModel dataContext)
{
InitializeComponent();
this.DataContext = dataContext;
}
}
MainPageViewModel (View model for MainPageView)
public class MainPageViewModel : BindableBase, IRegionMemberLifetime, INavigationAware
{
private readonly IEventAggregator _eventAggregator;
private readonly IRegionManager _regionManager;
public DelegateCommand GoToNextPageCommand { get; private set; }
public DelegateCommand NarratorSpeaksCommand { get; private set; }
public MainPageViewModel(IEventAggregator eventAggregator, IRegionManager regionManager)
{
_eventAggregator = eventAggregator;
_regionManager = regionManager;
ConfigureCommands();
//The original common event triggered by a vocal command is simulated in this project by simply clicking on a button
_eventAggregator.GetEvent<CommonEventToAllViews>().Subscribe(NarratorSpeaks);
}
private void ConfigureCommands()
{
GoToNextPageCommand = new DelegateCommand(GoToNextPage);
NarratorSpeaksCommand = new DelegateCommand(ClickPressed);
}
private void GoToNextPage()
{
_regionManager.RequestNavigate("MainRegion", new Uri("SecondPageView", UriKind.Relative));
}
private void ClickPressed()
{
_eventAggregator.GetEvent<CommonEventToAllViews>().Publish();
}
private void NarratorSpeaks()
{
_eventAggregator.GetEvent<NarratorSpeaksEvent>().Publish("Main page");
}
}
I don't need to put the code for SecondPageViewModel and SecondPageView, because it's the exact same code except RequestNavigate sends the user back to MainPageView and its NarratorSpeaks method sends a different string.
What I tried :
1) Making MainPageViewModel and SecondPageViewModel inherit IRegionMemberLifetime and setting KeepAlive to false
2) Inheriting INavigationAware and returning false in IsNavigationTarget method
3) Adding this to OnNavigatedFrom method from INavigationAware :
public void OnNavigatedFrom(NavigationContext navigationContext)
{
var region = _regionManager.Regions["MainRegion"];
var view = region.Views.Single(v => v.GetType().Name == "MainPageView");
region.Deactivate(view);
}
Worth noting : even without the deactivate part, if I put a breakpoint after var region = _regionManager.Regions["MainRegion"]; and check region.views, there is only one result, no matter how much I switch views.
Nothing worked, events keep being triggered in previous views as I switch views back and forth.
So, I'm kind at a loss here. I'm not sure if it's my way of registering Views and ViewModels in Ninject that triggers this, or something else, but if someone has a suggestion, I'll gladly take it.
Thanks!
I had similar problems in the past. Have you considered unsubscribe from events when navigated from?
Background info
I'm developing a Xamarin Forms (v4.1.1.3, testing on iOS) application in XAML, using MVVM with a View first approach; I'm assigning single-instance ViewModels to Views by using the ViewModelLocator service of MVVMLight:
BindingContext="{Binding [SearchViewModel], Source={StaticResource ViewModelLocator}}"
When navigating to another page, I'm constructing a new instance of the page, which will receive the very same ViewModel instance every time.
var page = new SearchView();
var tabbedPage = Application.Current.MainPage as TabbedPage;
if (tabbedPage != null)
await tabbedPage.CurrentPage.Navigation.PushAsync(page);
The issue
I've implemented a custom control (view?), that is supposed to show search results in a tile-like layout. This control is created when navigating from a search NavigationPage to a search results ContentPage.
Every time I return to the search page and navigate back to search results, the view is reconstructed and the PropertyChanged of the BindableProperties are subscribed. These PropertyChanged events are never unsubscribed, so every time I navigate to the search results view and change the bound ViewModel property, the event is fired increasingly multiple times.
In the following code the OnItemsPropertyChanged is triggered multiple times, based on how many times I've navigated from the search view to the search results view:
public class WrapLayout : Grid
{
public static readonly BindableProperty ItemsProperty =
BindableProperty.Create("Items", typeof(IEnumerable), typeof(WrapLayout), null, propertyChanged: OnItemsPropertyChanged);
public IEnumerable Items
{
get { return (IEnumerable)GetValue(ItemsProperty); }
set { SetValue(ItemsProperty, value); }
}
public WrapLayout()
{
...
}
private static void OnItemsPropertyChanged(BindableObject bindable, object oldValue, object newValue)
{
...
}
}
My questions:
Shouldn't the BindableProperty unsubscribe from PropertyChanged and -Changing by itself?
Does this occur because of the way I associated Views with ViewModels and/or navigate through pages?
Should I handle unsubscribing these events myself, and how?
EDIT; additional navigation info
I have a MainView TabbedPage, which creates SearchView as NavigationPage:
public MainView()
{
InitializeComponent();
Children.Add(new NavigationPage(new SearchView())
{
Title = AppResources.Tab_Search,
Icon = "tab_search"
});
}
SearchView has, upon creation, a single-instance ViewModel assigned by the ViewModelLocator that was mentioned at the start of this topic, using MVVMLight's SimpleIoc container.
When a search command in SearchView is fired, I send a request to an API which returns search results. These results are displayed on another page, to which I navigate to from the SearchView's ViewModel:
await _navigationService.NavigateTo(ViewModelLocator.PageKeyFileResults, searchResult);
Which functionality looks somewhat like this:
public async Task NavigateTo(string pagekey, object viewModelParameter)
{
var constructor = _pagesByKey[pagekey].Constructor; //Gets the Func<Page> that simple creates the requested page, without using reflection.
var page = constructor() as Page;
var viewModel = page.BindingContext as BaseViewModel;
if (viewModel != null)
viewModel.Initialize(viewModelParameter);
var tabbedPage = Application.Current.MainPage as TabbedPage;
if (tabbedPage != null)
await tabbedPage.CurrentPage.Navigation.PushAsync(page);
else
await Application.Current.MainPage.Navigation.PushAsync(page);
}
The constructed page looks somewhat like:
<pages:BaseContentPage
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="Views.FileResultsView"
xmlns:pages="clr-namespace:Views.Pages;assembly=Views"
xmlns:controls="clr-namespace:Views.Controls;assembly=Views"
BindingContext="{Binding [FileResultsViewModel], Source={StaticResource ViewModelLocator}}">
<ScrollView>
<controls:WrapLayout
Items="{Binding SearchResults}" />
</ScrollView>
</pages:BaseContentPage>
Where BaseContentPage is:
public class BaseContentPage : ContentPage
{
protected override void OnAppearing()
{
base.OnAppearing();
MessagingCenter.Subscribe<DialogMessage>(this, "ShowDialog", (dialogMessage) =>
{
if (string.IsNullOrWhiteSpace(dialogMessage.AcceptButton))
DisplayAlert(dialogMessage.Title, dialogMessage.Content, dialogMessage.CancelButton);
else
DisplayAlert(dialogMessage.Title, dialogMessage.Content, dialogMessage.AcceptButton, dialogMessage.CancelButton);
});
}
protected override void OnDisappearing()
{
base.OnDisappearing();
MessagingCenter.Unsubscribe<DialogMessage>(this, "ShowDialog");
}
}
And where ViewModel is basically like this:
public class FileResultsViewModel : BaseViewModel
{
private IEnumerable<ASRow> _searchResults;
public IEnumerable<ASRow> SearchResults
{
get { return _searchResults; }
set { Set(ref _searchResults, value); }
}
internal override void Initialize(object parameter)
{
base.Initialize(parameter);
if (parameter is AdvancedSearchResponse)
{
var searchResults = parameter as AdvancedSearchResponse;
SearchResults = new List<ASRow>(searchResults.Rows);
}
}
}
Shouldn't the BindableProperty unsubscribe from PropertyChanged and -Changing by itself?
Yes - it should. If it does not it is most certainly a bug
Does this occur because of the way I associated Views with ViewModels and/or navigate trough pages?
That is most likely also an option, since i didn't experience the behaviour you described yet. You would need to share more of your surrounding setup code.
Should I handle unsubscribing these events myself, and how?
It's hard for you to always control unsubscribing, since most of the time it will be the control subscribing to events (unless you do it yourself, in which case it's always your duty to unsub again)
While it is ugly it's sometimes necessary to get a quick workaround, which in your case would be browsing how xamarin holds a list of the change delegates and manually unsubscribe them on page appearing for example.
I hope that answers your question. Feel free to comment if it does not.
Update
In your case i would debug your page base, and verify wether or not
OnDisappearing is called correctly
Your handler is gone after unsubscribe
(This is lazy but i usually unsub an event before subbing it, just to make sure such a bug does not happen, because most EventManagement services won't throw if you're trying to unsub a handler which is not registered.)
at least that's the most likely causes of your issue.
Shouldn't the BindableProperty unsubscribe from PropertyChanged and -Changing by itself?
No. The Binding class takes care of this. Not the BindableProperty.
Does this occur because of the way I associated Views with ViewModels and/or navigate through pages?
You are seeing this because you are forgetting that the Navigation Stack keeps a list of pages in memory. Since multiple pages are pointing to the same BindingContext, there are multiple observers to changes. You would not have this particular issue if you didn't re-use View Models.
Should I handle unsubscribing these events myself, and how?
No. If it is really a concern then set BindingContext to null when a page disappears, and then restore it when reappearing. Keep in mind though that this still has cost to it, especially if your UI is really busy and has lots of dynamic content that is controlled by data bindings.
Is there anyway you can "restart"/initialize a page from a click (from another page)? I am working with a rootpage cointaining a Master Detail Page and a contentpage, and I would want them to not Initialize their Components together as they are right now.
Maybe an option is to (if it is possible) make a clickevent with the Master Detail Page Icon if the InitializeComponent question is not possible.
But of course it would be more handy if I could seperate the two pages somehow. I am trying to come up with something below that would initialize another pages components.
button.Clicked += (object sender, EventArgs e) => {
var ourStartPage = new StartPage ();
ourStartPage.InitializeComponent ();
}
public class Page1 : ContentPage {
public Page1() {
// comment out the default InitializeComponent()
// InitializeComponent();
}
// create a public method to do the init instead
public void InitThisPage() {
InitializeComponent();
}
}
I have two "MainWIndows". A Login screen and the actual Content Main Window. This is the process in which i want to happen.
User starts application
Clicks Login Button on the Login Window
Initialize the Content Window
Wait until all my lists and Data have been gathered, parse, and added to ListViews
Close the Login Window and show the Main Window. (Make MainWindow the main Window)
I am having issues actually hiding the main window, but i still need to be able to initialize it so i can gather all my data.
I added this to my App.xaml:
<Application.MainWindow>
<NavigationWindow Source="MainWindow.xaml" Visibility="Hidden"></NavigationWindow>
</Application.MainWindow>
Here is my some of my LoginWindow code:
// Login complete, load the MainWindow Data
MainWindow mainWindow = new MainWindow();
mainWindow.setLoginWindow = this;
mainWindow.InitializeComponent(); //mainWindow.Show();
And the code i am using in the MainWindow:
public partial class MainWindow : MetroWindow
{
Window LoginWindow;
public Window setLoginWindow { get { return LoginWindow; } set { LoginWindow = value; } }
public MainWindow()
{
InitializeComponent();
// Hide the window to load Data, then on completion, close LoginWindow and show MainWindow: ::: LoginWindow.Close();
LoadData();
}
public void LoadData()
{
// Add player's to list ....
// Done loading data, show the window
LoginWindow.Close();
this.Visibility = Visibility.Visible;
}
}
The Question
How would i do this properly? Also, i want to keep the Focus on the LoginWindow until the MainWIndow has been shown.
(off the top of my head so watch for syntax errors etc...)
Edit the App.xaml and do this:
Startup="StartUp"
Then edit the App.xaml.cs and add a StartUp event like so:
private void StartUp(object sender, StartupEventArgs args)
{
...
}
Then inside you can call your login window and then start your main window after that.
var login = new LoginWindow();
if(login.ShowDialog()!=true)
{
//login failed go away
return
}
var mainWin = new MainWindow();
mainWin.Show();
I think the problem is that you are putting you logic in the MainWindow. Try putting it in the static Main() method or in the class App: Application class.
Here is a code project where he is doing something similar for a splash screen:
http://www.codeproject.com/Articles/38291/Implement-Splash-Screen-with-WPF
Here is a tutorial for working with the App.xaml.cs
http://www.wpf-tutorial.com/wpf-application/working-with-app-xaml/