如何在Ubuntu手机中使得一个应用是全屏的应用 - Ubuntu.Components 1.3

在我先前的文章＂如何在Ubuntu手机中使得一个应用是全屏的应用＂，我已经介绍了如何在Ubuntu手机上实现一个全屏的应用．随着我们手机软件的演化．我们需要使用更高版本的Ubuntu.Components来实现我们所需要的功能．我们先前的trick再也不能使用了．在这篇文章中，我们将介绍如何在更高版本的Ubuntu.Components来实现Full View.

充分利用Ubuntu Component 1.3新的feature

我们可以参照 PageHeader tutorial文章来重新编写我们的例程如下：

Main.qml

import QtQuick 2.4
import Ubuntu.Components 1.3

/*!
    \brief MainView with a Label and Button elements.
*/

MainView {
    id: main
    // objectName for functional testing purposes (autopilot-qt5)
    objectName: "mainView"
    
    // Note! applicationName needs to match the "name" field of the click manifest
    applicationName: "headertest.liu-xiao-guo"
    
    width: units.gu(100)
    height: units.gu(85)
    
    Page {
        id: page
        header: Item { visible:false }
        
        Column {
            spacing: units.gu(1)
            anchors {
                margins: units.gu(2)
                fill: parent
            }
            
            Button {
                objectName: "button"
                width: parent.width
                
                text: i18n.tr("Tap me!")
                
                onClicked: {
                    main.headerColor = "red"
                    main.backgroundColor = "blue"
                    main.footerColor = "yellow"
                    page.header.visible = false
                }
            }
        }
    }
}

在这里，我们在我们的Page里设置了一个不可见的header，同时把它的可见属性设置为false：

header: Item { visible:false }

运行我们的应用：

  

整个项目的代码在： https://github.com/liu-xiao-guo/headertest. 更多关于Ubuntu UI toolkit的信息，可以在地址：

https://plus.google.com/u/0/communities/111350780270925540549

找到．另外值得指出的是：

1. 不要在应用中使用不同版本的Ubuntu Components 版本尽管在上面我们使用了这个trick
2. 在Ubuntu Components 1.1/1.2，可以使用page.title及page.head．对于Ubuntu Components 1.3来说，需要使用page.header来完成