GithubHelp home page GithubHelp logo

Push Page weird behavior about sextant HOT 10 CLOSED

reactiveui avatar reactiveui commented on April 28, 2024
Push Page weird behavior

from sextant.

Comments (10)

RLittlesII avatar RLittlesII commented on April 28, 2024

@LoneStar1994 After looking at your flow. This is working as I would expect it.

Sextant (like Xamarin Forms) has two distinct navigation stacks managed by the NavigationService. You can push and pop to these stacks independent of each other.

What your experiencing is a scenario where the developer has allowed the user to push multiple pages onto the modal stack. The user is then allowed to push a navigation page onto the stack. The page being pushed onto the Page Navigation stack, doesn't give it screen precedence (i.e. it doesn't display over the top of the modal pages). It is hidden behind the modal stack until the modal stack is cleared. This is why when you push the page, then pop the other two pages you are on the "Red Page".

This is useful for moments when you might want to push a modal, navigate away from the underlying screen, pop the modal so the user doesn't see two navigations.

The onus is on the developer to manage the navigation stack for the user.

Does this answer your question?

from sextant.

LoneStar1994 avatar LoneStar1994 commented on April 28, 2024

Alright! I'll try it out, thank you a lot.

from sextant.

LoneStar1994 avatar LoneStar1994 commented on April 28, 2024

I've been trying around with lots of different combinations but can't make it work... I belive that there is something behind the "IObservable" rutine that I'm missing. How do you implement this?:
(Sorry for being so annoying)
After that all you have to do is call one of the methods inside your ViewModels:

    /// <summary>
    /// Pops the <see cref="IPageViewModel"/> off the stack.
    /// </summary>
    /// <param name="animate">if set to <c>true</c> [animate].</param>
    /// <returns></returns>
    IObservable<Unit> PopModal(bool animate = true);

    /// <summary>
    /// Pops the <see cref="IPageViewModel"/> off the stack.
    /// </summary>
    /// <param name="animate">if set to <c>true</c> [animate].</param>
    /// <returns></returns>
    IObservable<Unit> PopPage(bool animate = true);

    /// <summary>
    /// Pushes the <see cref="IPageViewModel"/> onto the stack.
    /// </summary>
    /// <param name="modal">The modal.</param>
    /// <param name="contract">The contract.</param>
    /// <returns></returns>
    IObservable<Unit> PushModal(IPageViewModel modal, string contract = null);

    /// <summary>
    /// Pushes the <see cref="IPageViewModel"/> onto the stack.
    /// </summary>
    /// <param name="page">The page.</param>
    /// <param name="contract">The contract.</param>
    /// <param name="resetStack">if set to <c>true</c> [reset stack].</param>
    /// <param name="animate">if set to <c>true</c> [animate].</param>
    /// <returns></returns>
    IObservable<Unit> PushPage(IPageViewModel page, string contract = null, bool resetStack = false, bool animate = true);

from sextant.

RLittlesII avatar RLittlesII commented on April 28, 2024

Cannot make what work exactly?

  • What is the use case that you are solving that you are unable to accomplish?
  • What is your expected result?

The code you referenced is either the NavigationView or the ViewStackService both of which are sourced in this project, so you can view the implementations.

from sextant.

LoneStar1994 avatar LoneStar1994 commented on April 28, 2024

1.- I'm trying to do what you suggested, to clear the stacklayout. And I thought that using the "IObservable" implementation I could make it work, cus I see you have a "ResetStack" option, which I belive is what I need... some how...

2.- I have two modal pages. a "Login" page and a "Home" page... my idea is to PushModal from Login to Home and then push pages from homes... but everytime I pushpages from home they wont appear but next to the "LoginPage". So I expect to "flush" the stackview to prevent Loggin page to appear when pressing "back button" and also poping all pages to the second modal page...

from sextant.

RLittlesII avatar RLittlesII commented on April 28, 2024

If you could provide a sample repository to show what you are attempting that would be great.

I will go back to there are two navigation stacks that are not aware of each other.

I think the problem (this is without having looked at any code sample) is that your expectation of how modals work in Xamarin.Forms. More specifically as the Xamarin Forms Modal Navigation docs state, modals must be explicitly dismissed from the screen.

If you push something onto the modal stack, it must be dismissed by the user (Popped from the modal stack) before elements on the Page Navigation stack are seen. Unless I am wrong, you cannot push a Page to the Page stack from a modal page.

So I believe in the example you just provided, you would need to Pop the login page from the Modal Stack and then Push a Navigation Page to the PageStack. You are attempting to start navigation from a modal page which I am not sure is possible. And if it is in Xamarin Forms, then it would be a limitation of this library that you cannot currently do this.

when you set Current.MainPage = new NavigationPage(new Page()); in your App.xaml.cs of a Xamarin.Forms application, you aren't pushing a modal, you are setting a page that is wrapped in a navigation page to MainPage of the app.

Does that make sense?

Have you tried your same example in Xamarin.Forms just by using the INavigation interface? I'd be interested if a Modal Page allows you to go directly into Hierarchical Navigation.

Additional reading

from sextant.

LoneStar1994 avatar LoneStar1994 commented on April 28, 2024

Hi!

Finally I decided just to push and pop modals and get rid of the pages... maybe I'm not understanding quite well the difference between a Modal and a Page.

What I did was to set up the "Tool Bar" with a "Back" button wich does the "PopModal" thing.

The Logger starts and after a right login it pushes the home page as a modal. Then the Home page pushes the rest of the pages as modals.

But still is a great thing what you have here. Its pretty simple to use. Big big thank you for all your help

from sextant.

RLittlesII avatar RLittlesII commented on April 28, 2024

Modal Page
Hierarchical Navigation

A modal is generally a page that is put in front of the user that demands attention. Think of a JavaScript pop up that comes out and forces the user to interact. The actual page you are on still functions in the background, but you can't interact with it until you dismiss the modal in front of you. It isn't apples to apples, but that is the gist.

When you push a modal, you can push as many as you want onto a stack specifically for Modal Pages. All the Hierarchical pages still exist behind all the modals, but until the modals are dismissed, the user cannot interact with them. I explicitly call out the user interaction because the developer can still push and pop pages from the Hierarchical stack while modals are presented to the user.

Have you figured out how to setup your navigation?

from sextant.

LoneStar1994 avatar LoneStar1994 commented on April 28, 2024

Oh!! I Get It!!

So you use this "Modal" as a substitute for the "Master Detail" where "Master" is the Pop Modal" and the "Page" is just the subordinated of the root page... So that is why you cannot push pages from a modal! because modal is an auxiliar page but not ment to act as a "Main Page wich pushes subpages"...

If that is so then I think I'm getting the deal here.

from sextant.

RLittlesII avatar RLittlesII commented on April 28, 2024

Awesome. Glad you're headed down the right path. I am going to close this issue. If you have anything else, feel free to reopen, or create a new issue.

from sextant.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.