Qt移動應用開發（一）：適配不同的屏幕

         到眼下為止。Qt5.3已經出現非常長一段時間了。而且已經有一些應用使用Qt進行構建了。我自己也完畢了第一款使用Qt構建的手機游戲《吃葯了》。那么接下來的幾篇文章主要向大家分享我是如何使用Qt進行移動開發的。Qt移動應用開發分為多篇博客文章，每一篇文章都力求精簡不羅嗦。力求為大家提供一個快捷的參考。我在這里也主要將使用Qt制作《吃葯了》的方法技巧一一分享給大家。

         說到移動應用開發，第一想到的就是Android了，的確。

Digia事實上在為Qt制定向移動進軍的道路的時候充分地考慮了眼下移動市場。首先Android是開源的，可以爭取到非常多軟硬件廠商，其次iOS是一款優秀的移動操作系統。最后Windows Phone 7/8也蓄勢待發，因此Digia主要在Qt5.0的時候引入了QPA的概念。這讓平台適配變得easy起來；Qt5.1的時候實現了Android操作系統的適配；Qt5.2的時候實現了iOS系統的適配；Qt5.3的時候實現了Windows Phone的適配。當然一些小眾移動開發平台比方說BB10、Ubuntu Phone和Jolla則是倒貼到Qt上來了。所以至此Qt已經可以適應絕大多數移動平台，再加上嵌入式領域的一枝獨秀，Qt其實已經成為適配平台最多的框架了。

         只是，哪怕是適配Android一個平台，因為Android系統的碎片化以及Android應用是獨占屏幕大小的，導致開發人員在開發應用的時候不得不考慮屏幕的分辨率。那么Qt是怎樣想辦法實現的不同屏幕的適配呢？假設你是使用純C++開發的Qt框架。那么我的另外一篇文章能夠幫助你。如今我主要介紹一下QML是怎樣解決的。

1、使用錨布局方式

         QML使用了一種叫錨布局（anchorlayout）的布局方式，這就好比是知道了某個控件的相對位置，然后另外一個控件使用錨布局的方式非常快就知道依據此控件該怎樣擺放。比方說這個截圖：

         右下角的“copyright@jcystudio”就是使用錨布局進行排列的：

Text
{
         anchors.bottom:parent.bottom
         anchors.right:parent.right
         text:"copyright©jcystudio"
}

2、使用Screen來獲取屏幕分辨率 

使用錨布局可能還不夠，由於圖片等元素一旦碰上了小分辨率的屏幕就會顯示不全。這種用戶體驗是非常差的。須要縮放才行。那么問題就轉化為怎樣知道屏幕的分辨率大小呢？這里我們採用QtQuick.Window 2.1中的Screen類。即使用Screen.width和Screen.height來獲取獲取屏幕的大小。

         最后分享一下我開發《吃葯了》Android和桌面版適配屏幕分辨率的方法：

Window
{
   id: root
   width: Qt.platform.os === "android"?
 Screen.width: 320
   height: Qt.platform.os === "android"?
 Screen.height: 480
……
}

         這段代碼的意思是假設當前的操作系統是Android。那么使用Android屏幕的原始分辨率。否則的話採用的是320×480的配置。

以下是兩幅圖的對照：

以下是還有一個我開發的應用適配不同分辨率的對照：

         本文已參加《CSDN博文大賽》，請投我一票，支持很多其它Qt移動開發的原創內容！