Caliburn-Micro / Caliburn.Micro

A small, yet powerful framework, designed for building applications across all XAML platforms. Its strong support for MV* patterns will enable you to build your solution quickly, without the need to sacrifice code quality or testability.
http://caliburnmicro.com/
MIT License
2.8k stars 778 forks source link

Previous ViewModel Flickering in between other ViewModel Activations #772

Closed codinghavok closed 3 years ago

codinghavok commented 3 years ago

In the video linked below, I have visited the "dashboard" page in my app, then I visit the screens Project, Clutch, Tub and just go back and forth between those (never activating Dashboard) and you can see Dashboard flickers inbetween each views activation or deactivations when I haven't activated it in code. I'm using the method below to Activate my viewmodels.

https://drive.google.com/file/d/1m29hY4pzdCcj2fETo-WrYywrz0gjTcQI/view?usp=sharing

public async System.Threading.Tasks.Task ShowViewModel<TX>(string message = "", Action<TX> action = null) where TX : IScreen
        {
            if (ActiveItem is TX)
                return;                      
            await System.Threading.Tasks.Task.Run(() =>
            {
                var viewModel = _viewModelFactory.Get<TX>();

                if (string.IsNullOrEmpty(message))
                {
                    message = $"Loading...";                    
                }

                BusyMessage = message;
                IsBusy = true;

                if (action != null)
                {
                    action(viewModel);
                }

                if (ActiveItem != null)
                {
                    DeactivateItemAsync(ActiveItem, true).Wait();
                }

                ActivateItemAsync(viewModel).Wait();

                IsBusy = false;
            });
        }

When a button is clicked like the "Projects" button, I display it with this code below for each one of the ViewModel Titles you see changed in the video.

await ShowViewModel<ExpenseListViewModel>();

Can you please advise on how I should be activating my viewmodels and deactivating them properly so this flickering doesn't happen or possible to do a transition effect?

Thank you,

haVok

KasperSK commented 3 years ago

Is this a method on a Conductor? I think DeactivateItemAsync might try and find a default view to display when called. It might be better to use ChangeActiveItemAsync instead.

vb2ae commented 3 years ago

If you are still having issues after implementing @KasperSK suggestion, could you run a dot trace profile? This should help figure out where the slowness is.

https://www.jetbrains.com/profiler/

codinghavok commented 3 years ago

Is this a method on a Conductor? I think DeactivateItemAsync might try and find a default view to display when called. It might be better to use ChangeActiveItemAsync instead.

Okay, thank you. I will try that.

codinghavok commented 3 years ago

If you are still having issues after implementing @KasperSK suggestion, could you run a dot trace profile? This should help figure out where the slowness is.

https://www.jetbrains.com/profiler/

I ended up using the solution below and it seemed to resolve my issue with the flickering. I wasn't sure how using @KasperSK recommendation would alter what I currently have so I saved that as a TODO in my project.



           var oldItem = ActiveItem;
            if (oldItem != null)
            {
                await DeactivateItemAsync(oldItem, true);
            }

            await ActivateItemAsync(viewModel); ```