如果在Ubuntu QML应用中在应用一启动时就得到屏幕的分辨率

对于有些应用来说，获取屏幕分辨率这个信息可能是重要的。比如有些游戏或阅读器应用，希望在应用启动后，马上得到屏幕的分辨率，这样可以和容易地适配不同屏幕尺寸的手机或装置。有些应用可以是用QtQuick.Window的Screen来得到这个信息，但是我们可以看一下在文章中如下的提醒：

Note that the Screen type is not valid at Component.onCompleted, because the Item or Window has not been displayed on a screen by this time.

这也就是说我们不能使用上述的方法来得到屏幕的尺寸。通过我的试验。显示的结果为“0”。

为了能够在应用启动时得到屏幕的分辨率，我们可以使用C++的代码来实现。

screen.h

#ifndef SCREEN_H
#define SCREEN_H

#include <QObject>
#include <QGuiApplication>
#include <QScreen>
#include <QDebug>

class Screen : public QObject
{
    Q_OBJECT

public:
    Q_PROPERTY(int height READ height)
    Q_PROPERTY(int width READ width)
    explicit Screen(QObject *parent = 0);
    int height() { return m_height; };
    int width() { return m_width; };

private:
    int m_height;
    int m_width;
};

#endif // FILEIO_H

screen.cpp

#include "screen.h"

Screen::Screen(QObject *parent) : QObject(parent)
{
	QScreen* screen = QGuiApplication::primaryScreen();
	QSize screenSize =  screen->size();
	qDebug() << "width: " << screenSize.width();
	m_width = screenSize.width();
	m_height = screenSize.height();
}

我们可以使用Ubuntu SDK提供的“QML App with C++ plugin (cmake)”来创建一个应用来测试。测试应用的代码如下：

import QtQuick 2.0
import Ubuntu.Components 1.1
import Screen 1.0
import QtQuick.Window 2.0

/*!
    \brief MainView with Tabs element.
           First Tab has a single Label and
           second Tab has a single ToolbarAction.
*/

MainView {
    // objectName for functional testing purposes (autopilot-qt5)
    objectName: "mainView"

    // Note! applicationName needs to match the "name" field of the click manifest
    applicationName: "screen.liu-xiao-guo"

    /*
     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(76)

    MyScreen {
        id: screen
    }

    Page {
        title: i18n.tr("App with backend")

        MyType {
            id: myType

            Component.onCompleted: {
                myType.helloWorld = i18n.tr("Hello world..")
            }
        }

        Column {
            spacing: units.gu(1)
            anchors {
                margins: units.gu(2)
                fill: parent
            }

            Label {
                id: label
                objectName: "label"

                text: myType.helloWorld
            }

            Button {
                objectName: "button"
                width: parent.width

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

                onClicked: {
                    myType.helloWorld = i18n.tr("..from Cpp Backend")
                }
            }
        }

        Component.onCompleted: {
            console.log("screen width: " + screen.width);
            console.log("screen height: " + screen.height);
            console.log("SCREEN width: " + Screen.width );
            console.log("SCREEN height: " + Screen.height)
        }
    }
}

我们应用的应用的输出为：

qml: screen width: 768
qml: screen height: 1280
qml: SCREEN width: 0
qml: SCREEN height: 0

我们可以看出来，MyScreen得到了正确的分辨率，但是“Screen.width”及“Screen.height”得到的是“０”。

整个项目的源码在：git clone https://gitcafe.com/ubuntu/screen.git