MVVMCross-Android dynamic fragment inside fragment and manage navigation stack per fragment - c#

I am currently working on MVVMCross Xamarin Android project. So far I have achieved normal navigation and bottom bar navigation. I want to open dynamic fragments inside each bottom bar tabs. e.g I have bottom bars menus Recent, Favorite and NearBy. Clicking on each tab it create fragments. Inside each fragment I want to provide facility to dynamically create fragments on click.
I want to achieve here is, it should keep stack of navigation tab wise. Let say I created 5,3,4 fragments respectively for Recent, Favorite and Nearby and currently I am on favorite tab and clicking on back should first navigate back to all 3 tabs. Like wise it should follow navigation for other tabs.
Exact same feature and functionality available in this github link
[https://github.com/ncapdevi/FragNav][1]. This is one is for Android but I need advice how can I achieve same functionality with Xamarin, MVVMCross and C#.
Any help greatly appreciated.

First your link is dead,and then i think you need to understand the back stack of fragments and show hidden features to implement that.FragmentTransaction
general train of thought, you have RecentFragment, FavoriteFragment and NearByFragment three root fragments,
when you click the relative tab ,you can use show and hide method of fragment like
this :
FragmentTransaction fTransaction = FragmentManager.BeginTransaction();
hideAllFragment(fTransaction);
//judge which tab is clicked
switch (tab.Id)
{
case Recent:
if (recentFragment== null)
{
recentFragment= new RecentFragment ();
fTransaction.Add(Resource.Id.ly_content, recentFragment);
}
else{fTransaction.Show(recentFragment);}break;
case Favorite:
if (favoriteFragment== null)
{
favoriteFragment= new FavoriteFragment();
fTransaction.Add(Resource.Id.ly_content, favoriteFragment);
}
else{fTransaction.Show(favoriteFragment);}
break;
case NearBy:
if (nearByFragment== null)
{
nearByFragment= new NearByFragment();
fTransaction.Add(Resource.Id.ly_content, nearByFragment);
}else{fTransaction.Show(nearByFragment);}break;
}
fTransaction.Commit();
and then in each root fragment to implement the back stack use addToBackStack :
FragmentManager fragmentManager = FragmentManager;
FragmentTransaction fragmentTransaction = fragmentManager.BeginTransaction();
fragmentTransaction.Replace(containerViewId,fragment);
fragmentTransaction.AddToBackStack(null);
fragmentTransaction.Commit();
at last you could try to encapsulating a controller

Related

How to navigate from a normal page to a MasterDetailPage using Prism.Forms framework?

So i have a splash screen and a LoginScreen, after the user logs in, then he's presented with a MasterDetailPage, and there's a option to logout, what i want to achieve is to clear the masterdetail navigation and go to the login page using Prism.Forms
But when i do "NavigationPage/LoginPage", it still has the MasterDetailPage Navigation active, is there a way to disable this behavior using Prism
MasteDetailNavigation]3]3
Any help would be helpfull
As I can see from your question you want to reset navigation stack and master-detail page and navigate to "clear" page for your login page. If you want to achieve that, you don't want to use NavigationPage/LoginPage you will need to use Absolute navigation, because using Absolute navigation in Prism you will be able to reset the entire navigation stack and it is equivalent to:
Application.Current.MainPage = new SomePage()
You can find more about it here.
But basically what you need to do is to use Prism Absolute navigation like this:
//absolute short-syntax
_navigationService.NavigateAsync("/YourPage"); //notice the prefix /
//absolute URI-syntax
_navigationService.NavigateAsync(new Uri("http://www.brianlagunas.com/YourPage", UriKind.Absolute));
Code example is from Prism Library docs site
Also I recommend you to take a look at my blog post How to make Master-Detail Page Navigation menu in Xamarin.Forms with Prism
Wishing you lots of luck with coding!

Activity Destroyed when trying to call a new Fragment page - Xamarin.Android

I am using a Xamarin.Android template (BottomNavigationView) to create an app with a bottom menu. I am trying to get it so that one of the pages that is on the menu ie a profile page has a button that will take me to another fragment. However when I call the SupportFragmentManager I am getting an error saying "the activity has been destroyed".
I'd like both those buttons to go to other pages that also display the bottom menu button (as i would like it to be consistent throughout my app). The code I am using is:
FragmentActivity fragmentActivity = new FragmentActivity();
fragmentActivity.SupportFragmentManager.BeginTransaction()
.Replace(Resource.Id.content_frame, ShowFriendRequests.NewInstance())
.Commit();
The template I am using uses the android.support.v4.app.Fragment and has a MainActivity that I think uses FragmentActivity. But I'm not entirely sure because it was all premade. I have just added the fragment files.
Any idea why I'd be getting this error?
Thank you
Anyway I think you are not preforming FragmentTransaction correctly instead of using FragmentActivity use FragmentTransaction to replace one Fragment with another or to Add another Fragment. For example in Java code that would go like this:
FragmentTransaction transaction = getFragmentManager().beginTransaction();
transaction.replace(R.id.content_frame, new ShowFriendRequests()).commit();
In c# I suppose something like this:
FragmentTransaction fragmentTx = FragmentManager.BeginTransaction();
ShowFriendRequests friendRequest = new ShowFriendRequests();
// Id is ID of your layout which you want to replace with fragment
fragmentTx.Replace(Resource.Id.content_frame, friendRequest);
fragmentTx.Commit();

Xamarin.Android Material Design Icons

A bit of context:
I was looking into the Material Design Support Library for Xamarin and found this article about various controls from this library.
I tried to reproduce the Toolbar from the last example (for now I'm not even thinking about implementing the whole hamburger navigation example, just the toolbar with the button). I set it up, created MyTheme with my colors, added the fixes for style-v21 and so on. Everything works well so far, though the <include ... /> node throws a warning that it's not a recognized child for RelativeLayout. Still, it's building correctly so I can deal with it for the most part.
The problem:
Here's where my problem starts:
...
// Set our view from the "main" layout resource
SetContentView (Resource.Layout.main_layout);
var toolbar = FindViewById<Android.Support.V7.Widget.Toolbar>(Resource.Id.toolbar);
SetSupportActionBar (toolbar);
//Enable support action bar to display hamburger
SupportActionBar.SetHomeAsUpIndicator (Resource.Drawable.ic_menu);
SupportActionBar.SetDisplayHomeAsUpEnabled (true);
...
With the SupportActionBar set up like that, it doesn't display the button. Also, the ic_menu drawable seems to be missing. In fact, there aren't any that start with ic_, only abc_.
Am I missing something here?
Cheers!
Go to https://material.io/icons/ and download menu icon and then add that icon to the drawable folder and then replace ic_menu in your code with the image name.
NOTE: Do not add image extension name like .jpg,.png with image name

Xamarin Forms Exrin Framework pushing a container as a Modal?

I've been playing with the Exrin Xamarin Forms framework which I'm liking.
I've come to a blocker where I want to push a container as a Modal. Anyone know any tips on how to do this? I can't find any examples, or a best approach on how to push a container as Modal.
Looking at the Exrin code, might have to change BaseStack.cs, create a NavigationModal ResultType, lifestyle so it doesn't affect already in memory containers, etc...?
Any other ideas?
The idea behind Exrin and its Stacks, is that a Modal wouldn't be needed. The only reason for Modals, is for a page that you can't just press back from and sits on top of the existing page.
The recommended approach here, is to create a new Stack and just navigate to that. Then go back to the previous stack once finished. It behaves the same way as a Modal, but you don't need to actually use a Modal.
Update
If you must have a Modal, while other ways to support transitions come into play, you can modify your NavigationProxy. Replace the 2 functions below.
public async Task PopAsync()
{
if (_page.Navigation.ModalStack.Count > 0)
{
var page = _page.Navigation.ModalStack[0];
_page_Popped(null, new NavigationEventArgs(page));
await _page.Navigation.PopModalAsync();
}
else
await _page.PopAsync();
}
public async Task PushAsync(object page)
{
var xamarinPage = page as Page;
if (xamarinPage == null)
throw new Exception("PushAsync can not push a non Xamarin Page");
if (page is ExrinSample.View.AboutView)
await _page.Navigation.PushModalAsync(xamarinPage);
else
await _page.PushAsync(xamarinPage);
}
Of course this is manually referencing a specific page in your proxy. If you wanted to clean that up, you could add some methods in your Stack to list pages that are modal, and use that list to push to modal if needed, rather than directly putting the page names inside the proxy.

Navgation between XAML pages

I have a simple Silverlight application that consists of four pages (XAMLs).
Navigation is done by calling:
//from XamlPageA
this.Content = new XamlPageB();
Is this the right way. I need to have the entries in Browser history so that users can go page to the previous page(s). How can I do it.
You are bypassing the navigation system completely by setting content manually. You would have to implement updating the browser history yourself if you do it that way (certainly possible, but quite tedious).
A simpler approach is to generate a "Silverlight Business Application" project and see how the page navigation is simply handled with hyperlink buttons. All the browser history plumbing is done for you as is the mapping from URL to views.
e.g. A button with NavigateUri="/Home" will cause a view named Home.xaml to load into the navigation:Frame of the MainPage window.
if you look into the navigation:Frame element of MainPage.xaml, you will see a number of UriMapping entries like this:
<uriMapper:UriMapping Uri="" MappedUri="/Views/Home.xaml"/>
<uriMapper:UriMapping Uri="/{pageName}" MappedUri="/Views/{pageName}.xaml"/>
They provide the pattern matching to convert from URLs to views.
Hope this helps your project.

Categories