Share
Deze tutorial zal u kennis laten maken met Adobe Air, een raamwerk voor het bouwen van rijke internettoepassingen. Deze eerste introductie laat zien hoe je een eenvoudige applicatie maakt met behulp van Html / Js-technologieën.
Adobe Air is een raamwerk waarmee u bureaubladtoepassingen kunt bouwen.
Adobe Air-toepassingen zijn gebaseerd op twee technologieën: Html / Js en Flash.
Ontwikkelaars kunnen kiezen om een desktop-applicatie te bouwen via Html / Js, Flash of Flex. Na een kort overzicht van de architectuur, zullen we een eenvoudige applicatie bouwen met behulp van Html / Js.
Een Air-toepassing wordt uitgevoerd door middel van een runtime-component, die de code in het luchtbestand uitvoert. Zoals u in de afbeelding kunt zien, biedt Adobe de runtime-component voor de drie krachtige operationele systemen, Mac OS X, Windows (XP / Vista) en Linux (let op: de Linux-versie is nog in bèta). Het cijfer kan ertoe leiden dat de twee benaderingen exclusief zijn, ofwel ontwikkel je in HTML / JS of Flash. Omdat de luchttijd een "overbrugging" mogelijk maakt tussen Javascript- en ActionScript-engines, kunt u javascript-code aanroepen via een swf, HTML / DOM manipuleren via ActionScript, enz..
Adobe Air-runtime is niet alleen een integratie van HTML / JS- en Flash-technologieën. De runtime biedt een set API waarmee luchttoepassingen kunnen werken met OS-functies zoals:
Adobe Air bevat ook SQLite, een database-engine voor het lokaal opslaan en ophalen van gegevens.
Om de hieronder beschreven stappen te herhalen, moet u de runtime en de sdk (Software Development Kit) installeren, waarmee u luchttoepassingen kunt bouwen.
De runtime kan worden gedownload van http://www.adobe.com/go/getair. Voer het installatieprogramma uit en volg de instructies.
De SDK kan worden gedownload van: http://www.adobe.com/go/getairsdk
Pak de SDK uit en plaats de mappen op de gewenste locatie (gebruikers van macosx moeten een .dmg-afbeelding koppelen). Onthoud de locatie van de SDK, we verwijzen ernaar als SDKPATH.
De directory van de SDK zou er als volgt uit moeten zien:
De SDK moet worden geconfigureerd, anders zal het besturingssysteem de opdrachten die moeten worden uitgevoerd niet vinden.
In feite, als je een shell opent, een type adl, jouw besturingssysteem zal iets zeggen als "commando niet gevonden". Dit werkt alleen als u naar de bin-map van de SDK-map gaat. Omdat we in elke map build- en testopdrachten kunnen uitvoeren, moeten we de SDK configureren. Het is belangrijk om het absolute pad van de bin-map in de SDK-map correct te typen.
Op Mac OS X volg je deze procedure:
Accentsconagua
CD om er zeker van te zijn dat je in je thuismap bent .profiel. Als het niet bestaat, maak het dan PATH exporteren = $ PATH: / usr / bin PATH exporteren = $ PATH: / airsdk / bin bron .profile Voer in Windows de volgende stappen uit:
PAD uit de onderste lijst en voeg aan het einde het pad toe aan de map sdk, zoals in de figuur. 
Om te testen of de configuratie succesvol is, openen we een shell en typen we deadt commando.
Het resultaat zou het volgende moeten zijn:
Dit antwoord betekent technisch dat we een verkeerd aantal parameters aan het commando hebben gegeven, maar het ook
betekent dat de SDK correct is geïnstalleerd en geconfigureerd.
Laten we nu onze projectmap maken. We noemen dit mijnTest en we maken twee bestanden: myTest.html en myTest.xml.
Het XML-bestand is het configuratiebestand waarmee de luchttoepassing kan worden ingesteld. Open het met uw voorkeurseditor en voeg de volgende code in.
De eerste regel is een standaard header voor xml-bestanden. De tweede regel start de definitie van onze applicatie. De ID kaart is de unieke ID van uw applicatie. In dit geval heb ik dat met mijn domeinnaam voorafgegaan. De bestandsnaam is de naam van het uitvoerbare bestand dat we zullen genereren. Naam is de naam van de applicatie, zoals gezien door de gebruiker. De Omschrijving is een fragment dat tijdens de installatie wordt getoond om de toepassing te beschrijven. Versie geeft het versienummer van uw app aan, 0.1 in ons geval.
Na het specificeren van metadata over de applicatie gaan we naar de definitie van de afbeeldingen, ingesloten in de
Regel 10 specificeert het rootbestand, dat wil zeggen het bestand dat moet worden geladen in de luchtapplicatie bij het opstarten. In dit geval de myTest.html die we later zullen laten zien. Titel is de reeks die in het bovenste gedeelte van het venster verschijnt. De systemChrome geeft aan of uw toepassing de standaardchroom heeft (die van het hosting-besturingssysteem), of geen. Chrome is een verzameling standaardhulpmiddelen waarmee u vensters in een bureaubladomgeving kunt bewerken, namelijk de titelbalk, knoppen voor het sluiten / vergroten / verkleinen, randen en het gebied dat moet worden aangepast voor het wijzigen van de grootte.
De achtergrond van een Air-toepassing kan op transparant worden ingesteld, maar deze optie is alleen geldig als chrome niet is ingesteld. Zichtbaar maakt het mogelijk om te beslissen of uw toepassing moet worden weergegeven wanneer deze wordt gestart. Dit is handig wanneer het opstarten enige tijd in beslag neemt en u de afbeeldingen niet wilt weergeven aan gebruikers.
De betekenis van tags minimizable, maximizable en resizable moet intuïtief zijn en geen uitleg behoeven.
Laten we nu eens kijken naar myTest.html die onze applicatie bevat.
Zoals je kunt zien is het een standaard html-pagina, met een hoofd en een lichaam. De kop bevat een titel en de body heeft een eenvoudige div met gecentreerde tekst.
Voordat we de toepassing als een .air-bestand inpakken, zullen we deze testen om te controleren of deze het verwachte resultaat oplevert.
De tool die we zullen gebruiken adl, waarmee onze Air-toepassingen zonder installatie kunnen worden uitgevoerd.
Laten we een shell openen en naar de map gaan die onze myTest-bestanden bevat (zowel html als xml).
Typ vervolgens de volgende opdracht:
adl myTest.xml
Hiermee wordt de toepassing uitgevoerd met het Chrome van het huidige besturingssysteem. Op een MacO zou dit er zo uit moeten zien.
In Windows XP ziet de toepassing er als volgt uit:
Je zou kunnen betwijfelen dat deze applicatie werkt alleen met HTML. Laten we javascript testen.
We veranderen de myTest.html bestand als volgt.
Met betrekking tot de vorige versie hebben we een scripttag toegevoegd die de definitie van een eenvoudige javascript-functie bevat, myFunction (),een waarschuwing weergeven (regels 4-8). We hebben een knop aan het lichaam toegevoegd (regel 12). De actie die is gekoppeld aan de knopklik is de popme () functie. Laten we het bestand opslaan en uitvoeren met dezelfde opdracht vanuit de shell, adl myTest.xml
Als we op de knop klikken, zien we ongeveer het volgende:
Zodra uw toepassing gereed is voor implementatie, kunnen we het .air-bestand maken. Dit is het distributiepakket voor Adobe Air-toepassingen.
Dit bestand, dat is gebaseerd op zip-compressie, bevat alle spullen die nodig zijn om luchttoepassingen te installeren.
Een Air-toepassing moet worden ondertekend met een certificaat. Voor breed verspreide toepassingen verdient het de voorkeur een certificaat te verkrijgen van een autoriteit zoals thawte.
Ons doel is gewoon testen, dus een zelfgetekend certificaat is voldoende. Het aanmaken van een certificaat kan via de adt commando. Open een shell, ga naar de projectmap en typ deze opdracht:
adt -certificate -cn mycertificate 1024-RSA mycertificatefile.p12 mysecretpass
adt -certificate -cn is gewoon de syntaxis die vereist is door de opdracht. In de volgende tabel worden de waarden beschreven die aan de opdracht zijn verstrekt.
| Parameter Waarde | Uitleg |
| mycertificate | De naam van het certificaat |
| 1024-RSA | De coderingssleutel van het certificaat |
| mycertificatefile.p12 | Het bestand waarin het certificaat is opgeslagen |
| mysecretpass | Het wachtwoord dat uw certificaat beschermt |
Als u de projectmap aanvinkt, vindt u een nieuw bestand met de naam mycertificate.p12 Dit is het zelfondertekende certificaat dat we hebben gemaakt.
De projectmap moet nu drie bestanden bevatten zoals in de onderstaande afbeelding.
Nu hebben we alles wat we nodig hebben om ons .air-bestand te maken. We moeten een behoorlijk lang shell-commando uitvoeren. Geen paniek. Ik zal elk woord uitleggen. Laten we het eerst zien.
adt -package -storetype pkcs12 -keystore mycertificate.p12 AIRHelloWorld.air AIRHelloWorld.xml AIRHelloWorld.html
Zoals hierboven adt-pakket is de syntaxis van het commando, Type_archief geeft het formaat van de keystore aan. Dit is een vrij technische parameter. Om kort te zijn, omdat we een certificaat hebben gegenereerd volgens het pkcs12-formaat, moeten we dit aan de compiler vertellen. Vervolgens specificeren we het certificaatbestand, via de -keystore parameter. Ten slotte geven we de naam van het resulterende .air-bestand, het xml-bestand met de toepassingsinstellingen en het .html-startpuntbestand. Wanneer we deze opdracht geven, wordt ons gevraagd om het wachtwoord dat is ingevoerd tijdens het maken van het certificaat ("mysecretpass") in ons geval.
We hebben nu een .air-bestand, wat het distributieformaat van onze applicatie is. Als we erop dubbelklikken, start het installatieproces.
De installatie doorloopt twee eenvoudige stappen, zoals hieronder wordt weergegeven.
Merk op dat, aangezien we het certificaat zelf hebben ondertekend, de gepubliceerde identiteit van de toepassing ONBEKEND is.
Tijdens de tweede stap kunt u opgeven waar de toepassing moet worden geïnstalleerd en of deze moet worden gestart wanneer de installatie is voltooid.
In deze tutorial hebben we het Adobe Air-framework geïntroduceerd en hebben we onze eerste Adobe Air-toepassing gebouwd met behulp van Html / Js.
In de volgende afleveringen zullen we zien hoe we dezelfde applicatie kunnen bouwen met Flex en Flash CS3.
