Flash Builder'da ilk masaüstü Flex AIR uygulamanızı oluşturma

Flash Builder, AIR uygulamaları geliştirmek ve paketlemek için ihtiyacınız olan araçları içerir.

Flash Builder veya Flex Builder'da AIR uygulamalarını diğer Flex tabanlı uygulama projelerini oluşturduğunuz şekilde, yeni bir proje tanımlayarak oluşturursunuz.

1. Flash Builder'ı açın.

2. Dosya Seçin > Yeni > Flex Projesi.

3. Proje adını AIRHelloWorld olarak girin.

4. Flex'te AIR uygulamaları uygulama türü varsayılır. İki seçeneğiniz var:

   • Adobe® Flash® Player'da çalışan bir web uygulaması

   • Adobe AIR'de çalışan bir masaüstü uygulaması

   Uygulama türü olarak Masaüstü'nü seçin.

5. Projeyi oluşturmak için Bitir'i tıklatın.

AIR projeleri başta iki dosyadan oluşur: ana MXML dosyası ve (uygulama tanımlayıcısı dosyası olarak bilinen) bir uygulama XML dosyası. Sonraki dosya uygulama özelliklerini belirtir.

Daha fazla bilgi için bkz. Flash Builder ile AIR uygulamaları geliştirme.

"Hello World" uygulama kodunu yazmak için, düzenleyicide açık olan uygulama MXML dosyasını (AIRHelloWorld.mxml) düzenlersiniz. (Dosya açık değilse, dosyayı açmak için Proje Gezgini'ni kullanın.)

Masaüstündeki Flex AIR uygulamaları MXML WindowedApplication etiketine dahildir. MXML WindowedApplication etiketi başlık çubuğu ve kapat düğmesi gibi temel pencere kontrollerini içeren basit bir pencere oluşturur.

1. WindowedApplication bileşenine bir başlık niteliği ekleyin ve onu "Hello World" değerine atayın:

   ?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" 
                          title="Hello World"> 
   </s:WindowedApplication>

2. Uygulamaya bir Etiket bileşeni ekleyin (onu WindowedApplication etiketinin içine yerleştirin). Etiket bileşeninin text özelliğini "Hello AIR" değerine ayarlayın ve mizanpaj sınırlamalarını ortaya hizalı tutmak için burada gösterildiği gibi ayarlayın:

   <?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" 
                          title="Hello World"> 
    
       <s:Label text="Hello AIR" horizontalCenter="0" verticalCenter="0"/> 
   </s:WindowedApplication>

3. Onu izleyen stil bloğunu WindowedApplication etiketini açtıktan hemen sonra ve yeni girdiğiniz etiket bileşen etiketinden önce ekleyin.

   <fx:Style> 
       @namespace s "library://ns.adobe.com/flex/spark"; 
       s|WindowedApplication 
       { 
        
   skinClass:ClassReference("spark.skins.spark.SparkChromeWindowedApplicationSkin"); 
           background-color:#999999; 
           background-alpha:"0.7"; 
       }          
   </fx:Style>

Bu stil ayarları uygulamanın tamamına uygulanır ve pencere arka planını çok az saydam gri olacak şekilde oluşturur.

Uygulama kodu artık aşağıdaki gibi görünür:

<?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" 
                       title="Hello World"> 
     
    <fx:Style> 
        @namespace s "library://ns.adobe.com/flex/spark"; 
        s|WindowedApplication 
        { 
         
skinClass:ClassReference("spark.skins.spark.SparkChromeWindowedApplicationSkin"); 
            background-color:#999999; 
            background-alpha:"0.7"; 
        }          
    </fx:Style> 
 
    <s:Label text="Hello AIR" horizontalCenter="0" verticalCenter="0"/> 
</s:WindowedApplication>

Daha sonra, uygulamanın saydam olmasına izin vermek için uygulama tanımlayıcısında bazı ayarları değiştireceksiniz:

Yazdığınız uygulama kodunu test etmek için onu hata ayıklama modunda çalıştırın.

1. Ana araç çubuğundaki Hata Ayıkla düğmesini tıklatın.

   Ayrıca Çalıştır > Hata Ayıkla > AIRHelloWorld komutunu da seçebilirsiniz.

   Sonuçta elde edilen AIR uygulaması aşağıdaki gibi görünmelidir:

   Grafiği tam boyut görüntüle

2. Etiket denetiminin horizontalCenter ve verticalCenter özellikleri kullanılarak metin pencerenin merkezine yerleştirilir. Herhangi başka bir masaüstü uygulamasında yapacağınız şekilde pencereyi taşıyın veya yeniden boyutlandırın.

Artık "Hello World" uygulamasını dağıtım için bir AIR dosyasına paketlemeye hazırsınız. Bir AIR dosyası projenin bin klasöründe bulunan dosyaların tümü olan uygulama dosyalarını içeren bir arşiv dosyasıdır. Bu basit örnekte, bu dosyalar SWF ve uygulama XML dosyalarıdır. AIR paketini daha sonra onu uygulamayı yüklemek için kullanan kullanıcılara dağıtırsınız. Bu işlemde gerekli bir adım onu dijital olarak imzalamaktır.

1. Uygulamada derleme hataları olmadığından ve uygulamanın beklendiği şekilde çalıştığından emin olun.

2. Proje > Sürüm Yapısını Dışa Aktar'ı seçin.

3. AIRHelloWorld projesinin ve AIRHelloWorld.mxml uygulamasının proje ve uygulama için listelenip listelenmediğini kontrol edin.

4. İmzalanmış AIR paketi seçeneği olarak Dışa Aktar'ı seçin. Ardından İleri'yi tıklatın.

5. Mevcut bir dijital sertifikanız varsa, onu bulup seçmek için Gözat'ı tıklatın.

6. Yeni bir kendinden imzalı dijital sertifika oluşturmanız gerekiyorsa, Oluştur'u seçin.

7. Gerekli bilgiyi girin ve Tamam'ı tıklatın.

8. AIRHelloWorld.air adlı AIR paketini oluşturmak için Bitir'i tıklatın.

Artık uygulamayı AIR dosyasını çift tıklatarak Flash Builder'daki Proje Gezgini'nden veya dosya sisteminden yükleyip çalıştırabilirsiniz.