Flash İçinde Html Sayfa Görüntülemek

Hepinize iyi çalışmalar diyelim. Yine merak edilen ve bununla ilgili pek kaynağa rastlayamadığımız bu özelliğe ait dersi inceleyelim.

Hepinize iyi çalışmalar diyelim. Yine merak edilen ve bununla ilgili pek kaynağa rastlayamadığımız bu özelliğe ait dersi inceleyelim.

Öncelikle şunu belirteyim. Flash filmlerinin sahnesinde, html sayfalarda olduğu gibi "iframe" veya başka bir yöntem kullanarak sayfayı çerçeve içerisinde göstermek veya kontrol edebilmek mümkün değil yani flash dosyalarının içinde herhangi bir html tarayıcı bulunmuyor. Fakat flash'ın izin verdiği kadarıyla bazı özelliklerinden yararlanarak html içinden flash'a metin ve resim aktarmak, aktardığınız bu metinleri oluşturacağınız bir css dosyası veya action script text format sınıfları ile, html dosyasındaki belirlediğimiz taglarda font tipi, font boyutu, font rengi, url aktarımı, paragraf ve paragrafın görünümü sağ-sol kenar hizalama, html'deki arka plan görünümünü aktarmak gibi basit işlemleri yukarıdaki örnekte bazılarını gördüğünüz gibi tayin ederek biçimlendirmek ve flash film içerisine aktarmak bu kısıtlamalarla mümkün.



Şimdi derse geçebiliriz. Flash'ta yeni bir döküman açın. Ben 550x400 boyutlarındaki sahneye ilk framede 536x384 boyutlarında dynamic text özelliğine sahip bir text alanı oluşturdum ve instance name'ine "icerik" yazdım. İlk frame action paneline aşağıda sırası ve açıklamaları ile gördüğünüz kodları yazdım.

Metinleri flash'a aktarırken Türkçe karakter görüntülenememe problemini bu alttaki kod ile çözüyoruz.


System.useCodepage = true ;



Ve sonra metin biçimlendirme için yeni stil sayfamızı içerecek olan "degisken_css" adlı bir değişken tanımladık.


var degisken_css = new TextField.StyleSheet();



Alttaki üçüncü kodumuzda "ornek.css" isimli CS dosyamızı, yukarıda tanımladığımız "degisken_css" adlı değişkenimize yüklüyoruz. Fakat CS dosyamızı henüz oluşturmadık. Bunu aşağıda göreceğiz. CS dosyamızı oluşturmadan filmimizi test edersek istediğimiz biçimlendirmede çalışmayacaktır.


degisken_css.load("ornek.css");



Sahnemizde bulunan "icerik" adlı dynamic text alanına yukarıda tanımladığımız "degisken_css" adlı değişkenimizi, text alanı biçimlendirme stili olarak uyguluyoruz.


icerik.styleSheet = degisken_css;



"degisken_xml" adında yeni bir XML değişkeni tanımlıyoruz.


var degisken_xml:XML = new XML();



Flash XML deki gereksiz girintileri ve boşlukları (beyaz alanlar-space, enter vb.) okuduğunda biçimlendirmede hatalar ortaya çıkarmaktadır. Bunu önlemek için "degisken_xml" adlı değişkendeki beyaz alanları görmeme seçeneğini aktif ettik.


degisken_xml.ignoreWhite = true;



"ornek.html" adlı html dosyamızın adresini, tanımladığımız "degisken_xml" adlı değişkenimize bildiriyoruz.


degisken_xml.load("ornek.html");



"değişken_xml" adlı değişkenimizin yüklemesi tamamlandığında çalışacak olan fonksiyonumuzu en son olarak alt kısımda yazdık.


degisken_xml.onLoad = function () {



instance name'i icerik olan text alanına, "degisken_xml" adlı değişkenimizdeki verileri aktarıyoruz.


icerik.htmlText = degisken_xml;

}



Kodumuzun tamamı altta görüldüğü gibidir. Bu işlemden sonra flash belgenizi bir yere kaydedin.


System.useCodepage = true ;

var degisken_css = new TextField.StyleSheet();

degisken_css.load("ornek.css");

icerik.styleSheet = degisken_css;

var degisken_xml:XML = new XML();

degisken_xml.ignoreWhite = true;

degisken_xml.load("ornek.html");

degisken_xml.onLoad = function () {    

icerik.htmlText = degisken_xml;

}



Şimdi sıra geldi CS dosyamızı oluşturmaya. Boş bir metin belgesi açın, içine altaki css kodlarını yazın ve farklı kaydet diyerek dosya ismine "ornek.css" yazdıktan sonra flash ile aynı dizine kaydedin.


baslik {

  font-family: Arial,Helvetica,sans-serif;

  font-size: 17px;

  font-weight: bold;

  display: block;

}

altbaslik {

  font-family: Arial,Helvetica,sans-serif;

  font-size: 13px;

  font-weight: bold;

  display: block;

}

italik {

  font-family: Arial,Helvetica,sans-serif;

  font-size: 11px;

  font-style: italic;

  display: inline;

}

icerik {

  font-family: Arial,Helvetica,sans-serif;

  font-size: 10px;

  display: block;

}

A {

  font-family: Arial,Helvetica,sans-serif;

  font-size: 10px;

  display: inline;

  text-decoration:underline;

}



Ekteki örnek resmi flash ile aynı dizine kaydedin. Veya kendi istediğiniz bir jpg resmi.



Şimdi html dosyamızı oluşturalım.Tekrar bir metin belgesi açın ve alttaki html kodunu metin belgeniz içine yapıştırdıktan sonra "ornek.html" adında flash ile aynı dizine kaydedin


<body>

  <baslik>Sanalkurs.net-Flash Dersleri</baslik>

  <altbaslik>Flash'a Html'den Veri Aktarımı</altbaslik>



<italik>Hepinize iyi çalışmalar diyelim.</italik><icerik>Yine merak edilen ve bununla ilgili pek kaynağa rastlayamadığımız  bu özelliğe ait dersi inceleyelim.



Öncelikle şunu belirteyim. Flash filmlerinin sahnesinde, html sayfalarda olduğu gibi <img align='right' src='ornek.jpg'/> "iframe" veya başka bir komut kullanarak sayfayı çerçeve içerisinde göstermek veya kontrol edebilmek mümkün değil. Yani flash dosyalarının içinde herhangibir html tarayıcı bulunmuyor.



Fakat flash'ın izin verdiği kadarıyla bazı özelliklerinden yararlanarak html içinden flash'a metin ve resim aktarmak, aktardığınız bu metinleri oluşturacağınız bir css dosyası veya action script text format sınıfları ile, html dosyasındaki belirlediğimiz taglarda font tipi, font boyutu, font rengi, url aktarımı, paragraf ve paragrafın görünümü sağ-sol kenar hizalama, html'deki arka plan görünümünü aktarmak gibi basit işlemleri örnekte bazılarını gördüğünüz gibi tayin ederek biçimlendirmek ve flash film içerisine aktarmak bu kısıtlamalarla mümkün..

<A HREF="http://www.sanalkurs.net/">Daha çok ders için tıkla </A> </icerik>

</body>



Flash filminizi test edebilirsiniz. Dersimiz bu kadar. Daha çok geliştirmek için CSS, XML ve XML' in Flash ile birlikte kullanımına ait dersleri incelemenizi öneririm. Kaynak dosyaları alttaki bağlantıdan indirebilirsiniz.İlerleyen zamanlarda ActionScript text sınıfları ile html metin biçimlendirmeye ait bir derste bu konuları tekrar ele alacağız. İyi günler dilerim.

  • Etiketler;
Yorum Yaz

Yorum yazabilmek için üye girişi yapmanız gerekiyor!

hiçbişey anlamadım mdesem:uzul::uzul:
Mmarım anlayabildiğin başka dersler vardır.
çok güzel vede yararlı bir örnek. Elinize sağlık
elıne saglık cok yardımcı olduu...
hocam her seferinde bunu indiriyom gerçekten cok yararlı bir ders teşekkürler...:kirp:
teşekkür ederim yararı çokkk
öncelikle çok güzel bi çalışma ama sorun yaşıyorm ben.. diyelim html i dolduruken enter a basıp bi alt satıra indiğimde sanki 2 satır aşşağıya inmiş gibi boşluk oluyor. entera basmadan düz yazdığımda ise animasyonda satırın bittiği yerde ni alt satıra inmiyor... Yardım Lütfen .. şimdiden saolun...
Text alanını seçip properties'ten çizgi tipini (Line Type) Multiline olarak değiştirdiğinde bu satır işini senin yerine yapacaktır.:kirp:
oo hocam çok saolun.. çok teşekkür ederim.. çalışmam bittiğinde buraya link veririm bakarsnz .:)
"ttyaman" çok özür diliyorm birşey daha sorucam satır kendiğilinden aşşağıya inince sanki 1 satır boşluk bırakmış gibi mesafe kalıyo:S o işi nasıl halledicez acaba. ? bu örnekteki gbi bi türlü olmuyor.
Bu özelliği bilen fazla kişi olduğunu düşünmüyorum. Ben .txt yi biliyordum onda da resim yüklenemiyordu sana çok tşk. ederim.
Gerçekten çok ama çok yararlı.
Teşekkürler üstad güzel bir döküman her ne kadar flash alanında pek fazla bilgi sahibi olmasamda bu gibi döküman ve sizler gibi eğitici paylaşımcılar sayesinde öğrenirim en kısa zamanda :kirp:
ben Ali dayımın kuzeniyim tıpkı senin gibi , seni bana o tavsiye etti bu program hakkında hiç bir bilgim yok ama öğrenmeyi çok istiyorum bana sıfırdan ders verirmisin? --şimdiden çok teşekkürler--
harika bir anlatım olmuş emeğine sağlık bu arada bi soru bu yöntemle asp veya aspx sayfalarınıda flash içine çekebilirmiyiz_?
cwplamana gerek kalmadı denedim oluo
merhaba ben bişey sormak ıstıyorum bılenınız yardımcı olursa cok sevınırım flashta sıte yaptım ancak 1000 px 600x bunu percent olarak kat,ydettıgımde ıse sayfa ıcındekı resımlerın netlıgı bozulmakta bılındıgı uzere ..ben px ve percen olarak 2 sayfa yapıp -ekranı 1000 px 600 px kucuk ıse şu html gıt komutunu nasıl oluşturabılrıım .??
Yaman Hocam Emeğinize sağlık tam aradığım bir dersti desem yeri. Ancak benim bu konuda başka bir sorunum var. ben aynı html içerisinde birden fazla veri görüntülemek ve her veriye ayrı link vermek istiyorum. Kendim uğraştım ne yaptıysam dinamik text içerisinde sadece bir <body></body> arasında sadece bir başlık, alt başlık ve link görüntüleyebiliyorum. Ben istiyorum ki; <body></body arasında birden çok başlık ve alt başlık ile link görüntüleyebileyim. Bu konuda bir fikir verirseniz çok sevinirim. süleyman kılıçgil

Yukarı Git