Cordova

Capture

L’idée est simple de Cordova : compiler une coquille utilisant un module « webview » qui encapsule du code web dans un navigateur très allégé.

En utilisant du HTML, css, et JavaScript, il est possible de créer des applications pour les téléphones Apple, Android, et Windows.

Tutoriels :

https://www.toptal.com/mobile/developing-mobile-applications-with-apache-cordova

https://www.tutorialspoint.com/cordova/index.htm

https://imikado.developpez.com/tutoriels/androidCordova/ma-premier-application/

https://cordova.apache.org/docs/fr/latest/guide/cli/

Installation :

https://cordova.apache.org/docs/fr/latest/guide/cli/

Installez NodeJS, GIT et Android Studio

Modifiez la variable path (https://stackoverflow.com/questions/26356359/error-android-home-is-not-set-and-android-command-not-in-your-path-you-must)

ANDROID_HOME = C:\Users\xxx\AppData\Local\Android\Sdk

puis dans le shell nodejs :

Allez dans le répertoire où vous conservez votre code source et exécutez une commande comme suit :

    $ cordova create rephello com.example.hello HelloWorld

Il peut prendre un certain temps pour la commande pour terminer, alors soyez patient. L’exécution de la commande avec le -d option affiche des informations sur ses progrès.

Le premier argument rephello spécifie un répertoire à générer pour votre projet. Ce répertoire ne devrait pas déjà exister, Cordova le créera pour vous.

Le deuxième argument com.example.hello met à votre projet avec un identificateur de domaine inverse-style.

Le troisième argument HelloWorld fournit le titre d’affichage de l’application.

Puis entrez :

cordova platform add android

dans le répertoire créé pour ajouter la platforme android

Éventuellement ajoutez un ou plusieurs plugin, par exemple :

cordova plugin add cordova-sms-plugin

Pour retirer un plugin :

cordova plugin remove cordova-plugin-console

Modifiez le fichier www\index.html pour entrer votre code…

enfin cordova run –emulator pour construire le projet

ou cordova run pour lancer le projet sur un téléphone connecté via USB

Référence : https://www.tutorialspoint.com/cordova/cordova_first_application.htm

PlugIn : https://cordova.apache.org/plugins/

Hello : https://github.com/don/cordova-plugin-hello

SERVICE :

1°) Create a service : https://www.npmjs.com/package/cordova-js-service

cordova plugin add cordova-js-service

2°) Background service : https://www.npmjs.com/package/cordova-plugin-background-service

cordova plugin add cordova-plugin-background-mode

3°) Ajoutez dans « config.xml »

<plugin name= »cordova-plugin-whitelist » spec= »1″ />
<preference name= »js-service » value= »backservice.js » />
<access origin= »* » />

4°) Placez le fichier backservice.js à côté du fichier index.html

5°) Test : https://app.box.com/s/e5uy0qqy1wyievkdx76jcpe8qkb52suo

Read incoming SMS :

https://www.npmjs.com/package/cordova-plugin-sms-receive

https://wiki.appstudio.dev/Using_the_PhoneGap_API:_SMS-Receive

Send SMS : https://github.com/cordova-sms/cordova-sms-plugin

https://github.com/cfjedimaster/Cordova-Examples/tree/master/smscomposer

Start App on Boot : https://stackoverflow.com/questions/44079280/how-i-can-launch-my-app-in-startup-device-with-cordova

https://github.com/ToniKorin/cordova-plugin-autostart

Battery :

cordova plugin add cordova-plugin-battery-status

https://www.tutorialspoint.com/cordova/cordova_battery_status.htm

Réseaux (présence) : https://github.com/apache/cordova-plugin-network-information

https://stackoverflow.com/questions/38720493/how-to-check-internet-connection-on-a-cordova-app

Pour ajouter des boutons (exemple) : https://www.tutorialspoint.com/cordova/cordova_device.htm

Envoi de mails : https://github.com/raguilera82/send-mail-cordova-plugin

SqlLite : cordova plugin add cordova-sqlite-storage puis

https://www.npmjs.com/package/cordova-sqlite-storage#sample

https://codesundar.com/cordova-sqlite-storage/

https://cordova.apache.org/docs/fr/latest/cordova/storage/database/database.html

Ecouter les appels :

https://github.com/rehy/cordova-plugin-calltrap

Exemple : https://www.raymondcamden.com/2014/12/11/cordova-example-sending-sms-messages

http://www.nikola-breznjak.com/blog/javascript/create-android-cordova-plugin-showing-toast-popups/

Test notification : https://github.com/katzer/cordova-plugin-local-notifications

Traduction  et localisation :

https://github.com/apache/cordova-plugin-globalization

https://cordova.apache.org/docs/en/2.4.0/cordova/globalization/globalization.getPreferredLanguage.html

https://mobilefirstplatform.ibmcloud.com/tutorials/en/foundation/8.0/application-development/translation/

Bluetooth :

https://don.github.io/slides/2014-04-07-apachecon-bluetooth/#/14

https://github.com/don/BluetoothSerial

Exemple avec adresse MAC = « 20:13:06:13:37:46 »;

https://github.com/bcsphere/bluetooth

Créer son plugin :

http://loic.knuchel.org/blog/2015/03/20/creer-un-plugin-cordova/

User Interface :

Une application CORDOVA doit suivre le design SPA (Single Page Application). 

SPA est une application qui fonctionne sur le client et qui, au chargement, embarque toutes les ressaources nécessaires (HTML, CSS, and JavaScript) et qui met à jour la page principale à l’aide d’appels AJAX.

Une librairie souvent employée sous CORDOVA est AngularJS

https://angular.io/guide/quickstart

Mais aussi :

https://mobileui.github.io/#getting-started

npm install -g mobileui
cordova create rephello com.example.hello HelloWorld
cd rephello
mobileui install template cordova-blank
mobileui install header

Puis, dans le fichier index.html ajoutez :

Pour voir le résultat dans le navigateur :

mobileui preview <=> http://localhost:8080/

Sous Android :

cordova platform add android
cordova run

Pour utiliser Angular :

mobileui install template cordova-angular1

https://onsen.io/v2/guide/hybrid/cordova.html#cordova

Présentation du résultat d’une API dans un navigateur : https://medium.com/@alexdimango/an-apache-cordova-with-api-fetch-and-bootstrap-in-five-minutes-64b248b30940

Pour modifier l’orientation de l’écran et le mode plein écran

Modifier le fichier config.xml et ajouter dans le paragraphe android

<platform name= »android »>
<preference name= »Orientation » value= »sensorLandscape » />
<preference name= »Fullscreen » value= »true » />
</platform>

https://cordova.apache.org/docs/fr/latest/config_ref/

et le plugin https://www.npmjs.com/package/cordova-plugin-fullscreen

Publication :

https://codeburst.io/publish-a-cordova-generated-android-app-to-the-google-play-store-c7ae51cccdd5

Références :

https://info.exsquared.com/ex-squared-blog/building-a-cordova-android-application-from-scratch

https://imikado.developpez.com/tutoriels/androidCordova/ma-premier-application/

https://www.toptal.com/mobile/developing-mobile-applications-with-apache-cordova

Articles récents
Commentaires récents
fatima dans Bienvenue !
AdminDroid dans Bienvenue !
fatima dans Bienvenue !
Archives
Catégories
%d blogueurs aiment cette page :