[pageStack] show the wrong toolBar when going back from a Tab

[londumas]

Sorry for the title it is hard to explain.

So When you have two tabs, one is a pageStack with two pages with a different toolBar on each and the other a simple page, if you leave the pageStack tab for the page tab and then go back to it the page shown is the good one in the pageStack but the toolBar isn't.

See the file: look the toolBar there is a button "button1", change for tab "page" then go back to "pageStack" observe that now the toolBar shows "Button2" but the page on the stack is still "page1".

The ToolBar shown should be the one of the "currentPage", not another.

I hope someone can understand this difficult bug.

[edit] code is in comment #12

[Nekhelesh Ramananthan (nik90)]

I can fully confirm this when trying to implement pagestack in the clock app. So my situation is described as follows. I have 4 tabs Clock, Timer, Stopwatch and Alarm. In the clock tab, I need to show the clock in one page, and the world city list in another page (deep navigation). So I added these pages in a pagestack which in itself is inside the clock tab. On switching to the timer tab (which has a ordinary page) and then switching back to the clock tab, I notice that the toolbar shown is that of the timer tab and not the clock tab.

[Nekhelesh Ramananthan (nik90)]

@Helion, you included the wrong file by mistake. Could you attach the .qml files instead of the .qmlproject file?

[Tim Peeters (tpeeters)]

having a stack inside tabs is currently not supported, I think design does not like to have that. Can you give a use case and discuss with a designer if that is the way to go?

Having Tabs inside a PageStack should work, but is currently not working because of this bug: https://bugs.launchpad.net/ubuntu-ui-toolkit/+bug/1187850
I am working on that bug.

[Nekhelesh Ramananthan (nik90)]

If you take a look at the clock app designs provided at http://design.canonical.com/2013/03/app-patterns-applied-clock-key-journeys/ for adding a city, you will notice that while we are in the clock tab, the user is able to press the edit button to add a city. When the edit button is pressed, a new page is shown with a search box to enter the city the user wants to search and add. Hence the use case for a pagestack within a tab. There is also a similar requirement for alarms and timer. If you want to create an alarm, a new page is shown with the new alarm options.

[David Planella (dpm)]

Tim, I agree with Nekhelesh. My understanding from bug 1187850 ("Page stack header within a tab...") is that PageStacks inside a tab are supported by design.

I'm not sure about having Tabs inside a PageStack, I understand that that bug is for the other way round.

[Tim Peeters (tpeeters)]

if you push a new page, and the tabs header is no longer available (you cannot switch tabs before going back in the pagestack), I consider that as Tabs inside the PageStack. Perhaps it is just the terminology that is different.

I see in the clock journey that when you are in the "add city" page, you cannot switch tabs. You have to push "back" first on the toolbar, and then you go back to the Tabs. Do you think this bug differs from https://bugs.launchpad.net/ubuntu-ui-toolkit/+bug/1187850 ?

[Tim Peeters (tpeeters)]

A change we are considering is to always have one pagestack available (from the MainView) where you can push a Page or a PageStack, and not give the possibility to add a PageStack (for example inside a Page or inside Tabs). That would remove the confusion about the order (PageStack in Tabs or Tabs in PageStack). What do you think of that?

[Tim Peeters (tpeeters)]

correction for my previous comment: "always to have one pagestack available (from the MainView) where you can push a Page or Tabs," (<-- Tabs, not PageStack).

[David Planella (dpm)]

But then it wouldn't be possible to have PageStacks at all?

In any case, here's my use case for PageStacks inside Tabs, in case it helps (click on the list items in the diagram to go to the next page):

https://ubuntu.mybalsamiq.com/projects/qreator/Creator%20%28Tabs%20version%29

[Nekhelesh Ramananthan (nik90)]

Tim, whether it is bug https://bugs.launchpad.net/ubuntu-ui-toolkit/+bug/1187850 or this one, our objective or request is that a pagestack be implementable inside a tab. As you saw yourself, in the add city design, it is basically a new page, while the clock is in another page. Both these pages are housed in the clock tab. So it is necessary for pagestack to be possible inside a tab. That's what this bug is all about.

[londumas (helion331990)]

@Nik90 Sorry, Here the good one

[londumas (helion331990)]

It is different from bug 1187850 since the fix has been committed but the bug is stil there.

[Katie Taylor (katie-t)]

Hello!
Sorry we in design have taken a long time to reply to this bug!
And sorry to Nekhelesh and David for any confusion...

* Page Stack and Tabs should not be used in the same view. (http://design.ubuntu.com/apps/global-patterns/navigation)

* In the Clock app, adding a location should be achieved by using the sheet pattern - this aligns with the Weather app.

* The sheet design should be updated to the new visual, but the component with the old visual is in the toolkit already.

[Katie Taylor (katie-t)]

Posting reference Calum's reply to one of the other bugs:

"Yes by that we meant not to have a back button and tabs on the same screen. I have updated the description here : http://design.ubuntu.com/apps/global-patterns/navigation

When we need to use deep navigation, for example when the user taps on a piece of content from a tabbed view, the header will update to represent the new view.

The page stack (deep navigation) introduces a back button which, when combined with tabs (flat navigation) in the same view, could be misinterpreted as another method for navigating between tabs."

[Michael Zanetti (mzanetti)]

Katie Taylor wrote:
> Yes by that we meant not to have a back button and tabs on the same screen. I have
> updated the description here : http://design.ubuntu.com/apps/global-patterns/navigation
>
> The page stack (deep navigation) introduces a back button which, when combined with
> tabs (flat navigation) in the same view, could be misinterpreted as another method for
> navigating between tabs.

I really don't think it is a problem to misinterpret the back button as a back button for the tabs. There is no such thing as "back" in tabs. Also, the back button only appears once you actually tapped on something that enters the page stack.

> When we need to use deep navigation, for example when the user taps on a piece of content
> from a tabbed view, the header will update to represent the new view.

Take this use case: You have an app with 2 tabs. For example a media player. The first tab is to browse the media library, the second one the NowPlaying view with back/next skip buttons. You listen to some music. At the same time you want to browse the library, so you go to tab 1. You enter music -> artists -> some artist -> some album and read through the list of songs. Now the song played in the background changes to a song you don't like. You quickly switch to tab 2, press the skip button, go back to tab 1 and continue browsing. By not allowing this, the flow would look like this:

press back, press back, press back, press back, click on tabs bar, select tab 2, skip the song, click on tabs bar, select tab 1, press music, press artists, scroll the list to find the previous artist again, press the artist, press some album.

Tim Peters wrote:
> "always to have one pagestack available (from the MainView) where you can push
> a Page or Tabs," (<-- Tabs, not PageStack).

Tim, this way round, having Tabs inside a PageStack, that's the really confusing thing imho. Because you start off by entering a stack and at some point tabs will appear. Also, if those tabs now can't have a back button, how will you ever be able to exit that Tabs thing again and go back up the page stack?

To me it seems perfectly natural to have tabs when the app starts up and inside those tabs you can navigate content using the PageStack... Actually I did that in all my apps so far because I could never have imagined this could be a "not supported" thing to do.