我們將在這里學(xué)習(xí)如何設(shè)置基本的環(huán)境，以使應(yīng)用毫不費(fèi)力。通過PhoneGap的支持cordova使用命令行界面和Github的資料庫機(jī)制的應(yīng)用程序離線創(chuàng)建，但我們自己動(dòng)手體驗(yàn)配置過程。

我們假設(shè)你精通Web技術(shù)，Web應(yīng)用程序準(zhǔn)備作為一個(gè)應(yīng)用程序。因?yàn)镻honeGap僅支持HTML，CSS和JavaScript，它是強(qiáng)制性的，這個(gè)應(yīng)用只使用這些技術(shù)創(chuàng)建。

從開發(fā)者的角度來看，包括在其包中的應(yīng)用程序應(yīng)該具有以下項(xiàng)目：

• 配置文件
• 應(yīng)用程序圖標(biāo)
• 信息或內(nèi)容(使用網(wǎng)絡(luò)技術(shù)構(gòu)建的)

配置

web應(yīng)用程序?qū)⒅恍枰粋€(gè)應(yīng)該是足夠的配置所有必要的設(shè)置配置文件。它的名字是config.xml。該文件包含了所有編譯應(yīng)用程序所需的必要信息。

讓我們來看看config.xml 如下例子：

<?xml version="1.0" encoding="UTF-8"?>

<widget xmlns     = "http://www.w3.org/ns/widgets"
        xmlns:gap = "http://phonegap.com/ns/1.0"
        id        = "com.yiibai.onlineviewer"
        version   = "1.0">

    <name>Tutorials Point</name>

    <description>
        Tutorials Point Online Viewer
    </description>

    <author href="http://yiibai.com" email="contact@yiibai.com">
        Tutorials Point
    </author>

    <preference name="permissions" value="none"/>


    <icon src="res/icon/android/drawable-ldpi/tp_icon.png" gap:platform="android" gap:qualifier="ldpi" />
    <icon src="res/icon/android/drawable-mdpi/tp_icon.png" gap:platform="android" gap:qualifier="mdpi" />
    <icon src="res/icon/android/drawable-hdpi/tp_icon.png" gap:platform="android" gap:qualifier="hdpi" />
    <icon src="res/icon/android/drawable-xhdpi/tp_icon.png" gap:platform="android" gap:qualifier="xhdpi" />
    <icon src="res/icon/android/drawable-xxhdpi/tp_icon.png" gap:platform="android" gap:qualifier="xxhdpi" />
    
    <icon src="res/icon/ios/Icon-72.png" gap:platform="ios" gap:qualifier=""/>
    
    <icon src="res/icon/ios/icon-57.png" gap:platform="ios" width="57" height="57" />
    <icon src="res/icon/ios/icon-72.png" gap:platform="ios" width="72" height="72" />
    <icon src="res/icon/ios/icon-57-2x.png" gap:platform="ios" width="114" height="114" />
    <icon src="res/icon/ios/icon-72-2x.png" gap:platform="ios" width="144" height="144" />
    

</widget>

所有的配置內(nèi)容包裝在<widget>標(biāo)記。附圖說明這些如下：

<widget id = ”app_id”>

id為各種應(yīng)用程序商店的應(yīng)用程序保留-ID。它是在反向域名的風(fēng)格，即com.yiibai.onlineviewer等。

<widget version = "x.y.z">

x.y.z格式是應(yīng)用程序的版本號(hào)，其中（x，y，z）為正整數(shù)，即1.0.0，它代表major.minor.patch版系統(tǒng)。

<name> App Name</name>

這是應(yīng)用程序的名稱，這將在手機(jī)屏幕上顯示下面的應(yīng)用程序圖標(biāo)。應(yīng)用程序可以使用這個(gè)名稱來搜索。

<description> My First Web App </description>

這是關(guān)于應(yīng)用，并且它是一個(gè)簡(jiǎn)要說明。

<author> Author_Name </author>

此字段包含創(chuàng)建者或程序員，一般設(shè)置為組織，正在發(fā)起這個(gè)應(yīng)用程序的名稱的名稱。

<preferences name = "permissions" value = "none">

首選項(xiàng)標(biāo)簽是用來設(shè)置各種選項(xiàng)，比如全屏，BackgroundColor中和方向的應(yīng)用程序。這些選項(xiàng)在名稱和值對(duì)。例如：name="FullScreen" value="true" 等。由于我們不要求任何這些預(yù)先設(shè)置，只要把權(quán)限設(shè)置為none。

<icon>

讓我們將圖標(biāo)添加到我們的應(yīng)用程序。它可以編碼多種方式，但我們正在學(xué)習(xí)捷徑的一切，所以在這兒呢。 .src 確定的圖標(biāo)圖像的路徑。差距：平臺(tái)決定了其操作系統(tǒng)平臺(tái)該圖標(biāo)將被使用。 gap:限定詞是使用Android設(shè)備的密度。在iOS設(shè)備上使用的寬度和高度參數(shù)。

圖標(biāo)

有具有相同的移動(dòng)操作系統(tǒng)不同大小的設(shè)備，因此目標(biāo)受眾一個(gè)平臺(tái)，需要提供所有的移動(dòng)設(shè)備類型的圖標(biāo)。制備精確的形狀和尺寸的圖標(biāo)所要求的特定的移動(dòng)操作系統(tǒng)是重要的。

在這里，我們使用的是文件夾res/icon/ios 和res/icon/android/drawable-xxxx.

為了這個(gè)工作做得快，可以創(chuàng)建一個(gè)大小為1024×1024的標(biāo)志，然后登錄到makeappicon.com。這個(gè)網(wǎng)站將幫助你快速創(chuàng)建各種大小的，以及Android和iOS平臺(tái)的標(biāo)志。

提供了1024×1024尺寸的圖標(biāo)圖像后，makeappicon.com應(yīng)提供下列資料：

icons for iOS

icons for Android

本網(wǎng)站為提供了一個(gè)選項(xiàng)，通過電子郵件發(fā)送zip格式的所有標(biāo)識(shí)。