陳艷軍++溫占考++王巍

摘要：該文主要分析了當(dāng)前移動開發(fā)中所遇到的問題，及解決這些問題的辦法。重點(diǎn)闡述了Flash Builder在移動開發(fā)中的開發(fā)過程。以Android系統(tǒng)中地圖應(yīng)用為例，詳細(xì)的說明了開發(fā)的方法，在開發(fā)中針對地圖在手機(jī)橫豎屏切換下所產(chǎn)生的問題，給出了較好的解決方法，對相關(guān)開發(fā)人員有較大的參考價值。

關(guān)鍵詞：Flash Builder；移動開發(fā)；Android；橫豎屏切換

中圖分類號：TP311 文獻(xiàn)標(biāo)識碼：A 文章編號：1009-3044（2014）15-3514-04

移動互聯(lián)正如火如荼的高速發(fā)展，移動開發(fā)也成為目前最熱門的技術(shù)之一。在2012及2013年全球智能手機(jī)操作系統(tǒng)中，市場份額的占有量見表1。

表1 全球智能移動手機(jī)操作系統(tǒng)市場份額占有率

從該表可以看出，智能手機(jī)操作系統(tǒng)占據(jù)主體地位的有Android和iOS，其市場份額達(dá)到了94.4%。其中Android系統(tǒng)的開發(fā)語言為Java，而iOS的開發(fā)語言為Objective-C，并且他們的開發(fā)模式也不盡相同。這種情況就給開發(fā)者提出了一個問題。如果開發(fā)的移動App要支持主流的智能手機(jī)，至少需要維護(hù)兩個以上的團(tuán)隊(duì)。對于開發(fā)者來說，這顯然是一個大問題。由于實(shí)力和效率等因素，很多開發(fā)者被迫只能選擇支持其中一種操作系統(tǒng)。針對這種情況，目前有沒有比較好的解決辦法呢？

答案是肯定的，當(dāng)前有兩種比較適用的方法，一種是采用HTML5來開發(fā)移動應(yīng)用。由于Android和iOS都支持HTML5，所以這是一個比較方便的做法，目前成熟的開發(fā)框架也比較多，像國外的PhoneGap和國內(nèi)的AppCan都是一個用基于HTML，CSS和JavaScript的，創(chuàng)建移動跨平臺移動應(yīng)用程序的快速開發(fā)平臺。其缺點(diǎn)是對HTML5、CSS的支持并沒有一個統(tǒng)一的標(biāo)準(zhǔn)，存在兼容性等問題。

另一種解決辦法是利用Adobe公司AIR架構(gòu)來完成移動應(yīng)用的跨平臺開發(fā)。其開發(fā)工具是Flash Builder，它可以為Android平臺構(gòu)建移動Flex應(yīng)用程序。也可以為Android和 iOS構(gòu)建移動ActionScript應(yīng)用程序。其優(yōu)點(diǎn)是可以輕松地生成豐富的圖表， 而且Flash畢竟有著卓越的圖形表現(xiàn)力。缺點(diǎn)是智能手機(jī)操作系統(tǒng)需要Adobe AIR的運(yùn)行庫支持，運(yùn)行效率較原生態(tài)的開發(fā)要低一些。

本文以Flash Builder 4.7為例，將介紹其在Android環(huán)境下的開發(fā)過程及實(shí)例應(yīng)用。

1 Flash Builder手機(jī)項(xiàng)目

Flash Builder目前開發(fā)移動應(yīng)用有兩種模式，一種是Flex手機(jī)項(xiàng)目，該項(xiàng)目包含MXML類庫，它能很方便的用于開發(fā)企業(yè)應(yīng)用，提供了許多易用的數(shù)據(jù)綁定方式，頁面布局相關(guān)的標(biāo)準(zhǔn)類等。另一種是ActionScript手機(jī)項(xiàng)目，是指純ActionScript代碼項(xiàng)目，不可以依賴圖形編輯界面，目前大部分的移動應(yīng)用都采用這種方式。這兩種模式都能很方便的導(dǎo)入SWC及嵌入SWF資源，但Flex手機(jī)項(xiàng)目比ActionScript手機(jī)項(xiàng)目運(yùn)行效率要低一些。

在Flash Builder平臺下，新建Flex手機(jī)項(xiàng)目，如圖1。

新建一個名為MapEg的項(xiàng)目，其新建項(xiàng)目的過程主要有項(xiàng)目位置、手機(jī)設(shè)置、服務(wù)器設(shè)置、構(gòu)建路徑四個步驟。其對框平臺的支持主要體現(xiàn)在步驟2，手機(jī)設(shè)置上，如圖2。

目前Flash Builder 4.7版本手機(jī)目標(biāo)平臺支持Apple iOS和Google Android。勾選開發(fā)者需要的目標(biāo)平臺即可。在創(chuàng)建完Flex手機(jī)項(xiàng)目后就可以在生成的框架下進(jìn)一步完成移動App的開發(fā)。

2 Flash Builder開發(fā)手機(jī)地圖實(shí)例

在上述創(chuàng)建的Flex手機(jī)項(xiàng)目中，以手機(jī)地圖為例，來完成一個手機(jī)地圖的應(yīng)用開發(fā)。該文使用百度地圖的Flash API，它是一套由ActionScript3.0語言編寫的應(yīng)用程序接口，能夠在Flex/Flash和Mobile Flex/Flash項(xiàng)目中快速的構(gòu)建地圖應(yīng)用。需要把百度開發(fā)的BMap.swc拷貝至項(xiàng)目libs文件夾中。

在自動生成的MXML文件中加入代碼，代碼如下：

<？xml version="1.0" encoding="utf-8"？>

xmlns：s="library：//ns.adobe.com/flex/spark"

xmlns：mx="library：//ns.adobe.com/flex/mx"

show="init（）"

title="手機(jī)地圖">

<！[CDATA[

import baidu.map.basetype.LngLat；

import baidu.map.basetype.Size；

import baidu.map.core.Map；

import baidu.map.layer.Layer；

import baidu.map.layer.RasterLayer；

private var map：Map；

protected function init（）：void

{

//創(chuàng)建map對象，并設(shè)置地圖對象的大小

map = new Map（new Size（bdmap.width，bdmap.height））；

//把地圖對象加入舞臺

bdmap.addChild（map）；

//初始化Map的中心點(diǎn)和顯示級別

map.centerAndZoom（new LngLat（116.403865， 39.915177）， 16）；

//添加地圖的底圖

var layer：Layer = new RasterLayer（"BaiduMap"， map）；

map.addLayer（layer）；

}

]] >

手機(jī)上運(yùn)行的結(jié)果如圖3。

圖3 手機(jī)地圖豎屏運(yùn)行效果

3 手機(jī)地圖橫豎屏切換的問題

由于智能手機(jī)都支持橫豎屏的切換，在上述開發(fā)的地圖應(yīng)用，切換成橫屏幕的效果如圖4。

發(fā)現(xiàn)地圖顯示不全，這是由于百度Flash API中Map類在實(shí)例化的時候，把地圖的寬、高都固定好了，當(dāng)手機(jī)橫豎屏切換的時候，地圖的寬、高不能適應(yīng)變化。所以橫屏的狀態(tài)下，地圖顯示不全，直接影響了使用效果。

4 橫豎屏切換問題的改進(jìn)

為了能夠比較好的解決這個問題，我們需要對程序進(jìn)行優(yōu)化。在View中添加事件resize="resizeHandler（event）"，在腳本區(qū)添加事件代碼：

private function resizeHandler（event：ResizeEvent）：void

{if（map ！= null）

{if（navigator.width > navigator.height）

{//橫屏

map.width = Capabilities.screenResolutionY；

map.height = Capabilities.screenResolutionX；

}else{

//豎屏

map.width = Capabilities.screenResolutionX；

map.height = Capabilities.screenResolutionY；

}}}

這樣修改后，在手機(jī)終端運(yùn)行后得到的效果如圖5。

5 總結(jié)

在移動開發(fā)中，由于涉及到多種操作系統(tǒng)，各種操作系統(tǒng)的開發(fā)技術(shù)均不同，開發(fā)者要維護(hù)各大移動系統(tǒng)的開發(fā)將花費(fèi)大量的時間與資源。采用Flash Builder的AIR架構(gòu)來開發(fā)移動應(yīng)用將顯得事倍功半。其可利用的資源也比較豐富，特別在圖形動畫方便的特效，開發(fā)起來非常的方便。該文以手機(jī)地圖為例，較為詳細(xì)的分析了開發(fā)中遇到橫豎屏切換的問題，以及解決的辦法，對相關(guān)開發(fā)人員有一定的啟發(fā)意義。

參考文獻(xiàn)：

[1] Android市場占有率上升而iOS小幅下降[EB/OL].http：//mobile.163.com/14/0131/09/9JTJVSQ10011179O.html.

[2] 跨平臺移動應(yīng)用開發(fā)： AIR， PhoneGap， Titanium [EB/OL].http：//blog.sina.com.cn/s/blog_4ba0876e01012tal.html.

[3] Adobe[EB/OL].http：//www.adobe.com.

//初始化Map的中心點(diǎn)和顯示級別

map.centerAndZoom（new LngLat（116.403865， 39.915177）， 16）；

//添加地圖的底圖

var layer：Layer = new RasterLayer（"BaiduMap"， map）；

map.addLayer（layer）；

}

]] >

手機(jī)上運(yùn)行的結(jié)果如圖3。

圖3 手機(jī)地圖豎屏運(yùn)行效果

3 手機(jī)地圖橫豎屏切換的問題

由于智能手機(jī)都支持橫豎屏的切換，在上述開發(fā)的地圖應(yīng)用，切換成橫屏幕的效果如圖4。

發(fā)現(xiàn)地圖顯示不全，這是由于百度Flash API中Map類在實(shí)例化的時候，把地圖的寬、高都固定好了，當(dāng)手機(jī)橫豎屏切換的時候，地圖的寬、高不能適應(yīng)變化。所以橫屏的狀態(tài)下，地圖顯示不全，直接影響了使用效果。

4 橫豎屏切換問題的改進(jìn)

為了能夠比較好的解決這個問題，我們需要對程序進(jìn)行優(yōu)化。在View中添加事件resize="resizeHandler（event）"，在腳本區(qū)添加事件代碼：

private function resizeHandler（event：ResizeEvent）：void

{if（map ！= null）

{if（navigator.width > navigator.height）

{//橫屏

map.width = Capabilities.screenResolutionY；

map.height = Capabilities.screenResolutionX；

}else{

//豎屏

map.width = Capabilities.screenResolutionX；

map.height = Capabilities.screenResolutionY；

}}}

這樣修改后，在手機(jī)終端運(yùn)行后得到的效果如圖5。

5 總結(jié)

在移動開發(fā)中，由于涉及到多種操作系統(tǒng)，各種操作系統(tǒng)的開發(fā)技術(shù)均不同，開發(fā)者要維護(hù)各大移動系統(tǒng)的開發(fā)將花費(fèi)大量的時間與資源。采用Flash Builder的AIR架構(gòu)來開發(fā)移動應(yīng)用將顯得事倍功半。其可利用的資源也比較豐富，特別在圖形動畫方便的特效，開發(fā)起來非常的方便。該文以手機(jī)地圖為例，較為詳細(xì)的分析了開發(fā)中遇到橫豎屏切換的問題，以及解決的辦法，對相關(guān)開發(fā)人員有一定的啟發(fā)意義。

參考文獻(xiàn)：

[1] Android市場占有率上升而iOS小幅下降[EB/OL].http：//mobile.163.com/14/0131/09/9JTJVSQ10011179O.html.

[2] 跨平臺移動應(yīng)用開發(fā)： AIR， PhoneGap， Titanium [EB/OL].http：//blog.sina.com.cn/s/blog_4ba0876e01012tal.html.

[3] Adobe[EB/OL].http：//www.adobe.com.

//初始化Map的中心點(diǎn)和顯示級別

map.centerAndZoom（new LngLat（116.403865， 39.915177）， 16）；

//添加地圖的底圖

var layer：Layer = new RasterLayer（"BaiduMap"， map）；

map.addLayer（layer）；

}

]] >

手機(jī)上運(yùn)行的結(jié)果如圖3。

圖3 手機(jī)地圖豎屏運(yùn)行效果

3 手機(jī)地圖橫豎屏切換的問題

由于智能手機(jī)都支持橫豎屏的切換，在上述開發(fā)的地圖應(yīng)用，切換成橫屏幕的效果如圖4。

發(fā)現(xiàn)地圖顯示不全，這是由于百度Flash API中Map類在實(shí)例化的時候，把地圖的寬、高都固定好了，當(dāng)手機(jī)橫豎屏切換的時候，地圖的寬、高不能適應(yīng)變化。所以橫屏的狀態(tài)下，地圖顯示不全，直接影響了使用效果。

4 橫豎屏切換問題的改進(jìn)

為了能夠比較好的解決這個問題，我們需要對程序進(jìn)行優(yōu)化。在View中添加事件resize="resizeHandler（event）"，在腳本區(qū)添加事件代碼：

private function resizeHandler（event：ResizeEvent）：void

{if（map ！= null）

{if（navigator.width > navigator.height）

{//橫屏

map.width = Capabilities.screenResolutionY；

map.height = Capabilities.screenResolutionX；

}else{

//豎屏

map.width = Capabilities.screenResolutionX；

map.height = Capabilities.screenResolutionY；

}}}

這樣修改后，在手機(jī)終端運(yùn)行后得到的效果如圖5。

5 總結(jié)

在移動開發(fā)中，由于涉及到多種操作系統(tǒng)，各種操作系統(tǒng)的開發(fā)技術(shù)均不同，開發(fā)者要維護(hù)各大移動系統(tǒng)的開發(fā)將花費(fèi)大量的時間與資源。采用Flash Builder的AIR架構(gòu)來開發(fā)移動應(yīng)用將顯得事倍功半。其可利用的資源也比較豐富，特別在圖形動畫方便的特效，開發(fā)起來非常的方便。該文以手機(jī)地圖為例，較為詳細(xì)的分析了開發(fā)中遇到橫豎屏切換的問題，以及解決的辦法，對相關(guān)開發(fā)人員有一定的啟發(fā)意義。

參考文獻(xiàn)：

[1] Android市場占有率上升而iOS小幅下降[EB/OL].http：//mobile.163.com/14/0131/09/9JTJVSQ10011179O.html.

[2] 跨平臺移動應(yīng)用開發(fā)： AIR， PhoneGap， Titanium [EB/OL].http：//blog.sina.com.cn/s/blog_4ba0876e01012tal.html.

[3] Adobe[EB/OL].http：//www.adobe.com.