Xamarin Forms open a view without Navigation - xamarin

Xamarin Forms navigation examples I see leverage a NavigationPage...
public App()
{
InitializeComponent();
MainPage = new NavigationPage(new HyperTrack2.Login());
}
and then when an event occurs to move to the next page...
async void OnLogin(object sender, EventArgs e)
{
await Navigation.PushAsync(new MapPage());
}
How can one show a view without using the NavigationPage?

Depends on what you consider a view to be.
The process you outlined in your question is the prefered way to navigate using Xamarin pages. Xamarin pages contain one or more controls, or views. Usually some layout views at the root and then they branch out as needed.
The built in navigation mechanism actually utilises the optimal native techniques for navigating inside your application and will allow you to use standard gestures and buttons for navigations, display standard toolbars and title views, etc.
I fully recommend that unless you have very specific needs, you keep using the built in navigation mechanism.
Otherwise, your other option for moving through xamarin.forms pages is by just settting the MainPage property of your Application class (called App by default)
You can either access it through Application.Current.MainPage = new MyPage(); or if writing code within the app class, directly by calling MainPage = new MyPage();
Lastly, you specifically mention showing a view and not a page. If you are talking about a single control within a page, you can either bind it's IsVisible property to some value in your ViewModel, or you can give it an x:Name="myControl" (if using XAML) or store a reference to it (if creating UI in code behind) and then do myControl.IsVisible = true/false somewhere in your code behind. This toggles the visibility of a single control, which will then become a part of your page hiearchy.
If you instead wish to display the view as a "popup" over the existing page, without it actually becoming a part of the page, there are some built in simple UI elements you can use, such as action sheet and display alert. These provide simple popup windows that offer a couple of actions or display a message.
For more complex UI, look into Nuget plugin packages, or if you prefer, you can write your own by implementing the functionality on all the target platforms you require.
I suggest looking into Acr User dialogs as it's a wonderful plugin that has served me quite well. It has a much broader set of UI elements you can use, but it still won't let you define any element that you want and display it in a popup, to do that, search for popup plugins for Xamarin.Forms. There are quite a few, but none work perfectly imho.

Related

Xamarin.Forms/FreshMVVM - Yes/no style popup

This is probably a quite silly question, but it nonetheless needs an answer:
I have created a small, custom MessageBox for my Xamarin.Forms project using Rg.Plugins.Popup - however, when trying to extend it to include a confirmation modal, I cannot find a way to detect whether the user has confirmed or cancelled the action from the popup.
Here's the code to open the popup
Message msgBox = new Message(); /*new instance of my Message wrapper class*/
msgBox.State = "msg_info";
msgBox.MessageTitle = "My_Message_Title";
msgBox.MessageText = "My_Message_Caption";
await CoreMethods.PushPopupPageModel<MessageBoxPageModel>(msgBox); /*using the FreshMVVM.Popup extension to navigate to the popup*/
/*need to check for confirmation here and delete the line or do nothing*/
So what I'm looking for, in short, is the appropriate way to detect whether the user has tapped the "Yes" or "No" button on the popup so I can, for example, delete a row from my database or not.
I looked into MessagingCenter but that seems to work from ViewModel to View, not ViewModel to ViewModel - Rg.Plugins.Popup suggest using a CallbackEvent, but CallbackEvents are, or so I've understood, not compatible with FreshMVVM/the MVVM pattern.
Just so this isn't kept open:
I ended up using a DevExpress Popup control as a Yes/No dialog - slightly less customization, but much more straightforward to use since I already had the DevExpress controls loaded.
Detail link for the DevExpress Popup control for those interested
https://docs.devexpress.com/MobileControls/DevExpress.XamarinForms.Popup.DXPopup

MFC:CDHtmlDialog Purpose/Usages to open other views?

I was thinking of writing a new app where a users selects an option of what procedure they want to perform and the view changes to that until done then goes back to the main menu. I came across CDHtmlDialog and looked like a nice easy way to add a nice looking menu using html. But I wonder if that is the purpose of that class? Can I set it up so when a button or graphic link is clicked it changes out the view to another one (I would need to use traditional things like CTreeView with CListView with a splitter) or is it more for staying within the HTML world?
Thanks.
From the MSDN MSDN documentation
CDHtmlDialog Class is used to create dialog boxes that use HTML rather than dialog resources to implement their user interface.
From what I can gather from your post, I think you should consider SDI application using view classes that you want. To switch views on the command you do not need a splitter window. A static splitter is used to display a number of views in a different part of the splitter simultaneously.

Xamarin master detail page with static header and context menu

I need to do a master detail layout page in Xamarin which then will be used in child pages.
Please check the screenshot below:
I need to have a header part with button for notifications and a button for context menu plus a header.
What is the best approach how I can create this layout in Xamarin?
I will assume that you want to use Xamarin.Forms, instead of using Xamarin.Android and Xamarin.iOS separately.
One approach would be to use default MasterDetailPage as described here or even better to try it with Shell as described here.
Then, you would need to create your CustomNavigationPage and write a custom renderer for it.
Second approach would be to do some tricks, again creating your CustomNavigationPage with template(so that the navigation bar is always displayed) and that you change content dynamically.
Also, you would need to hide default navigation bar and attach click events to your menu button to really open up the menu.
Hope you got it clearly.
MasterDetailPage already provides nearly all functionality that you have asked for, so in some way your question isn't quite clear as you already mention MasterDetailPage. The only remaining problem I can see is how to set up a custom header, and that is than with NavigationPage.TitleView.

How to show Menu in MasterDetail Page when using Prism and Custom Title bar

I am completely new to Xamarin.
I am working on a project where Prism framework is used for navigation (my first xamarin project) The requirement needed a custom title bar. I have implemented it as detailed out in this tutorial
https://wolfprogrammer.com/2016/07/07/custom-app-header-in-forms/
Now with prism navigation, how to show the masterdetail page menu i.e. set the IsPresented property of MasterPage to true when the user clicks the custom hamburger icon.
I have been reading about this for hours now and not able to understand any of the solutions mentioned nor are they working for me? Could someone please break it down for a complete beginner here?
Some links that I have referred so far
https://forums.xamarin.com/discussion/93409/prism-how-show-hide-programmatically-the-masterdetailpage-menu
https://github.com/PrismLibrary/Prism/issues/570
Just have a boolean property in your Master page's ViewModel, let's call it IsMenuPresented, then in your MasterPage XAML:
<MasterDetailPage
x:Class="YourProject.Views.MasterPage"
...
MasterBehavior="Popover"
IsPresented="{Binding IsMenuPresented, Mode=TwoWay}">
If you want to be able to toggle the menu from code, you can either:
1) do something like
(App.Current.MainPage is MasterDetailPage mainPage).IsPresented = true;
2) Use Prism's Event Aggregator to subscribe to an event in the Master Page's ViewModel that will listen for a true/false value that gets published from some other ViewModel and set IsMenuPresented accordingly (thereby showing/hiding the menu).

MVVM Cross ShowViewModel doesn't work on UWP with custom

I refer from this StackOverflow question, regarding to MVVM Light:
I am trying to have a hamburger menu style navigation (see this
sample). app by Microsoft on an example of how to do this) to:
1- have a convenient solution shared across all my pages. The sample
mentioned above uses an AppShell Page as the root of the app instead
of a Frame, that encapsulates the navigation menu and some behavior of
the back button. That would be ideal.
2- Use the MVVM-Light navigation service to handle all the navigation
from my view model conveniently.
Here is how the App.xml.Cs initializes the shell page onLaunched:
protected override void OnLaunched(LaunchActivatedEventArgs e)
{
var shell = Window.Current.Content as AppShell;
// Do not repeat app initialization when the Window already has content,
// just ensure that the window is active
if (shell == null)
{
// Create a AppShell to act as the navigation context and navigate to the first page
shell = new AppShell();
// Set the default language
shell.Language = ApplicationLanguages.Languages[0];
shell.AppFrame.NavigationFailed += OnNavigationFailed;
}
// Place our app shell in the current Window
Window.Current.Content = shell;
if (shell.AppFrame.Content == null)
{
// When the navigation stack isn't restored, navigate to the first page
// suppressing the initial entrance animation.
var setup = new Setup(shell.AppFrame);
setup.Initialize();
var start = Mvx.Resolve<IMvxAppStart>();
start.Start();
}
// Ensure the current window is active
Window.Current.Activate();
}
The thing is, as long as i navigate over the menu proviced by the AppShell everything works. But the ShowViewModel from MVVM Cross doesn't have any effect.
I thought there shouldn't be any difference if pass the shell as Frame or the frame set on the AppShell.
Does anyone have an idea what I can do about this or if there is an example with a working hamburger menu with MVVM cross?
The repository is open source on GitHub if you need an better overview or so.
https://github.com/Apply-Solutions/MoneyManager
I use MVVM Cross v4.0.0.0-beta1. Beta2 has currently another issue who prevents building in a UWP.
Thanks
NPadrutt
Not entirely sure what you are trying to do, but what you will probably need to navigate pages with a hamburger menu in a UWP app using MvvmCross as a framework, is a custom presenter, which handles the ShowViewModel method, and displays the associated view for the requested ViewModel in your hamburger container view.
Okey this embarrassing. The issue was that the View for the ViewModel couldn't be resolved. And the reason for that was that I didn't replace the inheritance from page to views:MvxWindowsPage.
With this, everything works with the default page presenter.
EDIT: in order to work with the navigation in the app shell, these pages need to be Pages. So you may either have to rewrite the navigation in the Appshell or may not adjust all Pages to MvxPage.

Resources