AIR'de yerel pencerelerin temelleri

Adobe AIR 1.0 ve üstü

AIR uygulamasında yerel pencerelerle çalışma için hızlı açıklamalar ve kod örnekleri için Adobe Geliştirici Bağlantısındaki hızlı başlamayla ilgili makalelere bakın.

AIR, Flash®, Flex™ ve HTML programlama tekniklerini kullanarak yerel işletim sistemi pencereleri oluşturmak için kullanımı kolay, platformlar arası bir pencere API'si sunar.

AIR'le uygulamanızın görünümünü geliştirmede büyük bir özgürlüğe sahip olursunuz. Oluşturduğunuz pencereler Mac'te çalışırken Apple stiliyle eşleşerek, Windows'ta çalışırken Microsoft uygulamalarına uyarak ve Linux'ta pencere yöneticisiyle uyum halinde çalışarak, platforma özgü bir kod satırına sahip olmadan standart bir masaüstü uygulaması gibi görünebilir. Veya uygulamanız nerede çalışırsa çalışsın kendi stilinizi oluşturmak için Flex çerçevesinin sağladığı skin desteği olan, genişletilebilir kromu kullanabilirsiniz. Masaüstüne karşı saydamlık ve alfa karışımı için tam desteğe sahip vektör ve bitmap resmi içeren kendi pencere kromunuzu bile oluşturabilirsiniz. Dikdörtgen pencerelerden sıkıldınız mı? Yuvarlak bir tane çizin.

AIR'deki Pencereler

AIR, pencerelerle çalışmak için üç ayrı API destekler:

  • ActionScript odaklı NativeWindow sınıfı, en düşük düzeyli pencere API'sini sağlar. NativeWindows sınıfını ActionScript ve Flash Professional uygulamalarında kullanın. Uygulamanızda kullanılan pencereleri özelleştirmek için NativeWindow sınıfını genişletmeyi düşünün.

  • HTML ortamında, tarayıcı tabanlı web uygulamasında olduğu gibi JavaScript Window sınıfını kullanabilirsiniz. JavaScript Window yöntemine yapılan çağrılar, temel yerel pencere nesnelerine iletilir.

  • Flex çerçevesi mx:WindowedApplication ve mx:Window sınıfları, NativeWindow sınıfı için bir Flex “sarma“ sağlar. Flex ile bir AIR uygulaması oluşturduğunuzda, WindowedApplication bileşeni Application bileşeninin yerini alır ve Flex uygulamanızda her zaman başlangıç penceresi olarak kullanılmalıdır.

ActionScript pencereleri

Bir NativeWindow sınıfıyla pencereler oluşturduğunuzda, Flash Player sahnesini kullanın ve listeyi doğrudan görüntüleyin. NativeWindow sınıfına görsel bir nesne eklemek için nesneyi pencere sahnesinin görüntü listesine veya sahnedeki başka bir görüntüleme nesnesi kabına ekleyin.

HTML pencereleri

HTML pencereleri oluşturduğunuzda, içeriği görüntülemek için HTML, CSS ve JavaScript kullanırsınız. HTML penceresine görsel bir nesne eklemek için, bu içeriği HTML DOM'a eklersiniz. HTML pencereleri, NativeWindow öğesinin özel bir kategorisidir. AIR ana bilgisayarı HTML pencerelerinde temel NativeWindow örneğine erişim sağlayan bir nativeWindow özelliği tanımlar. Bu özelliği burada açıklanan NativeWindow özellikleri, yöntemleri ve olaylarına erişmek için kullanabilirsiniz.

Not: JavaScript Window nesnesi de, mevcut pencere için komut dosyası oluşturmaya yönelik moveTo() ve close() gibi yöntemlere sahiptir. Örtüşen yöntemler olduğunda, en uygun yöntemi kullanabilirsiniz.

Flex Framework pencereleri

Flex çerçevesiyle pencereler oluşturduğunuzda, pencereyi doldurmak için genellikle MXML bileşenlerini kullanırsınız. Bir Flex bileşenini bir pencereye eklemek için, bileşen öğesini pencerenin MXML tanımına eklersiniz. İçeriği dinamik olarak eklemek için ActionScript de kullanabilirsiniz. mx:WindowedApplication ve mx:Window bileşenleri Flex kapları olarak tasarlanmıştır ve NativeWindow nesneleri Flex bileşenlerini doğrudan kabul edemezken, bu bileşenler edebilir. Gerektiğinde, NativeWindow özellikleri ve yöntemlerine nativeWindow özelliği kullanılarak WindowedApplication ve Window nesneleri aracılığıyla erişilebilir.

İlk uygulama penceresi

Uygulamanızın ilk penceresi sizin için AIR tarafından otomatik olarak oluşturulur. AIR, uygulama tanımlayıcı dosyasının initialWindow öğesinde belirtilen parametreleri kullanarak pencere özelliklerini ve içeriğini ayarlar.

Kök içerik bir SWF dosyası ise, AIR bir NativeWindow örneği oluşturur, SWF dosyasını yükler, ve bunu pencere sahnesine ekler. Kök içerik bir HTML dosyası ise, AIR bir HTML penceresi oluşturur ve HTML'i yükler.

Yerel pencere olay akışı

Yerel pencereler, ilgili bileşenleri önemli bir değişikliğin gerçekleşmek üzere olduğuna veya gerçekleştiğine dair bilgilendirmek için olaylar gönderir. Birçok pencere ilişkili olay, çiftler halinde gönderilir. İlk olay, bir değişikliğin gerçekleşmek üzere olduğuna dair uyarır. İkinci olay, değişikliğin yapıldığını bildirir. Bir uyarı olayını iptal edebilirsiniz, ancak bir bildirim olayını iptal edemezsiniz. Aşağıdaki sıra, kullanıcı pencerenin büyütme düğmesini tıklattığında gerçekleşen olay akışını gösterir:

  1. NativeWindow nesnesi bir displayStateChanging olayı gönderir.

  2. Hiçbir kayıtlı kullanıcı olayı iptal etmezse, pencere büyür.

  3. NativeWindow nesnesi bir displayStateChange olayı gönderir.

    NativeWindow nesnesi ayrıca pencere boyutu ve konumuyla ilgili değişiklikler için de olaylar gönderir. Pencere, bu ilgili değişiklikler için uyarı olayları göndermez. İlgili değişiklikler şunlardır:

    1. Büyütme işlemi nedeniyle pencerenin sol üst köşesi hareket ettiğinde move olayı gönderilir.

    2. Büyütme işlemi nedeniyle pencere boyutu değiştiğinde resize olayı gönderilir.

    Bir NativeWindow nesnesi, pencereyi simge durumuna küçültme, yeniden yükleme, kapatma, taşıma ve yeniden boyutlandırma sırasında olayları benzer bir sırayla gönderir.

    Uyarı olayları yalnızca, pencere kromu veya başka işletim sistemin tarafından kontrol edilen bir mekanizma bir değişiklik başlattığında gönderilir. Pencere boyutu, konumu veya görüntü durumunu değiştirmek için bir window yöntemini çağırdığınızda, pencere yalnızca değişikliği bildirmek için bir olay gönderir. İsterseniz pencere dispatchEvent() yöntemini kullanarak bir uyarı olayı gönderebilir ve değişiklik devam etmeden önce uyarı olayınızın iptal edilip edilmediğini kontrol edebilirsiniz.

    Pencere API sınıfları, yöntemleri, özellikleri ve olaylarıyla ilgili ayrıntılı bilgi için bkz. Adobe Flash Platformu için ActionScript 3.0 Başvurusu .

Yerel pencere stili ve davranışını denetleyen özellikler

Aşağıdaki özellikler, bir pencerenin temel görünümü ve davranışını denetler:

  • type

  • systemChrome

  • transparent

  • owner

Bir pencere oluşturduğunuzda, pencere yapıcısına iletilen NativeWindowInitOptions nesnesindeki bu özellikleri ayarlarsınız. AIR, özellikleri ilk uygulama penceresi için uygulama tanımlayıcıdan okur. (Uygulama tanımlayıcıda ayarlanamayan ve her zaman normal olarak ayarlanmış olan type özelliği hariç.) Bu özellikler pencere oluşturulduktan sonra değiştirilemez.

Bu özelliklerin bazı ayarları birbirleriyle uyumsuzdur: transparent özelliği true olarak veya type özelliği lightweight olarak ayarlandığında systemChrome özelliği standard olarak ayarlanamaz.

Pencere türleri

AIR pencere türleri, üç işlevsel pencere türü oluşturmak için yerel işletim sisteminin krom ve görünürlük niteliklerini birleştirir. Koddaki tür adlarına başvurmak için NativeWindowType sınıfında tanımlanan sabitleri kullanın. AIR, aşağıdaki pencere türlerini sağlar:

Tür

Açıklama

Normal

Tipik bir pencere. Normal pencereler tam boyutlu krom stilini kullanır ve Windows görev çubuğu ile Mac OS X pencere menüsünde görünürler.

Hizmet penceresi

Bir araç paleti. Hizmet pencereleri sistem kromunun daha ince bir versiyonunu kullanır ve Windows görev çubuğu ile Mac OS X pencere menüsünde görünmezler.

Hafif

Hafif pencereler krom içermez ve Windows görev çubuğunda veya Mac OS X pencere menüsünde görünmezler. Ayrıca, hafif pencereler Windows'ta Sistem (Alt+Ara çubuğu) menüsü içermezler. Hafif pencereler, açılır kutular gibi kısa süreli görüntü alanları açan bildirim kabarcıkları ve denetimler için uygundur. type özelliği hafif olarak ayarlandığında systemChrome özelliği none olarak ayarlanmalıdır.

Pencere kromu

Pencere kromu, kullanıcıların masaüstü ortamında bir pencereyi değiştirmesine olanak veren denetimlerin kümesidir. Krom öğeleri, başlık çubuğu, başlık çubuğu düğmeleri, kenarlık ve yeniden boyutlandırma kıskaçlarını içerir.

Sistem kromu

systemChrome özelliğini standard veya none olarak ayarlayabilirsiniz. Pencerenize kullanıcının işletim sistemi tarafından oluşturulan ve stillendirilen standart denetimler kümesini vermek için standard sistem kromunu seçin. Pencere için kendi kromunuzu sağlamak istiyorsanız none olarak ayarlayın. Koddaki sistem kromu ayarlarına başvurmak için NativeWindowSystemChrome sınıfında tanımlanan sabitleri kullanın.

Sistem kromu sistem tarafından yönetilir. Uygulamanızın denetimlerin kendisine doğrudan erişimi yoktur, ancak denetimler kullanıldığında gönderilen olaylara tepki verebilir. Pencere için standart krom kullandığınızda, transparent özelliği false olarak ve type özelliği normal veya utility olarak ayarlanmalıdır.

Flex kromu

Flex WindowedApplication veya Window bileşenlerini kullandığınızda pencere, sistem kromunu veya Flex çerçevesi tarafından sağlanan kromu kullanabilir. Flex kromunu kullanmak için, pencere oluşturmak üzere kullanılan systemChrome özelliğini none olarak ayarlayın. mx bileşenleri yerine Flex 4 spark bileşenlerini kullandığınızda, Flex kromu kullanabilmek için skin sınıfını belirtmelisiniz. Dahili kaplamaları veya kendi kaplamanızı kullanabilirsiniz. Aşağıdaki örnek, dahili spark WindowedApplication dış görünüm sınıfının pencere kromu sağlamak için nasıl kullanılacağını gösterir:

<?xml version="1.0" encoding="utf-8"?> 
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
xmlns:s="library://ns.adobe.com/flex/spark" 
xmlns:mx="library://ns.adobe.com/flex/mx"> 
<fx:Style> 
@namespace "library://ns.adobe.com/flex/spark"; 
WindowedApplication 
{ 
    skinClass:ClassReference("spark.skins.spark.SparkChromeWindowedApplicationSkin"); 
} 
</fx:Style> 
</s:WindowedApplication>

Daha fazla bilgi için bkz. Flex 4'ü Kullanma: AIR pencere kapları hakkında: Pencere kromunu kontrol etme

Özel krom

Sistem kromu olmadan bir pencere oluşturduğunuzda, kullanıcı ve pencere arasındaki etkileşimleri işlemek için kendi krom denetimlerinizi eklemeniz gerekir. Dikdörtgen olmayan, şeffaf pencereler de yapabilirsiniz.

mx:WindowedApplication veya mx:Window bileşenleri ile özel krom kullanmak için, showFlexChrome stilini false değerine ayarlamalısınız. Yoksa, Flex pencerelerinize kendi kromunu ekler.

Pencere şeffaflığı

Bir pencerenin masaüstü veya diğer pencerelerle alfa karışımına izin vermek için transparent özelliğini true olarak ayarlayın. transparent özelliği pencere oluşturulmadan ayarlanmalıdır ve değiştirilemez.

Şeffaf bir pencerenin varsayılan bir arka planı yoktur. Uygulama tarafından çizilen, nesne içermeyen pencere alanları görünmezdir. Görüntülenen bir nesne birden küçük bir alfa ayarına sahipse, aynı penceredeki, diğer pencerelerdeki ve masaüstündeki görüntüleme nesneleri de dahil nesnenin altındaki her şey görünür.

Şeffaf pencereler, şekil açısından düzensiz olan, “yavaşça kaybolan” veya görünmez olan kenarlıklara sahip uygulamalar oluşturmak istediğinizde kullanışlıdır. Ancak, Alfa karışımlı büyük alanlar oluşturmak uzun sürebilir, bu nedenle efekt tutumlu kullanılmalıdır.

Önemli: Linux'ta fare olayları tam saydam piksellerden geçmez. Büyük, tam saydam alanlar içeren pencereler oluşturmaktan kaçınmalısınız, çünkü bu şekilde kullanıcının masaüstündeki diğer pencere ve öğelere erişimini engelleyebilirsiniz. Mac OS X ve Windows'ta, fare olayları tam saydam piksellerden geçer.

Şeffaflık, sistem kromu içeren pencerelerle kullanılamaz. Ayrıca, HTML'deki SWF ve PDF içeriği şeffaf pencerelerde görüntülenmeyebilir. Daha fazla bilgi için, bkz. HTML sayfasına SWF ve PDF içeriği yüklenirken dikkate alınması gerekenler .

Statik NativeWindow.supportsTransparency özelliği, pencere şeffaflığının kullanılabilir olup olmadığını bildirir. Şeffaflık desteklenmediğinde, uygulama siyah bir arka plana karşı birleştirilir. Bu durumlarda, uygulamanın tüm saydam alanları opak siyah olarak görüntülenir. Bu özelliğin false değerinde olması ihtimaline karşı bir destek sağlamakta fayda vardır. Örneğin, kullanıcıya bir uyarı iletişim kutusu veya geri dönüşlü, dikdörtgen, şeffaf olmayan bir kullanıcı arabirimi görüntüleyebilirsiniz.

Şeffaflığın Mac ve Windows işletim sistemleri tarafından her zaman desteklendiğini unutmayın. Linux işletim sistemlerinde destek, bileşik pencere yöneticisini gerektirir, ancak bileşik pencere yöneticisi etkin olduğunda bile, kullanıcı görüntü seçenekleri veya donanım yapılandırması nedeniyle saydamlık kullanılamayabilir.

MXML uygulama penceresinde şeffaflık

Pencereyi şeffaf olarak oluştursanız bile, MXML penceresinin arka planı varsayılan olarak opaktır. (Pencerenin köşelerindeki şeffaflık efektine dikkat edin.) Pencereye şeffaf bir arka plan oluşturmak için, stil sayfasındaki arka plan rengi ve alfa değerini veya uygulamanızın MXML dosyasında bulunan <mx:Style> öğesini ayarlayın. Örneğin, aşağıdaki stil bildirimi arka plana biraz şeffaf, yeşil bir gölge verir:

WindowedApplication 
{ 
    background-alpha:".8"; 
    background-color:"0x448234"; 
}

HTML uygulama penceresinde şeffaflık

İçinde bulunduğu pencere şeffaf olsa bile, HTML pencereleri ve HTMLLoader nesnelerinde görüntülenen HTML içeriğinin arka planı varsayılan olarak opaktır. HTML içeriği için görüntülenen varsayılan arka planı kapatmak için, paintsDefaultBackground özelliğini false olarak ayarlayın. Aşağıdaki örnek bir HTMLLoader oluşturur ve varsayılan arka planı kapatır:

var htmlView:HTMLLoader = new HTMLLoader(); 
htmlView.paintsDefaultBackground = false;

Bu örnek, bir HTML penceresinin varsayılan arka planını kapatmak için JavaScript kullanır:

window.htmlLoader.paintsDefaultBackground = false;

HTML belgesinde bulunan bir öğe, bir arka plan rengi ayarlıyorsa, bu öğenin arka planı şeffaf olmaz. Kısmi bir şeffaflık (veya opaklık) değerinin ayarlanması desteklenmez. Ancak, benzer bir görsel efekt elde etmek için PNG biçimindeki şeffaf bir grafiği bir sayfanın veya sayfa öğesinin arka planı olarak kullanabilirsiniz.

Pencere sahipliği

Bir pencere bir ya da daha fazla başka pencereye sahip olabilir . Bu sahip olunan pencereler her zaman ana pencerenin önünde görüntülenir, ana pencereyle birlikte simge durumuna getirilip geri yüklenir ve ana pencere kapatıldığında kapanır. Pencere sahibi olma durumu başka bir pencereye aktarılamaz veya kaldırılamaz. Bir pencere yalnızca tek bir ana pencerenin olabilir, ancak sınırsız sayıda pencereye sahip olabilir.

Pencere sahipliğini araç paletleri ve iletişim kutuları için kullanılan pencerelerin yönetimini kolaylaştırmak için kullanabilirsiniz. Örneğin, Kaydet iletişim kutusunu bir belge penceresiyle ilişkili bir şekilde görüntülediyseniz, belge penceresinin iletişim kutusunun sahibi olması iletişim kutusunu otomatik olarak belge penceresinin önünde tutar.

Görsel bir pencere kataloğu

Aşağıdaki tablo, Mac OS X, Windows ve Linux işletim sistemlerinde pencere özellik ayarlarının farklı bileşimlerinin görsel efektlerini gösterir:

Pencere ayarları

Mac OS X

Microsoft Windows

Linux *

Type: normal

SystemChrome: standart

Transparent: false

Type: hizmet

SystemChrome: standart

Transparent: false

Type: Herhangi biri

SystemChrome: yok

Transparent: false

Type: Herhangi biri

SystemChrome: yok

Transparent: true

mxWindowedApplication veya mx:Window

Type: Herhangi biri

SystemChrome: yok

Transparent: true

* Compiz pencere yöneticisi ile Ubuntu

Not: Aşağıdaki sistem kromu öğeleri AIR'de desteklenmez: Mac OS X Araç Çubuğu, Mac OS X Proxy Simgesi, Windows başlık çubuğu simgeleri ve diğer sistem kromu.