Introduzione a WebOS 3.0 (Enyo)

Questo tutorial ti introdurrà alle basi dello sviluppo per la piattaforma WebOS 3.0 dimostrando come creare una semplice applicazione. Imparerai come installare l'ambiente di sviluppo, creare un'applicazione in stile "Hello-World" ed eseguire l'applicazione per testare il tuo lavoro.

Che cos'è WebOS 3.0?

WebOS è il nuovo sistema operativo di HP per lo sviluppo di app per il touchpad HP. Il nome WebOS è piuttosto adatto in quanto le applicazioni sono scritte in una combinazione di HTML, CSS e JavaScript. Sì, se conosci queste cose, puoi iniziare subito!

La codifica in Enyo è molto semplice e chiara e può aumentare notevolmente l'efficienza del processo di sviluppo. Sebbene il framework non sia attualmente indirizzato a piattaforme esterne al touchpad, è comunque un'innovazione rivoluzionaria che vale la pena esaminare. Ok, quindi sporcarci le mani con il nuovo sistema operativo mobile di HP: WebOS 3.0.

Imposta l'ambiente

La prima cosa da fare è ottenere la copia del kit di sviluppo SDK WebOS 3.0 da developer.palm.com. Assicurati di registrarti per un account come membro della community degli sviluppatori.

Scarica l'ultimo SDK. Passare attraverso la procedura dettagliata di installazione dell'SDK pubblicato sul sito Palm. È possibile seguire gli stessi passaggi indicati per installare WebOS 2.1 (Mojo) e apportare le modifiche necessarie.

Oltre all'SDK, dovrai anche installare qualsiasi browser basato sul kit web come Google Chrome o Safari (utilizzato in questo tutorial) e un editor di testo come Notepad ++. Puoi usare qualsiasi editor di testo che ti piace, ma questo tutorial userà Notepad ++. Ora abbiamo tutti gli strumenti necessari per lo sviluppo.

Impostazione dell'app

Prima di scrivere il codice dobbiamo creare una struttura di cartelle specifica che sia particolarmente adatta per Enyo. La struttura delle cartelle può essere creata manualmente o dalla riga di comando.

Se si utilizza la riga di comando per generare la cartella dell'app, utilizzare i comandi generati dalla palma dalla riga di comando. In generale, le variabili di percorso verranno automaticamente impostate al momento dell'installazione di SDK, in caso contrario sarà necessario impostare manualmente le variabili del percorso del sistema operativo se si desidera che i comandi Palm funzionino correttamente.

Palm-generate myapp

Questo crea una cartella denominata ?myapp?. La cartella ?myapp? in genere contiene questi file:

• appinfo.json
• depends.js
• myapp.js
• myapp.css
• index.html
• icon.png

Puoi creare tutti questi file manualmente con qualsiasi editor di testo tranne uno: icon.png. Questa è l'icona della tua applicazione ed è ovviamente un file immagine.

1. appinfo.json

Il file appinfo.json contiene metadati generali sull'applicazione:

 
 "id": "com.yourname.myapp", "version": "1.0.0", "fornitore": "yourname", "tipo": "web", "main": "index.html", " title ":" myapp "," icon ":" icon.png " 

• id: questo dovrebbe essere un ID univoco per la tua app.
• versione: il numero di versione della tua app.
• venditore: il tuo nome o il nome dell'azienda per cui lavori.
• main: questo è un file HTML caricato per la prima volta all'avvio dell'app.
• titolo: il titolo della tua domanda.
• icona: un'immagine icona per la tua applicazione.

2. dipends.js

Questo file contiene percorsi per tutti i file * .js e * .css nell'applicazione:

 
 enyo.depends ("myapp.js", "myapp.css",);

3. index.html

Questo file è dove inizia l'esecuzione del nostro programma. Contiene codice che sembra molto simile alla lista mostrata di seguito:

Proviamo a costruire un'app in cui l'utente scriverà il suo nome in una casella di input e lo mostreremo in una finestra popup. Fino ad ora non abbiamo scritto nulla in myapp.js. Copia il testo qui sotto in myapp.js e salvalo:

 
 enyo.kind (name: "myapp", kind: enyo.Control, content: "Ciao Questa è la mia prima applicazione WebOS");

Qui stiamo creando un tipo chiamato "myapp". Un tipo può essere un mix di controlli. Qui stiamo solo visualizzando un testo: "Ciao Questa è la mia prima applicazione WebOS".

Per visualizzare questo testo abbiamo usato un tipo chiamato enyo.Control, un componente che può ricevere eventi UI e può contenere altri controlli.

In index.html ne abbiamo scritto unoe