Creazione di applicazioni mobili

NOTA

Adobe consiglia di utilizzare l'editor SPA per i progetti che richiedono il rendering lato client basato sul framework dell'applicazione a pagina singola (ad es. React). Per saperne di più.

Create l'applicazione da installare su un dispositivo o un simulatore per il test o la pubblicazione negli app store. È possibile creare applicazioni localmente utilizzando l'interfaccia della riga di comando PhoneGap o nel cloud utilizzando le PhoneGap Build.

Un articolo completo e dettagliato su come creare un'applicazione mobile utilizzando il codice disponibile da GitHub è disponibile qui.

Spostamento dell'applicazione nell'istanza di pubblicazione

Spostate i file dell'applicazione nell'istanza di pubblicazione in modo da poter fornire gli aggiornamenti di contenuto alle istanze installate dell'applicazione mobile e per creare l'applicazione utilizzando il contenuto pubblicato. Le applicazioni sono composte da due rami nodo nella directory archivio:

  • /content/phonegap/apps/<application name>: Pagine Web create e attivate dagli autori.
  • /content/phonegap/content/<application name>: File di configurazione dell'applicazione e configurazioni di Content Sync.
NOTA

Se non spostate i file dell’applicazione nell’istanza di pubblicazione, gli autori del contenuto non possono aggiornare la cache di sincronizzazione dei contenuti.

È necessario spostare i file nel ramo /content/phonegap/content/<application name> solo nell'istanza di pubblicazione. I file nel ramo /content/phonegap/apps/<application name> vengono spostati quando l'autore attiva le pagine.

AEM due metodi per spostare contenuti in blocco nell’istanza di pubblicazione:

Ad esempio, viene creata un'applicazione mobile denominata phonegapapp. Il seguente nodo deve essere spostato nell’istanza di pubblicazione: /content/phonegap/content/phonegapapp.

Suggerimento: per spostare un pacchetto dall’istanza di creazione all’istanza di pubblicazione, usate il comando Replica del pacchetto.

chlimage_1-16

Creazione utilizzando l'interfaccia della riga di comando di PhoneGap

Compilare l'applicazione PhoneGap sul computer utilizzando l'interfaccia CLI (Command-Line Interface) di PhoneGap. Per includere il contenuto AEM nell'applicazione, AEM crea un file ZIP che contiene il contenuto dell'applicazione mobile, le configurazioni di sincronizzazione dei contenuti e altre risorse necessarie. Scaricate il file ZIP e includetelo nella build.

Preparazione dell'ambiente di generazione

Per creare utilizzando l'interfaccia CLI di PhoneGap, è necessario installare Node.js e l'utility client PhoneGap. È necessaria una connessione Internet per eseguire la procedura seguente.

  1. Scaricate e installate Node.js.

  2. Aprite un terminale o un prompt dei comandi e immettete il comando seguente per installare l'utility PhoneGap:

    npm install -g phonegap
    

    Su un sistema Unix o Linux, potrebbe essere necessario aggiungere il prefisso al comando con sudo.

    Il terminale mostra i risultati di una serie di comandi di GET HTTP. Quando l'installazione ha esito positivo, il terminale mostra dove sono installate le librerie, in modo simile al seguente esempio:

    /usr/local/bin/phonegap -> /usr/local/lib/node_modules/phonegap/bin/phonegap.js
    phonegap@3.3.0-0.19.6 /usr/local/lib/node_modules/phonegap
    ├── pluralize@0.0.4
    ├── colors@0.6.0-1
    ├── semver@1.1.0
    ├── qrcode-terminal@0.9.4
    ├── shelljs@0.1.4
    ├── optimist@0.6.0 (...)
    ├── prompt@0.2.11 (...)
    ├── phonegap-build@0.8.4 (...)
    ├── connect-phonegap@0.8.1 (...)
    └── cordova@3.3.0-0.1.1 (...)
    
  3. (Facoltativo) Ottenete l’SDK per la piattaforma mobile di destinazione:

    • Per creare app per la piattaforma iOS, installate la versione più recente di Xcode.
    • Per creare app Android, installate l' Android SDK.

Download del file ZIP del contenuto

Sposta il contenuto dell’applicazione mobile nel file system.

  1. Nella pagina Applicazioni mobili, seleziona l’applicazione.

  2. (Facoltativo) Per creare l'applicazione per installazioni complete, sulla barra degli strumenti, fate clic o toccate l'icona Cancella cache.

    NOTA

    La cache contiene gli aggiornamenti di contenuto per le applicazioni installate. La cancellazione della cache annulla tutti gli aggiornamenti memorizzati nella cache.

  3. Sulla barra degli strumenti, fai clic o tocca l'icona Scarica risorse CLI.

  4. Dopo aver salvato il file ZIP, fate clic su Chiudi nella finestra di dialogo Successo.

  5. Estrarre il contenuto del file ZIP.

Utilizzo dell'interfaccia CLI di PhoneGap per creare

Utilizzate l'interfaccia CLI di PhoneGap per compilare e installare l'applicazione. Per informazioni sull'utilizzo dell'interfaccia CLI di PhoneGap, consultare la documentazione di PhoneGap Command-line Interface.

  1. Aprite un terminale o un prompt dei comandi e modificate la directory corrente nel file ZIP dell'applicazione scaricato. Ad esempio, quanto segue modifica la directory nel file ng-app-cli.1392137825303.zip:

    cd ~/Downloads/ng-app-cli.1392137825303
    
  2. Immettete il comando phonegap per la piattaforma di destinazione. Ad esempio, il seguente comando crea l'app per Android:

    phonegap build android
    

Creazione tramite PhoneGap Build

Utilizzate il servizio cloud PhoneGap per creare la vostra app. Per eseguire questa procedura, è innanzitutto necessario creare una configurazione di PhoneGap Build.

Connessione a PhoneGap Build

Create una configurazione di PhoneGap Build in modo da poter utilizzare i servizi di PhoneGap Build dall'interno AEM. Specifica il nome utente e la password dell'account PhoneGap Build che utilizzerai per creare le applicazioni mobili.

  1. Aprite la pagina Strumenti. (http://localhost:4502/tools.html).

  2. Nell’area Operazioni CQ, fare clic su Cloud Services.

  3. Fate clic sul collegamento Configura ora per le PhoneGap Build.

    chlimage_1-17

  4. Nella finestra di dialogo Crea configurazione, digitate un valore per la proprietà Titolo. Per impostazione predefinita, il valore della proprietà Name viene derivato dal titolo, tuttavia è possibile immettere un nome. Fai clic su Crea.

  5. Nella finestra di dialogo Configurazione PhoneGap Build, digitate il nome utente e la password della PhoneGap Build, quindi fate clic su OK.

Utilizzo delle PhoneGap Build

Inviate le risorse dell'applicazione alle PhoneGap Build per la compilazione per le varie piattaforme mobili.

  1. Nella pagina Applicazioni mobili, apri l’applicazione mobile. (http://localhost:4502/mobile.html/content/phonegap)

  2. (Facoltativo) Per creare l'applicazione per installazioni complete, selezionate l'applicazione e fate clic sull'icona Cancella cache.

    NOTA

    La cache contiene gli aggiornamenti di contenuto per le applicazioni installate. La cancellazione della cache annulla tutti gli aggiornamenti memorizzati nella cache.

  3. Selezionate la pagina iniziale, quindi fate clic sull'icona Genera remoto.

    Nota: la versione Beta di AEM Beta non crea una notifica Inbox al completamento della build.

  4. Nella finestra di dialogo Successo, fare clic su PhoneGap Build per aprire la pagina Adobe PhoneGap Build all'indirizzo https://build.phonegap.com/apps. In attesa della visualizzazione dell'app, è possibile controllare la pagina Stato PhoneGap Build.

    Per informazioni sull'installazione della build, vedere la Documentazione delle PhoneGap Build.

    NOTA

    Gli account di PhoneGap Build gratuiti sono autorizzati per un'applicazione privata. Le build PhoneGap non riescono se si sta creando un'applicazione privata aggiuntiva.

Passaggi successivi

Il passaggio successivo al processo di creazione è la Struttura di un'app.

In questa pagina

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free