QML怎麼適配不一樣的設備

前言

作嵌入式和移動開發,不一樣的設備,不一樣的分辨率須要UI可以適配,這是一個很現實的問題。QML做爲Qt中爲UI而生的,使用QML必定要解決適配的問題。markdown

分辨率

如今同一尺寸的屏幕,其分辨率也是不一樣,在QML中使用 anchors 進行相對的佈局時,其是以像素爲單位。如今有一個概念,叫作每英寸像素數目。當設備的PPI不一樣時,控件的大小不一樣,這可能致使,若是設計是在一個尺寸小PPI低的屏幕上設計,將程序放到一個尺寸大PPI高的設備上,那麼控件看上去就更小了,因此在QML中直接使用像素佈局是不可取的。佈局

Screen

QML中提供的Screen爲咱們提供了設備相關的數據,其中很重要的是DPI(Devices per mm pixel),設備每毫米的像素點,經過這個咱們就能夠以mm爲標準來作佈局,這樣咱們就不會出現,在高分辨率的設備上,控件變得很小。spa

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

設備一個屬性,取兩個小數點。那麼能夠這樣設置設計

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

這個控件離parent上部 2mm,無論在那個設備上,其表現都是同樣的,那麼對於控件的長和寬表現也是同樣的。code

咱們設計界面的時候確定在一個尺寸上設計,那麼若是換了一個很大的設備,那麼控件就不適合了,那麼咱們須要有一點伸縮性。開發

伸縮

Screen.height和Screen.width爲當前的顯示設備的長和寬,可是他們是像素,獲得實際的尺寸,須要除以dpi。
假設咱們設計的時候的長和寬爲a和b,運行時獲得的長和寬爲c和d。
那麼在佈局的時候就應該是這樣的it

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

那麼對於控件的長和寬也是同樣的,這樣咱們就實現了在不一樣的設備上實現控件和控件間隔隨尺寸大小不一樣伸縮。class

相關文章
相關標籤/搜索