How do I close all pages after changing an item's data? - xamarin

I have a doubt in Xamarin forms, I have an application that I would like after finishing the training, it closes all the training screens and only the main screen remains, today I got a cod that does this, but when I restart the app and I login,
when he closes the screens instead of going back to the main screen he goes back to the login, I'm not using masterpage, could that be it?
source:
private async void BtnVoltar_Clicked(object sender, EventArgs e)
{
int numModals = Application.Current.MainPage.Navigation.ModalStack.Count;
// Pop each modal in the stack
for (int currModal = 0; currModal < numModals; currModal++)
{
await Application.Current.MainPage.Navigation.PopModalAsync();
}
await Navigation.PushModalAsync(new TabbedPageMenu());
}
Image Link
https://imgur.com/pOVVYBu
Another doubt would be after updating the data of an item, if it is possible to close the two screens and update it on the main screen
image link2
https://imgur.com/ZpevVNg

You can use the method to navigate to the different pages instead of close the pages.
The code in xaml you can add the command to do the navigation.
Command="{Binding NavigateCommand}"
CommandParameter="{x:Type views:targetpagename}"
The code in xaml.cs or viewmodel
public ICommand NavigateCommand { get; private set; }
public MainPage()
{
InitializeComponent();
NavigateCommand = new Command<Type>(
async (Type pageType) =>
{
Page page = (Page)Activator.CreateInstance(pageType);
await Navigation.PushAsync(page);
});
BindingContext = this;
}

Related

UI freezes for 2-3 seconds when loading a carouselview

I have a carouselview binded to a viewmodel, on the previous page (call it first page) user can select 2 arguments and with the help of those, the next view (call it second page) is generated accordingly. However, I can't wrap my head around why my view won't load asynchronously.
So my problem: When I click the button on the first page the UI would freeze for like a solid 2-3 seconds, and then start load (asynchronously?) and once it's done it's all good.
Also I couldn't really figure out a better way to inherit values from first page to second so if someone has an idea please let me know.
Any help on how can I fix this I would really appreciate.
The viewmodel for second page
public class DataSelectionViewModel : BaseViewModel
{
public ObservableCollection<Items> FilteredData { get; set; }
public UserSelectionViewModel()
{
_dataStore = DependencyService.Get<IDataStore>();
LoadData= new AsyncAwaitBestPractices.MVVM.AsyncCommand(FilterData);
FilteredData = new ObservableRangeCollection<Items>();
}
public async Task FilterData()
{
FilteredData.Clear();
var filtereddata = await _dataStore.SearchData(Hard, Subject).ConfigureAwait(false);
foreach (var data in filtereddata)
{
FilteredData.Add(data);
}
}
}
The carouselview in second page
<ContentPage.BindingContext>
<db:DataSelectionViewModel/>
</ContentPage.BindingContext>
...
<!-- DataTemplate for carouselview has radiobuttons, label and button all in a grid -->
<CarouselView ItemsSource="{Binding FilteredData}">
Second Page c#
public partial class SecondPage : ContentPage
{
public Coll(bool hard, string subject)
{
InitializeComponent();
var vm = (BaseViewModel)BindingContext;
vm.Hard = hard;
vm.Subject = subject;
/* had to set "hard" and "subject" here again, otherwise data won't load */
}
protected override async void OnAppearing()
{
var vm = (DataSelectionViewModel)BindingContext;
base.OnAppearing();
await vm.LoadData.ExecuteAsync().ConfigureAwait(false);
}
}
The first page view containing the button
<Button x:Name="Start" Pressed="ButtonClick"/>
First page c# --> Here I also tried doing it with a command and a pressed at the same time, because I couldn't come up with a way to save variables to second page viewmodel, that's why I use pressed here
private async void ButtonClick(object sender, EventArgs e)
{
var vm = (BaseViewModel)BindingContext;
vm.Hard = HardButtonSelected == Hard;
vm.Subject = vm.Subject.ToLower();
await Navigation.PushAsync(new SecondPage(vm.Hard, vm.Subject));
}
I have tried not using the OnAppearing method to get my data, but then it wouldn't bind to the page and it would not show, if I were to previously fill the ObservableCollection with my data and then load the page although I would love to be able to do this because it would allow me to create a loading popup also.

Button x:Name="btnBack" not navigating to previous page

I am developing Xamarin Forms application for IOS and Android.I have the list of 3 xamarin form pages say X.xaml, Y.xaml, Z.xaml. Page X.xaml, Y.xaml is having 1 and click on that button it opens the next-next Xamarin form. And last on Z.xaml having 2 buttons btnBack & btnConfirm
<Button x:Name="btnBack"></Button>
<Button x:Name="btnConfirm"></Button>
when I click on that back button I want to navigate it to my previous page, but I don't want it like Navigation Back Button or Hardware Back Button click.
for this I have tried this code this will not work.
Z.xaml.cs
public partial class Z : ContentPage
{
public Z()
{
InitializeComponent();
btnBack.Clicked += btnBack_Clicked;
}
private void btnBack_Clicked(object sender, EventArgs e)
{
var existingPages = Navigation.NavigationStack.ToList();
foreach (var page in existingPages)
{
if(page == this)
Navigation.RemovePage(page);
}
}
}
In this code when I click on Back Button it Navigate me to prevoius page ie Y.xaml once I click on button which is on Y.xaml and open the Z.xaml page it shows me blank.
Y.xaml.cs
public partial class Y: ContentPage
{
public Y()
{
InitializeComponent();
btnZ.Clicked += btnZ_Clicked;
}
void btnZ_Clicked(object sender, System.EventArgs e)
{
Navigation.PushAsync(new Z());
}
}
#Kowalski had the right answer however it is incomplete.
You have to await Navigation.PopAsync() otherwise you may mess up the navigation stack. So always await it. Example:
async void btnBack_Clicked(object sender, EventArgs e)
{
await Navigation.PopAsync();
}
Beside that be aware that there are bugs in Xamarin.Forms related to navigation, here is one that might be interesting for you as well:
https://bugzilla.xamarin.com/show_bug.cgi?id=59172
P.S.: Here you can find the official guide on Popping Pages from the Navigation Stack.
you should invoke Navigation.PopAsync() to go back

What is the different between Navigation.PushModalAsync() andNavigation.PushAsync() In Xamarin Forms?

Reason for ask this i got error when i use PushAsync in xamarin forms mvvm architecture
await Navigation.PushAsync(new Page2());
Error is
I have corrected this error by changing PushAsync to PushModelAsync
await Navigation.PushModalAsync(new Page2());
anyone has idea about what cause to this error?
i am calling PushModelAsync from ViewModel
public class Page1Model : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
public INavigation Navigation { get; set; }
public Command ContinueBtnClicked { get; }
public Page1Model(INavigation navigation)
{
this.Navigation = navigation;
this.ContinueBtnClicked = new Command(async () => await GotoPage2());
}
public async Task GotoPage2()
{
await Navigation.PushModalAsync(new Page2());
}
}
In your App.xaml.cs wrap your first page in a NavigationPage, like this: MainPage = new NavigationPage(new Page1());.
Now it will work. If you just have a single page, iOS doesn't know how to navigate to another page from there, so it needs a container page to handle navigation.
The reason the the modal variant works is because it spawns a new navigation stack and shows pages on top of everything else (hence modal).

Pushing content page from background thread freezes app

In Xamarin Forms for iOS, I have a custom renderer for a ContentPage that displays a video control. In my Xamarin Forms app, this custom ContentPage is displayed inside a NavigationPage.
I would like to have the video screen open when a specific message comes in via MQTT.
When I open the video page by clicking a link on the main screen, it opens as expected. I know I am receiving the message via MQTT and calling Navigation.PushModalAsync() because of console statements and breakpoints. However, the custom rendered page is not displayed and the UI of my app freezes each time after calling PushModalAsync.
Is there something else I need to do to trigger Navigation.PushModalAsync() based on receiving an MQTT notification in the background of my app?
ViewRoomsPage.axml.cs:
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class ViewRoomsPage : ContentPage
{
public ViewRoomsPage()
{
InitializeComponent();
}
public string StreamUri { get; set; }
}
ViewRoomsPage.axml:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="MyForms.Pages.ViewRoomsPage">
<ContentPage.Content>
</ContentPage.Content>
VideoViewerRenderer.cs (video code removed; this should display a blank red screen. It also works when launched from a button on the main screen)
[assembly: ExportRenderer(typeof(ViewRoomsPage), typeof(ViewRoomsRenderer))]
namespace MyForms.IOS.NativeImplementations
{
public class ViewRoomsRenderer : PageRenderer
{
private IJKFFMoviePlayerController _playerController;
protected override void OnElementChanged(VisualElementChangedEventArgs e)
{
base.OnElementChanged(e);
if (e.OldElement != null || Element == null)
{
return;
}
e.NewElement.BackgroundColor = Color.Red;
}
}
}
Method triggered from receiving an MQTT message
public void PushViewRooms()
{
Device.BeginInvokeOnMainThread(async () =>
{
await Application.Current.MainPage.Navigation.PushModalAsync(new ViewRoomsPage());
});
}
In App.xaml.cs:
public partial class App : Application
{
public App()
{
SetupDependencies(); // using StructureMap
Manager = DependencyContainer.Resolve<IMqttManager>();
Manager.Connect();
InitializeComponent();
var mainPage = new MainPage();
MainPage = new NavigationPage(mainPage);
}
}
The problem was a deadlock caused by a Task.WaitAll() being triggered in another section of code running in the background.
Thanks all who helped sanity check that it wasn't something in the way the renderer was set up.

Xamarin Forms Sidebar

I have created a basic Master Detail navigation by following the following code:
https://developer.xamarin.com/guides/xamarin-forms/user-interface/navigation/master-detail-page/
I want to be able to make a clickable section on my sidebar which will take the user to their profile page. Similar to googles sidebar: https://github.com/jamesmontemagno/Xam.NavDrawer
Where can i find some tutorials on how i would do that? They would click on their name/profile picture and that would take them to their profile page.
Checkout SlideOverKit for Xamarin.Forms #
https://github.com/XAM-Consulting/SlideOverKit
It allows menu slide outs, sliding panels, etc... from the top, bottom, left, right...
Here is an example of navigating to another page on click of an image in MasterPage. This is the XAML of the Image in MasterPage.
<Image
x:Name="profileImage"
HeightRequest="100"
WidthRequest="100"
HorizontalOptions="Center"/>
We will add a TapGestureRecogniser to the Image and then invoke an Event defined in MasterPage.
public partial class MenuPage : ContentPage
{
public event EventHandler MenuTapped;
public MenuPage ()
{
InitializeComponent ();
TapGestureRecognizer imageViewTap = new TapGestureRecognizer ();
imageViewTap.Tapped+= ImageViewTap_Tapped;
profileImage.GestureRecognizers.Add (imageViewTap);
}
async void ImageViewTap_Tapped (object sender, EventArgs e)
{
if (MenuTapped != null)
MenuTapped (this,EventArgs.Empty);
}
}
We can listen to the event invoked from MasterPage in the MasterDetailPage and navigate to Profile page.
public class DashboardPage : MasterDetailPage
{
DetailPage detailPage;
MenuPage masterPage;
public DashboardPage ()
{
detailPage = new DetailPage ();
var detailNavigationPage=new NavigationPage(detailPage);
Detail = detailNavigationPage;
masterPage= new MenuPage(){Title="Menu",Icon="ic_menuIcon.png"};
Master = masterPage;
masterPage.MenuTapped+= MasterPage_MenuTapped;
}
async void MasterPage_MenuTapped (object sender, EventArgs e)
{
Detail=new new NavigationPage(new ProfilePage());// If you want to load profile page as `DetailPage`
await Navigation.PushModalAsync(new ProfilePage)// If you want to load profile page as another page modally.
}

Resources