Skapa ditt första HTML-baserade AIR-program med AIR SDK

Skapa projektfiler
Skapa programbeskrivningsfilen för AIR
Skapa HTML-sidan för programmet
Testa programmet
Skapa AIR-installationsfilen
Nästa steg

Om du vill få en illustration av hur Adobe® AIR® fungerar ska du använda dessa instruktioner för att skapa och paketera ett enkelt HTML-baserat AIR "Hello World"-program.

Till att börja med måste du installera runtime-modulen och ställa in AIR SDK. Du kommer att använda AIR Debug Launcher (ADL) och AIR Developer Tool (ADT) i denna självstudie. ADL och ADT är kommandoradsverktyg och du hittar dem i katalogen bin för AIR SDK (se Installera AIR SDK ). I denna självstudie antas att du redan känner till hur du kör program från kommandoraden och vet hur man ställer in nödvändiga sökvägsmiljövariabler för det operativsystem som du arbetar med.

Obs! Om du använder Adobe® Dreamweaver® läser du Skapa ditt första HTML-baserade AIR-program med Dreamweaver .

Obs! HTML-baserade AIR-program kan bara utvecklas för profilerna desktop och extendedDesktop. Mobilprofilen stöds inte.

Skapa projektfiler

Alla HTML-baserade AIR-projekt måste innehålla två filer; en programbeskrivningsfil, för att ange applikationens metadata, och en HTML-sida på översta nivån. Förutom dessa obligatoriska filer innehåller detta projekt en JavaScript-fil, AIRAliases.js , som definierar användbara aliasvariabler för AIR API-klasserna.

Skapa en katalog med namnet HelloWorld för projektfilerna.
Skapa en XML-fil med namnet HelloWorld-app.xml .
Skapa en HTML-fil med namnet HelloWorld.html .
Kopiera AIRAliases.js från ramverkets AIR SDK-mapp till projektkatalogen.

Skapa programbeskrivningsfilen för AIR

Börja med att skapa en XML-programbeskrivningsfil med följande utseende när du vill bygga upp ett AIR-program.

<application xmlns="..."> 
    <id>…</id> 
    <versionNumber>…</versionNumber> 
    <filename>…</filename> 
    <initialWindow> 
        <content>…</content> 
        <visible>…</visible> 
        <width>…</width> 
        <height>…</height> 
    </initialWindow> 
</application>

Öppna filen HelloWorld-app.xml för redigering.
Lägg till rotelementet <application> inklusive AIR-namnutrymmesattributet:

<application xmlns="http://ns.adobe.com/air/application/2.7"> Det sista segmentet i namnutrymmet, "2.7", anger vilken version av miljön som krävs för att köra programmet.
Lägg till elementet <id> :

<id>examples.html.HelloWorld</id> Program-ID tillsammans med utgivar-ID identifierar programmet (som härleds i AIR från certifikatet som används för att signera programpaketet). Program-ID används för installationer, åtkomst till kataloger i privata filsystem, åtkomst till privata krypterade lagringsutrymmen och för kommunikation mellan program.
Lägg till elementet <versionNumber> :

<versionNumber>0.1</versionNumber> Detta hjälper användarna att avgöra vilken version av ditt program de installerar.

Obs! Om du använder AIR 2, eller tidigare, måste du använda elementet <version> i stället för elementet <versionNumber> .
Lägg till elementet <filename> :

<filename>HelloWorld</filename> Det namn som används för den körbara programfilen, installationskatalogen och andra referenser i operativsystemet till programmet.
Lägg till elementet <initialWindow> som innehåller följande underordnade element för att ange egenskaperna för det första programfönstret:

<content>HelloWorld.html</content> identifierar HTML-rotfilen som ska läsas in i AIR.

<visible>true</visible> gör att fönstret visas omedelbart.

<width>400</width> anger fönstrets bredd i pixlar.

<height>200</height> anger fönstrets höjd.

Spara filen. Den slutgiltiga programbeskrivningsfilen ska nu ha följande utseende:

<?xml version="1.0" encoding="UTF-8"?> 
<application xmlns="http://ns.adobe.com/air/application/2.7"> 
    <id>examples.html.HelloWorld</id> 
    <versionNumber>0.1</versionNumber> 
    <filename>HelloWorld</filename> 
    <initialWindow> 
        <content>HelloWorld.html</content> 
        <visible>true</visible> 
        <width>400</width> 
        <height>200</height> 
    </initialWindow> 
</application>

I detta exempel ställs endast ett fåtal av de möjliga programegenskaperna in. Mer information om alla programegenskapar, som du använder för att ange exempelvis fönsterkontroller, fönsterstorlek, genomskinlighet, standarkatalog för installation, associerade filtyper och programikoner, finns i AIR-programbeskrivningsfiler .

Skapa HTML-sidan för programmet

Du måste nu skapa en enkel HTML-sida som ska användas som huvudfil för AIR-programmet.

Öppna filen HelloWorld.html för redigering. Skriv in följande HTML-kod:

<html> 
<head> 
    <title>Hello World</title> 
</head> 
<body onLoad="appLoad()"> 
    <h1>Hello World</h1> 
</body> 
</html>

I HTLM-avsnittet <head> importerar du filen AIRAliases.js :
```
<script src="AIRAliases.js" type="text/javascript"></script>
```
I AIR definieras en egenskap med namnet runtime i HTML-fönsterobjektet. Genom runtime-egenskapen får du åtkomst till de interna AIR-klasserna genom att använda det fullständiga namnet för klassen. Om du till exempel vill skapa ett AIR File-objekt kan du lägga till följande JavaScript-sats:
```
var textFile = new runtime.flash.filesystem.File("app:/textfile.txt");
```
Filen AIRAliases.js definierar alias för de mest användbara AIR API:erna. Genom att använda AIRAliases.js kan du korta ner referensen till File-klassen enligt följande:
```
var textFile = new air.File("app:/textfile.txt");
```
Under script-taggen AIRAliases lägger du till ytterligare en script-tagg som ska innehålla en JavaScript-funktion för att hantera händelsen onLoad :
```
<script type="text/javascript"> 
function appLoad(){ 
    air.trace("Hello World"); 
} 
</script>
```
Funktionen appLoad() används endast för att anropa funktionen air.trace() . Trace-meddelandet skrivs ut på kommandokonsolen när du kör programmet med ADL. Dessa trace-satser kan vara mycket användbara vid felsökning.
Spara filen.

Filen HelloWorld.html ske nu ha följande utseende:

<html> 
<head> 
    <title>Hello World</title> 
    <script type="text/javascript" src="AIRAliases.js"></script> 
    <script type="text/javascript"> 
        function appLoad(){ 
            air.trace("Hello World"); 
        }  
    </script> 
</head> 
<body onLoad="appLoad()"> 
    <h1>Hello World</h1> 
</body> 
</html>

Testa programmet

Använd ADL-verktyget (AIR Debug) för att köra och testa programmet från kommandoraden. ADL-filen finns i katalogen bin i AIR SDK-mappen. Om du inte redan installerat AIR SDK ska du läsa Installera AIR SDK .

Öppna en kommandokonsol eller ett skal. Ändra till katalogen som du skapade för detta projekt.
Kör följande kommando:
```
adl HelloWorld-app.xml
```
Ett AIR-fönster öppnas och ditt program visas. I konsolfönstret visas meddelandet för air.trace() -anropet.

Du hittar mer information i AIR-programbeskrivningsfiler .

Skapa AIR-installationsfilen

När ditt program fungerar som det ska kan du använda ADT-verktyget för att paketera programmet i en AIR-installationsfil. En AIR-installationsfil är en arkivfil som innehåller alla programfiler och den kan distribueras till användarna. Du måste installera Adobe AIR innan du kan installera en paketerad AIR-fil.

Om du vill behålla programsäkerheten måste alla AIR-installationsfiler först signeras digitalt. Du kan underlätta utvecklingen genom att skapa ett grundläggande självsignerat certifikat med ADT eller något annat certifikatgenereringsverktyg. Du kan även köpa ett kommersiellt kodsigneringscertifikat från företag som VeriSign eller Thawte. När användarna installerar en självsignerad AIR-fil, visas utgivaren som "okänd" under installationsprocessen. Detta beror på att självsignerade certifikat endast garanterar att AIR-filen inte har ändrats sedan den skapades. Det finns inget som hindrar någon från att självsignera en maskerad AIR-fil och presenterar den som sin egen. Om det avser offentliga AIR-filer rekommenderar vi ett verifieringsbart kommersiellt certifikat. En översikt över säkerhetsfrågor i AIR finns i AIR-säkerhet (för ActionScript-utvecklare) eller AIR security (för HTML-utvecklare).

Generera ett självsignerat certifikat och nyckelpar

I kommandotolken anger du följande kommando (den körbara ADT-filen finns i katalogen bin i AIR SDK):

adt -certificate -cn SelfSigned 1024-RSA sampleCert.pfx samplePassword

I ADT genereras en nyckelbehållarfil med namnet sampleCert.pfx vilken innehåller ett certifikat och den aktuella privata nyckeln.

Detta exempel innehåller det minsta antal attribut som kan anges för ett certifikat. Nyckeltypen måste vara antingen 1024-RSA eller 2048-RSA (läs mer i Signera AIR-program ).

Skapa AIR-installationsfilen

I kommandotolken skriver du följande kommando (på en rad):

adt -package -storetype pkcs12 -keystore sampleCert.pfx HelloWorld.air 
HelloWorld-app.xml HelloWorld.html AIRAliases.js

Du kommer att få en fråga om nyckelfilens lösenord.

HelloWorld.air-argumentet är AIR-filen som skapas i ADT. HelloWorld-app.xml är programbeskrivningsfilen. De efterföljande argumenten är filer som används i ditt program. I detta exempel används endast två filer, men du kan ta med det antal filer och kataloger som du anser dig behöva. ADT verifierar att den huvudsakliga innehållsfilen, HelloWorld.html, ingår i paketet, men om du glömmer att inkludera AIRAliases.js kommer ditt program inte att fungera.

När AIR-paketet har skapats kan du installera och köra programmet genom att dubbelklicka på paketfilen. Du kan också skriva AIR-filnamnet som ett kommando i ett skal eller i kommandofönstret.

Nästa steg

I AIR fungerar HTML- och JavaScript-kod vanligtvis på samma sätt som i en vanlig webbläsare. (Faktum är att det är samma WebKit-återgivningsmotor som i webbläsaren Safari.) Det finns emellertid några viktiga skillnader som du måste vara medveten om när du utvecklar HTML-program i AIR. Mer information om skillnaderna samt andra viktiga ämnen finns i Programming HTML and JavaScript .