px(像素):像素是指基本原色素及其灰度的基本编码。像素是构成数码影像的基本单元,通常以像素每英寸PPI(pixels per inch)为单位来表示影像分辨率的大小。

dp(与密度无关的像素):一种基于屏幕密度的抽象单位。在每英寸160点的显示器上,1dp = 1px。

计算公式: 1dp * 像素密度 / 160 = 实际像素数

下面是一个模板用于把dp转换成实际的像素值(px)。

// Units.qml
pragma Singleton
import QtQuick 2.0

/*!
   \qmltype units

   \brief Provides access to screen-independent units known as DPs (device-independent pixels).

   This singleton provides methods for building a user interface that automatically scales based on
   the screen density. Use the \l units::dp function wherever you need to specify a screen size,
   and your app will automatically scale to any screen density.

   Here is a short example:

   \qml
   import QtQuick 2.0
   import Material 0.1

   Rectangle {
       width: units.dp(100)
       height: units.dp(80)

       Label {
           text:"A"
           font.pixelSize: units.dp(50)
       }
   }
   \endqml

   Here is a short example too:

   \qml
   import QtQuick 2.0
   import "."

   Rectangle {
       width: units.dp(100)
       height: units.dp(80)

       Label {
           text:"A"
           font.pixelSize: units.dp(50)
       }
   }
   \endqml
*/
Object {
    id: units

    /*!
       \internal
       This holds the pixel density used for converting millimeters into pixels. This is the exact
       value from \l Screen:pixelDensity, but that property only works from within a \l Window type,
       so this is hardcoded here and we update it from within \l ApplicationWindow
    */
    property real __pixelDensity: 4.5 // pixels/mm

    function cm(number) {
        return number * __pixelDensity * 10
    }

    /*!
       Converts millimeters into pixels. Used primarily by \l units::dp, but there might be other
       uses for it as well.
    */
    function mm(number) {
        return number * __pixelDensity
    }

    function inch(number) {
        return number * __pixelDensity * 10 * 2.54
    }

    // 相对以视窗的宽度,视窗宽度是100vm
    function vw(i, width) {
        return number * (width / 100)
    }

    // 相对以视窗的高度,视窗高度是100vh
    function vh(number, height) {
        return number * (height / 100)
    }

    function vmin(number, width, height) {
        return number * (Math.min(width, height) / 100)
    }

    function vmax(number, width, height){
        return number * (Math.max(width, height) / 100)
    }

    function dp(number) {
        var px = Math.round(number * (__pixelDensity * 25.4 / 160));

        if(Qt.platform.os === "windows" || Qt.platform.os === "mac")
            return px * 2;
        else
            return px;
    }
}
// qmldir
module Material
singleton units 0.1 Units.qml
// Object.qml
import QtQuick 2.0

QtObject {
    id: object
    //default property alias data: object.__data
    //property list<QtObject> __data

    default property alias children: object.__childrenFix
    property list<QtObject> __childrenFix: [QtObject {}]
}

关于pointSize

从 pointSize 到 pixelSize 的计算公式: pixelSize = DPI * pointSize/72 。

参考链接:
px、dp和sp,这些单位有什么区别?
Difference between px, dp, dip and sp in Android?
DPI和PPI如何换算?:屏幕分辨率那些事儿

标签: Qt, Android, dp, px

添加新评论