Take the 2-minute tour ×
Ask Ubuntu is a question and answer site for Ubuntu users and developers. It's 100% free, no registration required.

I want switch from a Core Layout to a Full Screen Layout when clicking somewhere in the Core Layout.

I use

  • PageStack to get the switching with back button and stuff
  • Tabs to have something resembling the Core Layout out of the box and because I need it in the future to flick horizontally

My problem is, that PageStack introduces some dark header which is nowhere seen in the design pages. I modified Ubuntu.Components.PageStack to expose the header.visible property to fix this for my app in progress. I grepped through the example apps, for example the gallery-app, but found nothing useful. Maybe too much work around-code-there also.

So what is the canonical (schenkelklopf ) way of stacking Tabs and some full screen Page?

I guess it's just not quite ready yet etc. and inconsistencies are a temporal state right now arising from the development rush of Ubuntu?

As an example I made up this code:

import QtQuick 2.0
import Ubuntu.Components 0.1

MainView {
    width: units.gu(40)
    height: units.gu(71)
    PageStack {
        id: pageStack
        anchors.fill: parent
        Component.onCompleted: push(auberginePage)
        Tabs {
            id: auberginePage
            anchors.fill: parent
            Tab {
                title: "Awesome?"
                page: Rectangle {
                    anchors.fill: parent;
                    visible: false
                    color: "#2C001E"
                    MouseArea {
                        anchors.fill: parent;
                        onClicked: pageStack.push(orangePage)
        Rectangle {
            id: orangePage
            color: "#DD4814"
            visible: false
            anchors.fill: parent
share|improve this question

2 Answers 2

Simply set the title of the page that you want to be in fullscreen mode to an empty string, like this:

Page {
    title: ""

Easy as that!

share|improve this answer
Can someone check this? I don't have the SDK these days, but want to mark the correct answer, if it is one. –  payload Aug 14 '13 at 22:59
Not working for me, I get a rather buggy blank title area that covers up part of my content when I set the anchors.fill to parent. –  Jonah Mar 21 '14 at 2:30

I overlooked the __showHeader property and found it while reading other core apps.

pageStack.__showHeader = false

Hack not needed.

share|improve this answer
I've just tried to use this and got a deprecation warning. It didn't seem to work either. What's the correct way of doing this? Seeing as it's a core design pattern in the design guidelines there must be a supported way of doing it. –  danpalmer Jul 28 '13 at 1:45
Since March 5 this has changed, I believe. Didn't looked into it yet. –  payload Jul 31 '13 at 18:41

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.