phoneGap 基礎學習（iOS）

時間 2019-11-18

標籤 phonegap 基礎學習 ios 欄目 iOS 简体版

原文原文鏈接

config.xml 配置文件含義javascript

<widget>css

<preferencename="MySetting"value="true"/>html

        <plugins>
            <pluginname="MyPlugin"value="MyPluginClass"/>
        </plugins>
        <accessorigin="*"/>
    </widget>

事件：任意一個能夠被phoneGap檢測到的動做，phoneGap專門事件：backbutton（Android）、deviceready（檢測）、menubutton（Android）、pause（app轉入後臺）、resume（暫停app轉入前臺）、searchbutton（Android）、online（連接Internet時觸發）、offline（斷開Internet時觸發）;其中deviceready事件是檢測phoneGap是否加載徹底，只有加載徹底才能徹底使用phoneGap函數；所以，這個事件起到了檢測的重要做用。在作任何事情以前先檢測它。java

事件註冊：document.addEventListner("menubutton",onMenuButton,false);git

　　function onMenuButton(){網絡

　　//處理菜單按鈕事件app

}ide

獲取設備信息函數

device.name 設備名稱ui

device.phoneGap phoneGap版本

device.platform 設備類型

device.uuid 設備惟一編號

device.version 操做系統版本

網絡檢測

Connection對象

肯定網絡鏈接類型：connection.type

例如：function checkConnection(){

　　var myState=navigator.network.connection.type;

　　myState返回的是一種狀態：　

　　var states={};

　　states[Connection.UNKNOWN] = '未知鏈接';

　　states[Connection.ETHERNET] = '以太網鏈接';

　　states[Connection.WIFI]= 'WiFi鏈接';　

　　states[Connection.CELL_2G] = '2G鏈接';

　　states[Connection.CELL_3G] = '3G鏈接';　　

　　states[Connection.CELL_4G] = '4G鏈接';

　　states[Connection.NONE] = '無網絡鏈接';

　　alert('Connection type:'+states[myState]);

}

使用通知

navigator.notification.alert(message,callback,[title],[button]);

message:對話框消息

callback:警告結束回調函數

(可選)title:標題

(可選)button：按鈕名稱

確認對話框

navigator.notification.confirm(消息，使用鎖按下按鈕的索引回調函數，標題，按鈕標籤)

使用鳴叫

navigator.notification.beep(2);鳴叫兩次

使用振動

navigator.notification.vibrate(2000)；毫秒單位

實例：

<html>
    <head>
       <title>Hello World</title>
        <meta charset="utf-8" />
        <meta name="format-detection" content="telephone=no" />
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
        <link rel="stylesheet" type="text/css" href="css/index.css" />
        <script type="text/javascript" src="cordova.js"></script>
        <script type="text/javascript" charset="utf-8">
        function onLoad(){

            document.addEventListener("deviceready",onDeviceReady,false);
            
        }
            function onDeviceReady(){
            
            }
            function showAlert(){
                navigator.notification.alert('game over',alertCallBack,'game over','Done');
            }
            
            function alertCallBack(){
            
            }
            function onConfirm(button){
                alert('you slected button'+button);
            }
            
            function showConfirm(){
            
                navigator.notification.confirm('Game over',onConfirm,'Game over','Restart,Exit');
            }
            
            function playBeep(){
                navigator.notification.beep(2);
            }
            
            function vibrate(){
                navigator.notification.vibrate(2000);
            }
            
            </script>

    </head>
    <body onLoad="onLoad()">
              <p><a href="#" onclick="showAlert(); return false">showAlert</a></p>
        <p><a href="#" onclick="showConfirm(); return false">showConfirm</a></p>
        <p><a href="#" onclick="playBeep(); return false">playBeep</a></p>
        <p><a href="#" onclick="vibrate(); return false">vibrate</a></p>
    </body>
</html>

HTML Code

地理定位

Geolocation API 包含3種地理定位數據只讀對象

　　Position、PositionError、Coordinates

position包含由地理定位API所建立的座標信息，包含兩個屬性：

　　coords(地理定位集合：經度、緯度、海拔等)

　　timestamp(建立一個時間戳：以毫秒爲單位)

例如：

　　var onSuccess= function(position){

　　alert('緯度：'+'position.coords.latitude')

　　<--!

　　longitude:經度

　　altitude:海拔

　　accuracy:精度

　　altitudeAccuracy:海拔精度

　　heading:朝向

　　speed:速度

　　以及：new Date(position.timestamp)：時間戳

　　-->

}

function onError(error){

　　//返回錯誤信息

　　error.code &&error.message

}

　　navigator.geolocation.getCurrentPosition(onSuccess,onError);

使用地理定位方法

　　getCurrentPosition

　　　　navgator.geolocation.getCurrentPosition(geolocationSuccess,[geolocationError],[geolocationOptions]);

實例：　　

<html>
    <head>
       <title>Hello World</title>
        <meta charset="utf-8" />
        <meta name="format-detection" content="telephone=no" />
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
        <link rel="stylesheet" type="text/css" href="css/index.css" />
        <script type="text/javascript" src="cordova.js"></script>
        <script type="text/javascript" charset="utf-8">
       

            document.addEventListener("deviceready",onDeviceReady,false);
            var watchID=null;
            function onDeviceReady(){
                //每隔3秒更新一次
                var options={frequency:3000};
                watchID = navigator.geolocation.watchPosition(onSuccess,onError,options);
            }
            //地理定位成功回調
           function onSuccess(position){
               var element=document.getElementById('geolocation');
               element.innerHTML='latitude:'+position.coords.latitude+'<br/>'+'longtude'+position.coords.longitude+'<br/>'+'<hr/>' +element.innerHTML;
                    }
            //onError回調函數接收一個positonError對象
          function onError(error){
                            alert('code:'+error.code +'\n'+'message'+error.message+'\n');
                    }
            function watchClear
            </script>

    </head>
    <body >
          <p id='geolocation'>wathching geolocation</p>
        <input id='button'>
    </body>
</html>