QML怎么适配不一样的设备

前言

作嵌入式和移动开发，不一样的设备，不一样的分辨率须要UI可以适配，这是一个很现实的问题。QML做为Qt中为UI而生的，使用QML必定要解决适配的问题。

分辨率

如今同一尺寸的屏幕，其分辨率也是不一样，在QML中使用 anchors 进行相对的布局时，其是以像素为单位。如今有一个概念，叫作每英寸像素数目。当设备的PPI不一样时，控件的大小不一样，这可能致使，若是设计是在一个尺寸小PPI低的屏幕上设计，将程序放到一个尺寸大PPI高的设备上，那么控件看上去就更小了，因此在QML中直接使用像素布局是不可取的。

Screen

QML中提供的Screen为咱们提供了设备相关的数据，其中很重要的是DPI(Devices per mm pixel)，设备每毫米的像素点，经过这个咱们就能够以mm为标准来作布局，这样咱们就不会出现，在高分辨率的设备上，控件变得很小。

property real dpi: Screen.pixelDensity.toFixed(2)

设备一个属性，取两个小数点。那么能够这样设置

anchors {top:parent.top; topMargin: 2 * dpi;}

这个控件离parent上部 2mm，无论在那个设备上，其表现都是同样的，那么对于控件的长和宽表现也是同样的。

咱们设计界面的时候确定在一个尺寸上设计，那么若是换了一个很大的设备，那么控件就不适合了，那么咱们须要有一点伸缩性。

伸缩

Screen.height和Screen.width为当前的显示设备的长和宽，可是他们是像素，获得实际的尺寸，须要除以dpi。
假设咱们设计的时候的长和宽为a和b，运行时获得的长和宽为c和d。
那么在布局的时候就应该是这样的

anchors {top:parent.top; topMargin: 2 * dpi * (d/b);}

那么对于控件的长和宽也是同样的，这样咱们就实现了在不一样的设备上实现控件和控件间隔随尺寸大小不一样伸缩。