linux qt应用程序全屏,如何在Ubuntu手机中使得一个应用是全屏的应用

我们知道很多的开发者想把自己的应用设置为全屏的应用,这样可以使得应用能更多地占用屏幕的有效面积以使得自己的应用更好看。在默认的SDK的样板中,在应用的最上面,有一个“title”的地方占用很多的空间。对于一些应用来说,在主界面中,这个可能并不有用,但是对于使用PageStack的应用来说,这个区域显示一个向左的箭头以返回上一个页面的。 最近我也有这样的问题,我既想使用PageStack给予我的方便,又想拥有全屏的功能。在这篇文章中,我们来介绍如何做到全屏的应用。另外我们值得指出的是:我们的全屏的应用不能覆盖手机最上面的状态栏。

我们使用我们的Ubuntu SDK来创建一个最基本的应用(QML App with Simple UI)。

Main.qml的内容如下:

import QtQuick 2.0

import Ubuntu.Components 1.1

/*!

\brief MainView with a Label and Button elements.

*/

MainView {

// objectName for functional testing purposes (autopilot-qt5)

objectName: "mainView"

// Note! applicationName needs to match the "name" field of the click manifest

applicationName: "fullscreen.ubuntu"

/*

This property enables the application to change orientation

when the device is rotated. The default is false.

*/

//automaticOrientation: true

// Removes the old toolbar and enables new features of the new header.

useDeprecatedToolbar: false

width: units.gu(50)

height: units.gu(75)

Page {

title: i18n.tr("Simple")

Column {

spacing: units.gu(1)

anchors {

margins: units.gu(2)

fill: parent

}

Label {

id: label

objectName: "label"

text: i18n.tr("Hello..")

}

Button {

objectName: "button"

width: parent.width

text: i18n.tr("Tap me!")

onClicked: {

label.text = i18n.tr("..world!")

}

}

}

}

}

默认的情况下,我们运行我们的应用,显示如下:

941297a3451684924c61f42c51df44bc.png

4561408a5768ea663000e553f46a5925.png

从上面的图上可以看出来,无论是在手机或者是在手机上,有一个“Simple”的header在那里,占用一些空间。为了得到更多的空间,我们把Page的title设为空,也即:

import QtQuick 2.0

import Ubuntu.Components 1.1

/*!

\brief MainView with a Label and Button elements.

*/

MainView {

// objectName for functional testing purposes (autopilot-qt5)

objectName: "mainView"

// Note! applicationName needs to match the "name" field of the click manifest

applicationName: "fullscreen.ubuntu"

/*

This property enables the application to change orientation

when the device is rotated. The default is false.

*/

//automaticOrientation: true

// Removes the old toolbar and enables new features of the new header.

useDeprecatedToolbar: false

width: units.gu(50)

height: units.gu(75)

Page {

title: i18n.tr("")

Column {

spacing: units.gu(1)

anchors {

margins: units.gu(2)

fill: parent

}

Label {

id: label

objectName: "label"

text: i18n.tr("Hello..")

}

Button {

objectName: "button"

width: parent.width

text: i18n.tr("Tap me!")

onClicked: {

label.text = i18n.tr("..world!")

}

}

}

}

}

重新运行我们的应用:

c15aaf5cb6ed8b036a4bf4e80003a9b6.png

c9c77032930fe56edcd202fd662b704f.png

我们显然可以看到,“title”区域不见了。应用所占用的区间更大了。

不想使用PageStack的应用来说,我们也不必使用Page。我们可以直接使用如下的方法直接占用整个有效的屏幕区域:

import QtQuick 2.0

import Ubuntu.Components 1.1

/*!

\brief MainView with a Label and Button elements.

*/

MainView {

// objectName for functional testing purposes (autopilot-qt5)

objectName: "mainView"

// Note! applicationName needs to match the "name" field of the click manifest

applicationName: "fullscreen.ubuntu"

/*

This property enables the application to change orientation

when the device is rotated. The default is false.

*/

//automaticOrientation: true

// Removes the old toolbar and enables new features of the new header.

useDeprecatedToolbar: false

width: units.gu(50)

height: units.gu(75)

Rectangle {

anchors.fill: parent

color: "red"

}

}

928f0950d2b1d1586666d6bdf9ff28e2.png

c78184a531cb0f9f54aad8fccb22559e.png

通过这样的方法,我们就可以得到全屏的应用了。

0b1331709591d260c1c78e86d0c51c18.png

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值