Merhabalar,

Flex bileşenleri ile XML verilerinin kullanımını incelediğimiz yazılarımıza devam ediyoruz. TileList ve List bileşenlerinin ardından Web uygulamalarında oldukça sık karşımıza çıkan bir diğer bileşene göz atalım istedim, ComboBox! ComboBox bileşeni hemen hemen tüm web sayfalarında karşılaşabildiğimiz, alanında uzman bir bileşendir. Flex uygulamalar içerisinde ComboBox bileşeninin verilerini harici bir veri kaynağından alırken bir önceki örneğimizdeki List bileşeni ile aynı yöntemi kullanacağız.

uyeler.xml :

<?xml version="1.0" encoding="utf-8"?>
<uyeler>
    <uye>
        <resim>images/uye1.jpg</resim>
        <isim>Ömer Dursun</isim>
        <meslek>Öğretmen</meslek>
        <dogum>01-01-1974</dogum>
    </uye>
    <uye>
        <resim>images/uye2.jpg</resim>
        <isim>Ahsen Taşkıran</isim>
        <meslek>Çevre Mühendisi</meslek>
        <dogum>01-05-1980</dogum>
    </uye>
    <uye>
        <resim>images/uye3.jpg</resim>
        <isim>Arif Canayakın</isim>
        <meslek>Mafya</meslek>
        <dogum>24-02-1977</dogum>
    </uye>
</uyeler>

Aşağıdaki kodlar XML dosyamızdaki uye yapılarının isim alanlarını ComboBox bileşeni içerisinde görüntülüyor ve seçilen alanın ait olduğu elemanın meslek bilgisini Label bileşeni içerisine aktarıyor.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" initialize="myHTTP.send()">

    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.rpc.events.ResultEvent;

            [Bindable]
            private var uyeler:ArrayCollection;

            private function myResult(event:ResultEvent):void
            {
                uyeler = event.result.uyeler.uye;
            }
        ]]>
    </mx:Script>

    <mx:HTTPService id="myHTTP" url="data/uyeler.xml" result="{myResult(event)}"/>
    <mx:ComboBox id="myComb" dataProvider="{uyeler}" labelField="isim"/>
    <mx:Label text="{myComb.selectedItem.meslek}"/>

</mx:Application>

Evet gördüğünüz gibi bir önceki örnek ile tamamen aynı yöntemle bu uygulamamızı gerçekleştirdik. Uygulamanın çalışan örneği aşağıdadır. Kolay Gelsin!

NOT: Sayfada bazan SWF dosyaları çalışmıyor (tarayıcıya göre) yada bağlantılara izin verilmiyor. Eğer kaynağı görüntüle butonlarını çalıştıramıyorsanız, uygulamanın kaynağına buradan ulaşabilirsiniz.