Skapa fönster

Det går inte att ändra initieringsegenskaperna för ett inbyggt fönster efter att skrivbordsfönstret har skapats. De här oföränderliga egenskaperna och deras standardvärden är bland andra:

Ange egenskaperna för det inledande fönster som skapas av AIR i programbeskrivningsfilen. Huvudfönstret i ett AIR-program har alltid typen normal. (Det går att ange ytterligare fönsteregenskaper i beskrivningsfilen, till exempel visible, width och height, men de här egenskaperna kan ändras när som helst.)

Ange egenskaperna för andra inbyggda fönster och HTML-fönster som skapas av programmet med hjälp av klassen NativeWindowInitOptions. När du skapar ett fönster måste du skicka ett NativeWindowInitOptions-objekt som anger fönstrets egenskaper för antingen konstruktorfunktionen NativeWindow eller HTMLLoader-metoden createRootWindow().

Med följande kod skapas ett NativeWindowInitOptions-objekt för ett verktygsfönster:

var options:NativeWindowInitOptions = new NativeWindowInitOptions(); 
options.systemChrome = NativeWindowSystemChrome.STANDARD; 
options.type = NativeWindowType.UTILITY 
options.transparent = false; 
options.resizable = false; 
options.maximizable = false; 

Det går inte att ange systemChrome till standard när transparent är true eller type är lightweight.

När du skapar ett fönster med Flex-klassen mx:Window anger du initieringsegenskaperna i själva fönsterobjektet, antingen i fönstrets MXML-deklaration eller i koden som fönstret skapas med. Det underliggande NativeWindow-objektet skapas inte förrän du anropar metoden open(). När ett fönster har öppnats går det inte att ändra de här initieringsegenskaperna.

I AIR skapas det inledande programfönstret baserat på de egenskaper som anges i programbeskrivningen, och filen som refereras till i innehållselementet läses in. Innehållselementet måste referera till en SWF- eller HTML-fil.

Det inledande fönstret kan fungera som huvudfönster för programmet eller bara som ett sätt att öppna ett eller flera ytterligare fönster. Det behöver inte vara synligt överhuvudtaget.

Om du vill skapa en NativeWindow-instans skickar du ett NativeWindowInitOptions-objekt till NativeWindow-konstruktorn:

var options:NativeWindowInitOptions = new NativeWindowInitOptions(); 
options.systemChrome = NativeWindowSystemChrome.STANDARD; 
options.transparent = false; 
var newWindow:NativeWindow = new NativeWindow(options); 

Fönstret visas inte förrän du anger egenskapen visible till true eller anropar metoden activate().

När fönstret har skapats kan du initiera dess egenskaper och läsa in innehåll i fönstret med hjälp av scenegenskapen och tekniker för visningslistan i Flash.

I nästan alla fall ska du ange scenegenskapen scaleMode för ett nytt inbyggt fönster till noScale (använd konstanten StageScaleMode.NO_SCALE). Skalningslägena i Flash har utformats för situationer där programförfattaren inte känner till proportionerna för programmets visningsområde i förväg. Med hjälp av skalningslägena kan författaren välja den kompromiss som gör minst skada: beskära, sträcka ut eller trycka ihop innehållet eller fylla ut med tomt utrymme. Eftersom du anger visningsområdet i AIR (fönsterramen) kan du anpassa fönstret efter innehållet eller innehållet efter fönstret utan att behöva kompromissa.

Skalningsläget för Flex- och HTML-fönster anges automatiskt till noScale.

var maxOSSize:Point = NativeWindow.systemMaxSize; 
var minOSSize:Point = NativeWindow.systemMinSize; 

Om du vill skapa ett HTML-fönster kan du antingen anropa JavaScript-metoden Window.open() eller så kan du anropa metoden createRootWindow() för klassen HTMLLoader i AIR.

HTML-innehåll i säkerhetssandlådor kan använda JavaScript-standardmetoden Window.open(). Om innehållet körs utanför programmets säkerhetssandlåda kan metoden open() endast anropas som svar på användaråtgärder, till exempel en musklickning eller tangenttryckning. När open() anropas skapas ett fönster med systemfönsterstandard för att visa innehållet på den angivna URL:en. Till exempel:

newWindow = window.open("xmpl.html", "logWindow", "height=600, width=400, top=10, left=10");

Innehåll i programmets säkerhetssandlåda har åtkomst till den kraftfullare metoden för att skapa fönster, HTMLLoader.createRootWindow(). Med den här metoden kan du ange alla alternativ för att skapa ett nytt fönster. Med JavaScript-koden nedan skapas exempelvis ett fönster av enkel typ utan systemfönsterstandard med storleken 300×400 pixlar:

var options = new air.NativeWindowInitOptions(); 
options.systemChrome = "none"; 
options.type = "lightweight"; 
 
var windowBounds = new air.Rectangle(200,250,300,400); 
newHTMLLoader = air.HTMLLoader.createRootWindow(true, options, true, windowBounds); 
newHTMLLoader.load(new air.URLRequest("xmpl.html"));

Om du skapar ett genomskinligt fönster visas inte alltid SWF-innehåll som är inbäddat i HTML som läses in i det fönstret. Du måste ställa in parametern wmode för objektet eller den inbäddade taggen som används som referens för SWF-filen på antingen opaque eller tranparent. Standardvärdet för wmode är window, så som standard visas inte SWF-innehåll i genomskinliga fönster. PDF-innehåll kan inte visas i genomskinliga fönster, oavsett vilket wmode som är angivet. (Före AIR 1.5.2. kunde inte SWF-innehåll visas i genomskinliga fönster heller.)

Fönster som skapas med metoden createRootWindow() förblir oberoende av öppningsfönstret. Egenskaperna parent och opener för JavaScript-objektet Window är null. Öppningsfönstret kan komma åt Window-objektet för det nya fönstret med hjälp av HTMLLoader-referensen som returneras av funktionen createRootWindow(). I sammanhanget för det föregående exemplet skulle programsatsen newHTMLLoader.window referera till JavaScript-objektet Window för det fönster som skapas.

Om du vill skapa ett mx:Window kan du skapa en MXML-fil med mx:Window som rottagg eller anropa Window-klassens konstruktor direkt.

I följande exempel skapas och visas ett mx:Window genom ett anrop till Window-konstruktorn:

var newWindow:Window = new Window(); 
newWindow.systemChrome = NativeWindowSystemChrome.NONE; 
newWindow.transparent = true; 
newWindow.title = "New Window"; 
newWindow.width = 200; 
newWindow.height = 200; 
newWindow.open(true);

Hur du lägger till innehåll i ett AIR-fönster beror på fönstrets typ. Med exempelvis MXML och HTML kan du definiera fönstrets grundläggande innehåll med hjälp av en deklaration. Du kan bygga in resurser i programmets SWF-filer eller läsa in dem från separata programfiler. Flex-, Flash- och HTML-innehåll kan skapas direkt och läggas till dynamiskt i ett fönster.

När du läser in SWF-innehåll, eller HTML-innehåll som innehåller JavaScript, måste du ta hänsyn till säkerhetsmodellen i AIR. Allt innehåll i programmets säkerhetssandlåda, alltså innehåll som har installerats med programmet och kan läsas in med schemat app: URL, har fullständig åtkomst till alla API:er i AIR. Innehåll som läses in från en plats utanför den här säkerhetssandlådan har inte åtkomst till API:erna i AIR. JavaScript-innehåll utanför programmets säkerhetssandlåda kan inte använda egenskaperna runtime, nativeWindow eller htmlLoader för JavaScript-objektet Window.

Du kan möjliggöra säker korsskriptning genom att använda en sandlådebrygga som tillhandahåller ett begränsat gränssnitt mellan innehåll i och utanför programmet. I HTML-innehåll kan du också mappa sidor från programmet till en säkerhetssandlåda utanför programmet, så att korsskriptning med externt innehåll kan utföras för koden på sidorna. Se även AIR-säkerhet.

package { 
    import flash.display.Sprite; 
    import flash.events.Event; 
    import flash.net.URLRequest; 
    import flash.display.Loader; 
 
    public class LoadedSWF extends Sprite 
    { 
        public function LoadedSWF(){ 
            var loader:Loader = new Loader(); 
            loader.load(new URLRequest("visual.swf"));                    
            loader.contentLoaderInfo.addEventListener(Event.COMPLETE,loadFlash); 
        } 
 
        private function loadFlash(event:Event):void{ 
            addChild(event.target.loader);  
        } 
    } 
}

//newWindow is a NativeWindow instance 
var htmlView:HTMLLoader = new HTMLLoader(); 
htmlView.width = 300; 
htmlView.height = 500; 
 
//set the stage so display objects are added to the top-left and not scaled 
newWindow.stage.align = "TL"; 
newWindow.stage.scaleMode = "noScale"; 
newWindow.stage.addChild( htmlView ); 
 
//urlString is the URL of the HTML page to load 
htmlView.load( new URLRequest(urlString) );

<html> 
<head> 
<title>Bouncers</title> 
<script src="AIRAliases.js" type="text/javascript"></script> 
<script language="JavaScript" type="text/javascript"> 
air.Shape = window.runtime.flash.display.Shape; 
 
function Bouncer(radius, color){ 
    this.radius = radius; 
    this.color = color; 
 
    //velocity  
    this.vX = -1.3; 
    this.vY = -1; 
 
    //Create a Shape object and draw a circle with its graphics property 
    this.shape = new air.Shape();     
    this.shape.graphics.lineStyle(1,0); 
    this.shape.graphics.beginFill(this.color,.9); 
    this.shape.graphics.drawCircle(0,0,this.radius); 
    this.shape.graphics.endFill(); 
     
    //Set the starting position 
    this.shape.x = 100; 
    this.shape.y = 100; 
 
 
    //Moves the sprite by adding (vX,vY) to the current position 
    this.update = function(){ 
        this.shape.x += this.vX; 
        this.shape.y += this.vY; 
         
        //Keep the sprite within the window 
        if( this.shape.x - this.radius < 0){  
            this.vX = -this.vX; 
        } 
        if( this.shape.y - this.radius < 0){ 
            this.vY = -this.vY; 
        } 
        if( this.shape.x  + this.radius > window.nativeWindow.stage.stageWidth){ 
            this.vX = -this.vX; 
        } 
        if( this.shape.y  + this.radius > window.nativeWindow.stage.stageHeight){ 
            this.vY = -this.vY; 
        } 
         
    }; 
} 
 
function init(){ 
    //turn off the default HTML background 
    window.htmlLoader.paintsDefaultBackground = false; 
    var bottom = new Bouncer(60,0xff2233); 
    var top = new Bouncer(30,0x2441ff); 
 
    //listen for the enterFrame event 
    window.htmlLoader.addEventListener("enterFrame",function(evt){ 
        bottom.update(); 
        top.update(); 
    }); 
     
    //add the bouncing shapes to the window stage 
    window.nativeWindow.stage.addChildAt(bottom.shape,0); 
    window.nativeWindow.stage.addChild(top.shape); 
} 
</script> 
<body onload="init();"> 
<h1>de Finibus Bonorum et Malorum</h1> 
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium 
doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis 
et quasi architecto beatae vitae dicta sunt explicabo.</p> 
<p style="background-color:#FFFF00; color:#660000;">This paragraph has a background color.</p> 
<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis 
praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias 
excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui 
officia deserunt mollitia animi, id est laborum et dolorum fuga.</p> 
</body> 
</html>

I följande exempel illustreras hur ett inbyggt fönster skapas.

public function createNativeWindow():void { 
    //create the init options 
    var options:NativeWindowInitOptions = new NativeWindowInitOptions(); 
    options.transparent = false; 
    options.systemChrome = NativeWindowSystemChrome.STANDARD; 
    options.type = NativeWindowType.NORMAL; 
     
    //create the window 
    var newWindow:NativeWindow = new NativeWindow(options); 
    newWindow.title = "A title"; 
    newWindow.width = 600; 
    newWindow.height = 400; 
     
    newWindow.stage.align = StageAlign.TOP_LEFT; 
    newWindow.stage.scaleMode = StageScaleMode.NO_SCALE; 
 
    //activate and show the new window 
    newWindow.activate(); 
}