ionic2android

1. 如何快速地開發一款 Android App

非原生App開發的基本步驟（以安卓端為例） 主要使用： 移動端：ionic、cordova 後端：CoreThink 註：這是我司一位美女研發順手整理過的一份概要流程，希望多少能幫到題主，如果有不合理或者錯誤的地方歡迎反饋給我，官網：CoreThink－最好用的開源免費WEB產品開發框架，qq:1270686837，這個流程可以非常快地同時產出iOS&Android兩端非原生APP。 一、安裝 1.安裝node.js 2.安裝git 3.安裝ionic & cordova： 命令行輸入：npm install –g cordova ionic 註：-g表示全局安裝，也可以進入指定的目錄安裝，但這里推薦全局安裝，安裝後的目錄為C:/users/Administrator/AppData/Roaming/npm/node_moles 4.安裝Java JDK 5.安裝Apache Ant 6.安裝Android SDK（從這里開始後面基本以android為例，ios類似） 7.設置環境變數： ①打開計算機->系統屬性->高級系統設置->環境變數 ②在系統變數中新建ANDROID_HOME變數，變數值為sdk所在目錄 ③新建CLASSPATH變數，變數值為.;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar; ④新建JAVA_HOME變數，變數值為jdk所在目錄 ⑤編輯系統變數中的path變數，不要刪原來的變數值，在原值後面添加 ;%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin;%ANDROID_HOME%\tools;%ANDROID_HOME%\build-tools;%ANDROID_HOME%\platform-tools 註：這里是添加了jdk\bin、jdk\jre\bin、sdk\tools 、sdk\build-tools、sdk\platform-tools的路徑，互相以英文分號隔開 8.創建項目： 命令行cd進入任何你喜歡的目錄，ionic start AnyNameYouLike blank，如果一切順利，就會在你指定的目錄新建一個你喜歡的名字的文件夾，並在裡面初始化一個ionic項目。 9.添加平台 進入剛才新建的項目的目錄，命令行輸入ionic platform add android 二、在項目目錄中有一個www的文件夾，裡面的文件有html，js，css等，可隨意編寫，在platform中的www文件最好不要動它。 三、測試項目 1.進入項目目錄，ionic build android編譯項目 2.測試項目的方法： 桌面瀏覽器測試法：ionic serve 模擬器測試法：這個比較煩，而且運行慢，略 手機瀏覽測試法：Testing your app自己看吧，略 手機測試法：連上數據線，打開開發者選項，執行ionic run android 四、編寫項目 Building out your app英文太多，翻譯不出來 五、發布app，前面的准備就是為了這一步了 1.執行cordova plugin rm cordova-plugin-console，這一步是Before we deploy, we should take care to adjust plugins needed ring development that should not be in proction mode. 2.執行 cordova build --release android，在platforms/android/build/outputs/apk，中會出現***-release-unsigned.apk，最前面取決於取了什麼名字 3.使用keytool打包私有密鑰：執行keytool -genkey -v -keystore my-release-key.keystore -alias alias_name -keyalg RSA -keysize 2048 -validity 10000 4.給沒有簽名的apk簽名：執行jarsigner -verbose -sigalg SHA1withRSA -digestalg SHA1 -keystore my-release-key.keystore HelloWorld-release-unsigned.apk alias_name 5.最後一步，執行zipalign -v 4 HelloWorld-release-unsigned.apk HelloWorld.apk 六、基本步驟到此結束，可能會出現各種報錯的情況，只能具體問題具體分析了

2. 開發androidapp，你會用到哪些開源框架

1.Framework7來自iDangero.us—自版本1.0在一年前發布以來，Framework就一直是開發iOS應用程序的最佳選擇之一。由於它提供對安卓的支持，如果你先從iOS入手，但隨後構建具有類似iOS外觀感覺的安卓版本，它也是個不錯的選擇。功能特性包括：MaterialDesign用戶界面、原生滾動、1:1頁面動畫、自定義DOM庫以及XHR緩存和預裝入。3.jQueryMobile來自jQuery基金會—這種成熟的輕量級框架基於jQuery，缺少本文中介紹的大多數程序包具有的許多高級功能，不過它仍擁有一群龐大的忠實用戶。雖然它提供了語義標記、漸進式改進、主題化設計和PhoneGap/Cordova支持之類的功能，但是在類似原生系統的功能和性能或者高級用戶界面方面乏善可陳。另一方面，它又很簡單，這意味著「編寫一次，到處運行」是常常可以實現的目標;對於還需要在WindowsPhone和黑莓上運行的簡單應用程序而言，它也是個不猜改錯的選擇。2.Ionic來自Ionic—這種流行的跨平台框架基於SassCSS擴展語言，使用起來相當容易，不過它還能集成用於構建更高級應用程序的AngularJS。Ionic提供了一個豐富的庫，包括針對移動設備優化的HTML、CSS和JSCSS組件、手勢及工具，可與預定義的組件協同工作。命令行介面提供了模擬器、實時重裝和日誌等功能。還有一個基於Cordova的應用程序包裝器。4.KendoUI來自Telerik—這種基於jQuery的HTML5/Java框架既有開源版，又有商業版。對企業用戶友好的KendoUI提供了種類豐富的用戶界面窗口組件和插件。它最廣為人知的地方就是擁有無數具有MaterialDesign風格的預構建主題，另外還有一個主題構建器，可用於構建自定義主題。其他功能特性包括：Angular和BootstrapUI集成以及性能優化。6.Native來自Telerik—顧名思義，Native專注於原生用戶體驗開發，但是它提供了跨安卓和iOS的跨平台代碼共享支持。該軟體使用現有的原生用戶界面庫，用戶界面由Java、XML或視情況而定的Angular來描述。然而，使用起來，它不如Telerik更傳統的跨平台KendoUI框架來得容易。5.MobileAngularUI來自MaurizioCasimirri—這個開穗兄判源項目將AngularJS和經過修改的推特Bootstrap合並到了一個移動用戶界面框架。據說它保留了Bootstrap3的大部分語法，因而更容易實現從Web應用程序向移動應用程序的移植，同時增添了Bootstrap缺失的許多組件，比如切開關、覆蓋、側邊欄、可滾動區域以及固定位置的導航條。庫包括fastclick.js和overthrow.js。7.OnsenUI來自AsialCorp.—Onsen基於HTML和CSS而建，旨在與並非預先集成的PhoneGap和Cordova協同運行。它還可以與Angular和jQuery協同運行。顧名思義，該程序強調用戶界面開發，並提供了一系列廣泛的基於Web的用戶界面組件和特性，比如表格的雙列視圖。(然而，仍然缺少MaterialDesign。)這個文檔完備的程序針對這樣的jQueryMobile用戶：既需要易於使用，又想要更多的功能、更高的性能和更豐富的用戶界面特性。總部位於東京的Asial正在開發一種拖放式GUI工具，該公司還開發和維護Monaca。9.SenchaTouch來自Sencha—Sencha的成熟的、面向企業的HTML5/Java框架既有開源版，又有商業版。Sencha建立於ExtJS的基礎上，能夠獲得類似原生的性能。它為HTML5提供了可視化應用程序構建器，另外還提供了重復使用自定義組件的功能。原生包裝器簡化了分發到GooglePlay等應用程序商店的工作。8.ReactNative來自Facebook—ReactNative是一種開源框架，從Facebook的ReactJava框架派生而來，眾所周知，Java框架取代了早些時候的HTML5基礎。顧名思義，這個面向iOS的高端程序與其說是一種跨平台框架，還不如說是原生程序包裝器，但是由於新增了對安卓的支持，它很適合我們的要求，因為你實際上塵早只要用Java編寫一次代碼，就能移植到這兩個平台。目前，只有OSX桌面得到全面支持，不過也有試驗性的Linux和Windows版本面向安卓開發。10.Titanium來自Appcelerator—不像那些比較偏向Web的框架，Titanium使用Java來構建原生代碼，聲稱有望提升性能。這種基於Node.js的軟體開發工具包(SDK)為iOS、安卓、Windows、黑莓和HTML5提供了5000多個API。Titanium更廣為人知的地方是性能和豐富的功能特性，而不是易用性。軟體是開源，不過只要你不發布你的應用程序，功能齊全的免費版可以免費享用，眼下你每月至少得支付39美元。

3. 如何使用ionic打包android的apk

ionic打包apk主要分為幾個步驟：
1、安裝Java的JDK，並配置好環境變數
2、安裝AndroidSDK，並配置好環境變數；這里JDK和andriodSDK的安裝和配置都很重要，必須安裝好JDK和AndroidSDK，才可以進行下面的打包，否則是打不了包的。
3、下載安裝nodejs，這里的nodejs主要是要來對打包所需模塊進行管理
4、使用命令：npm install -g cordava ionic來安裝cordova和ionic
5、切換到剛才nodejs的安裝根目錄下，使用命令：ionic start myApp blank創建一個項目，其中myAPP是項目的名稱，可以由自己命名，blank表示創建一個空項目
6、切換到剛才創建的項目myApp目錄下面，cd myApp
7、ionic platform add android //該命令會創建一個platform目錄，最後生成的apk是放在該目錄下的
8、ionic build android //生成apk文件，至於apk具體的存放目錄，打包成功時會有說明
經過上面幾步的操作，ionic打包apk便已完成。

4. ionic修改完代碼用,需要在重新編譯一下android嗎

1、Tabs必須是預載入的，創建項目默認就是預載入，不用動。

2、訪問的頁面必須是懶載入頁面，只有是懶載入頁面訪問時才會有具體的url頁面錨點地址，刷新後頁面才會停留在當前頁面。

3、默認的三個主界面，刷新要停留在當前，需要改成懶載入方式（最簡單的方法：刪除已有預載入頁面，使用ionic g page重新創建即為懶載入頁面，別忘了刪除app.mole中聲明語句，頁面訪問時使用類名字元串。）

5. ionic添加ios平台時怎麼修改圖標

由於Ionic更新了命令行工具，以後修改應用圖標和添加啟動畫面就簡單了，最新方法見最下方：

應用圖標：

1.在整個項目所在文件夾下創建res文件夾，里邊再分別創建兩個文件夾android和ios。

2.針對Android平台：將我們的要替換的啟動圖標放如android文件夾下。可以分別起名為：mdpi.png(48*48),hdpi(72*72)、xhdpi(96*96)、xxhdpi(144*144) 和 xxxhdpiI(192*192)。
針對ios的，待補充。

3.在config.xml中添加
<platform name="android">
<icon src="res/android/ldpi.png" density="ldpi" />
<icon src="res/android/mdpi.png" density="mdpi" />
<icon src="res/android/hdpi.png" density="hdpi" />
<icon src="res/android/xhdpi.png" density="xhdpi" />
</platform>

其中src中的圖片路徑就為整個項目的相對路徑。
我這里偷了個懶，只搞了一個最高像素密度的應用圖標（192px*192px）進去，安卓會自動進行壓縮。
這里順便說一下如果要修改應用的名稱，只要修改name標簽里的內容即可。

這樣在命令行中重新運行ionic run android，就能看到應用圖標和名字已經被替換了。

啟動畫面：
將啟動畫面的圖片拷貝到之前的android文件夾下，splash-land-hdpi.png（640*480）splash-land-ldpi.png（426 × 320）splash-land-mdpi.png（470 × 320）splash-land-xhdpi.png（960 × 720）splash-port-hdpi.png（480*640）splash-port-ldpi.png（320*426）splash-port-mdpi.png（320*470）splash-port-xhdpi.png（720*960）
（名稱可隨意，只要和config.xml對應上即可）。
在config.xml中添加
<splash src="res/screen/android/splash-land-hdpi.png" density="land-hdpi"/>
<splash src="res/screen/android/splash-land-ldpi.png" density="land-ldpi"/>
<splash src="res/screen/android/splash-land-mdpi.png" density="land-mdpi"/>
<splash src="res/screen/android/splash-land-xhdpi.png" density="land-xhdpi"/>

<splash src="res/screen/android/splash-port-hdpi.png" density="port-hdpi"/>
<splash src="res/screen/android/splash-port-ldpi.png" density="port-ldpi"/>
<splash src="res/screen/android/splash-port-mdpi.png" density="port-mdpi"/>
<splash src="res/screen/android/splash-port-xhdpi.png" density="port-xhdpi"/>
<preference name="SplashScreen" value="screen"/>
<preference name="SplashScreenDelay" value="10000" />
其中10000單位為毫秒，即10秒後隱藏啟動畫面。如果不寫第三句，默認3秒隱藏。
如下圖所示：

我這里沒有那麼多解析度下的圖片，就隨便找了一個稍大解析度的，density也沒寫。它會自動將該圖片拷貝到drawable文件夾。
這時候再重新運行程序，即可看到啟動畫面。
用以上的方法，啟動畫面的顯示時長是固定的，很明顯不太友好。
未完持續...

以上方法已經可以使用Ionic命令行工具來自動生成了，步驟如下：
1.在項目的根目錄下創建resources文件夾。
2.在文件夾中都放入icon.png（應用圖標，最小192x192px，不帶圓角），splash.png（啟動屏幕，最小2208x2208px，中間區域1200x1200px）(可以是png、psd、ai)
3.在cmd中進入項目所在文件夾執行：
ionic resources
執行該命令後，會自動在resources文件夾下創建已添加的平台名稱的文件夾，如：android，其中會自動將圖片進行縮放、裁剪，生成不同解析度的圖片，並在config.xml中添加相應內容。
也可分開執行：
ionic resources --icon
ionic resources --splash
注意：執行以上命令時需在線！