Cant Work Out How To Make Scroller Use Dynamic Text
scroller.fla
I used a tutorial on here that let me have my own scroller with buttons and a scrollbar and could scroll a movie clip that i can put whatever i like in, which is great but what i would like is for it to scroll dynamic text from a text.txt file so that it is easy to update for someone who is not familiar with flash.
the tutorial stated that it would not scroll text but he also stated he had modified his scroller from one that could scroll text (i assume dynamic). he gave directions on how to find the other tutorial however the site it was from no longer exists. can anybody help me?
Alex
FlashKit > Flash Help > Flash General Help
Posted on: 10-19-2004, 06:44 AM
View Complete Forum Thread with Replies
See Related Forum Messages: Follow the Links Below to View Complete Thread
Scroller Doesn't Work For Image In Dynamic Text
What I have here is a dynamic text with a scroller. It worked great for texts, html anchors, etc. But when I put in the <img> then the scroller doesn't work... Does anyone know why or know how can I make it work?
Thanks....
Scrolling Dynamic Text? How Do I Make It Work?
I followed this tutorial: http://www.kirupa.com/developer/flash8/scrollbar.htm
and i would like to combine it with something like http://www.kirupa.com/developer/mx/dynamic_scroller.htm
Basicly, i would like to have a custom scroll box that loads dynamic text from a txt or xml file. i will be using it for the news on the main page of http://system7design.com
it would be extra cool if i could set an array or something so i can define a date, a heading, and body, and have it auto format like it already is on the page, with the orange dashed lines and junk. Is this possible in flash? if its not, what could i google to find a solution in javascript or something?
ive been trying to figure this problem out for days now and my head hurts. i think i need another drink.
Can I Make A ScrollBar Work With Dynamic Text With Html Formatting?
I am loading text from an external file into a textbox with a scrollbar. I have html in the text file to change font color size etc. When I load the text it scrolls ok, but the tags are in the text and it isn't formatted. I checked on the html formatting in the properties box. What could I be doing wrong?
How To Make My Thumbnail Scroller Work?
Hello everyone,
i am very new at this forum. I need some help from some of you flash experts about this particular tutorial listed below:
http://www.kirupa.com/developer/mx2004/thumbnails.htm
I am currently using Flash MX. Ive had a hard time opening the source file so I tried to go back to the previous tutorial listed below: http://www.kirupa.com/developer/mx20...otogallery.htm and use it as the source file to work on this tutorial. The end result was that the main photo viewer window was working fine with "prev" and "next" button but the thumbnails viewer window was empty.
Can someone provide me some advice on how to make it work or provide me with source file for Flash MX. Thank you in advance.
Juliana
[CS3] Trying Make Flash Scroller That Reads From XML Work
I've attached the code for download.
Essentially what I am trying to create is a flash program that will read from an XML file AND automatically scroll downward. Once it hits the bottom it will repeat from the top of it seamlessly.
It does read the XML so YAY on that...
Convert Movieclip Scroller To Dynamic Text Scroller
I have code I borrowed that is set up to scroll a movie clip image. However, it doesn't work well if I replace the graphics with a text box as the scrolling becomes "jerky" as I think there is too much information for it to process with the complexity of the text. So I was hoping to change the scrolling content from a movie clip image with text to a dynamic textbox. But it will not function when I do that change. In this currrent setup, the movieclip instance name is "contentmain". I tried naming the instance of the dynamic textbox with that name, but no text shows up next to the scroller when I play the movie.
Here's the code:
scrolling = function () {
var scrollHeight:Number = scrollTrac._height;
var contentHeight:Number = contentMain._height;
var scrollFaceHeight:Number = scrollFace._height;
var maskHeight:Number = maskedView._height;
var initPosition:Number = scrollFace._y=scrollTrac._y;
var initContentPos:Number = contentMain._y;
var finalContentPos:Number = maskHeight-contentHeight+initContentPos;
var left:Number = scrollTrac._x;
var top:Number = scrollTrac._y;
var right:Number = scrollTrac._x;
var bottom:Number = scrollTrac._height-scrollFaceHeight+scrollTrac._y;
var dy:Number = 0;
var speed:Number = 10;
var moveVal:Number = (contentHeight-maskHeight)/(scrollHeight-scrollFaceHeight);
// Setup easing event
contentMain.desiredX = contentMain._y;
contentMain.onEnterFrame = function() {
this._y -= (this._y - this.desiredX) / 3;
};
scrollFace.onPress = function() {
var currPos:Number = this._y;
startDrag(this, false, left, top, right, bottom);
this.onMouseMove = function() {
dy = Math.abs(initPosition-this._y);
contentMain.desiredX = Math.round(dy*-1*moveVal+initContentPos);
};
};
scrollFace.onMouseUp = function() {
stopDrag();
delete this.onMouseMove;
};
btnUp.onPress = function() {
this.onEnterFrame = function() {
if (contentMain._x+speed<maskedView._x) {
if (scrollFace._x<=left) {
scrollFace._x = left;
} else {
scrollFace._x -= speed/moveVal;
}
contentMain._x += speed;
} else {
scrollFace._x = left;
contentMain._x = maskedView._x;
delete this.onEnterFrame;
}
};
};
btnUp.onDragOut = function() {
delete this.onEnterFrame;
};
btnUp.onRelease = function() {
delete this.onEnterFrame;
};
btnDown.onPress = function() {
this.onEnterFrame = function() {
if (contentMain._x-speed>finalContentPos) {
if (scrollFace._x>=right) {
scrollFace._x = right;
} else {
scrollFace._x += speed/moveVal;
}
contentMain._x -= speed;
} else {
scrollFace._x = right;
contentMain._x = finalContentPos;
delete this.onEnterFrame;
}
};
};
btnDown.onRelease = function() {
delete this.onEnterFrame;
};
btnDown.onDragOut = function() {
delete this.onEnterFrame;
};
if (contentHeight<maskHeight) {
scrollFace._visible = false;
btnUp.enabled = false;
btnDown.enabled = false;
} else {
scrollFace._visible = true;
btnUp.enabled = true;
btnDown.enabled = true;
}
};
scrolling();
Any ideas?
Thanks,
Dave
Convert Movieclip Scroller To Dynamic Text Scroller
I have code I borrowed that is set up to scroll a movie clip image. However, it doesn't work well if I replace the graphics with a text box as the scrolling becomes "jerky" as I think there is too much information for it to process with the complexity of the text. So I was hoping to change the scrolling content from a movie clip image with text to a dynamic textbox. But it will not function when I do that change. In this currrent setup, the movieclip instance name is "contentmain". I tried naming the instance of the dynamic textbox with that name, but no text shows up next to the scroller when I play the movie.
Here's the code:
scrolling = function () {
var scrollHeight:Number = scrollTrac._height;
var contentHeight:Number = contentMain._height;
var scrollFaceHeight:Number = scrollFace._height;
var maskHeight:Number = maskedView._height;
var initPosition:Number = scrollFace._y=scrollTrac._y;
var initContentPos:Number = contentMain._y;
var finalContentPos:Number = maskHeight-contentHeight+initContentPos;
var left:Number = scrollTrac._x;
var top:Number = scrollTrac._y;
var right:Number = scrollTrac._x;
var bottom:Number = scrollTrac._height-scrollFaceHeight+scrollTrac._y;
var dy:Number = 0;
var speed:Number = 10;
var moveVal:Number = (contentHeight-maskHeight)/(scrollHeight-scrollFaceHeight);
// Setup easing event
contentMain.desiredX = contentMain._y;
contentMain.onEnterFrame = function() {
this._y -= (this._y - this.desiredX) / 3;
};
scrollFace.onPress = function() {
var currPos:Number = this._y;
startDrag(this, false, left, top, right, bottom);
this.onMouseMove = function() {
dy = Math.abs(initPosition-this._y);
contentMain.desiredX = Math.round(dy*-1*moveVal+initContentPos);
};
};
scrollFace.onMouseUp = function() {
stopDrag();
delete this.onMouseMove;
};
btnUp.onPress = function() {
this.onEnterFrame = function() {
if (contentMain._x+speed<maskedView._x) {
if (scrollFace._x<=left) {
scrollFace._x = left;
} else {
scrollFace._x -= speed/moveVal;
}
contentMain._x += speed;
} else {
scrollFace._x = left;
contentMain._x = maskedView._x;
delete this.onEnterFrame;
}
};
};
btnUp.onDragOut = function() {
delete this.onEnterFrame;
};
btnUp.onRelease = function() {
delete this.onEnterFrame;
};
btnDown.onPress = function() {
this.onEnterFrame = function() {
if (contentMain._x-speed>finalContentPos) {
if (scrollFace._x>=right) {
scrollFace._x = right;
} else {
scrollFace._x += speed/moveVal;
}
contentMain._x -= speed;
} else {
scrollFace._x = right;
contentMain._x = finalContentPos;
delete this.onEnterFrame;
}
};
};
btnDown.onRelease = function() {
delete this.onEnterFrame;
};
btnDown.onDragOut = function() {
delete this.onEnterFrame;
};
if (contentHeight<maskHeight) {
scrollFace._visible = false;
btnUp.enabled = false;
btnDown.enabled = false;
} else {
scrollFace._visible = true;
btnUp.enabled = true;
btnDown.enabled = true;
}
};
scrolling();
Any ideas?
Thanks,
Dave
Dynamic Scroller Doesn't Work Right
Hi,
I've added more photos and text to the copyrights section of a site. However with the added content, the red background doesn't fully display:
www.cedarparkent.com/reachglobal.com/index.html
Not sure if this is an xml problem or a scroll pane problem.
If anyone can help, I am willing to send over any needed files.
Thanks.
My Text Scroller Does Not Work
I'm a AactionScript newbie and I'm trying to create a simple text scroller, so here is the code:
Code:
var scrollDirection:String;
var myLV:LoadVars = new LoadVars();
myLV.onLoad = function(success){
if(success){
_root.tekst_txt.htmlText = myLV.info;
} else {
_root.tekst_txt.text = "Problem loading the text";
}
}
myLV.load("qwe.txt");
this.scrollerUp_mc.onPress = function(){
scrollDirection = "up";
scroller();
}
this.scrollerDown_mc.onPress = function(){
scrollDirection = "down";
scroller();
}
function scroller(){
_root.onEnterFrame = function(){
if(scrollDirection = "up"){
tekst_txt.scroll -= 1;
} else if (scrollDirection = "down"){
tekst_txt.scroll += 1;
}
}
}
I can't see any problem, also when I hit Ctrl+ENTER it does not show me any errors
How Do I Make A Text Scroller?
I downloaded an example of a text scroller and in the action scripting i get lost...basically how do I define the telltarget function??
Why Doesn't My Text Scroller Work?
So I got a text scroller from Billy T's tutorial.
Then I mad some simple sizing modificattions and now the scroller doesn't work.
Could someone take a look?
Here's the download: http://www.caillouette.com/scrolling_text.zip
thanks
Text Scroller Download Can You Make Smoother Scrol
If I give you this text scroller download can you make it scroll smoother? Thats the challenge I havent seen one roll smoothe yet. Can you apply some code to make it scrol in small pixel amounts and speed as well? So that it rolls up or down the screen the same as movie words scrol on the TV screen?
http://www.geocities.com/jaffasoft2/texscroller.fla
Loss Of Text Formatting When Using Dynamic Text Field & Scroller
Hi all,
Using MX...
Another small problemo im having is when i format text in my dynamic text field and attch the scroller component to it, in preview mode i lose all the text format and it goes to the first text format it encounters and uses that for everything else in the dynamic text box.
Im not actually loading any text into the dynamic text box, im just using it with static text, so i can use the scroller component.(as i understand it, you can only attach the scroller component to a dynamic text box ??)
Why am i losing my text format AND is there a better way to have a scrolling text field when i just want to use static text...???
Thanks guys..hope thats not too confusing
Cheers
Dynamic Text Under Dynamic Mask W/ MS+ Scroller.......
Hola, everybody. I am stuck. I have some dynamic text under a dynamic mask.....I am using one of the MS+ scrollers (www.mirage-studios.com). This scroller requires the content to be under a mask. Since dynamic text wont show under a regular mask, I decieded to use a dynamic mask. The problem is that this scroller will only scroll up to the end of how big I made the dynamic text. Meaning if I made the dynamic text 500px in height, but the text being dynamically put in it, the scroller will only scroll down to that 500th pixel, rather than to the end of the text. Anyone know what I can do?
Thanks,
Gerard
How To Make This Dynamic Script Work?
Hi,
I am using the script posted by BlueCyan ( http://www.actionscript.org/forums/s...d.php3?t=48368 ) posts #2 and #3.
When I test on my Computer, it works like a charm. But when I upload it my server, it doesnt work.
However, is I type the direct address to the .swf file on the server (www.mydomain.com/path/slideshow.swf) it works perfect. But on an actual html page it does not work.
Here is the actual Action Script I am using (from BlueCyan)...
Code:
_global.image_arr = new Array("image0.jpg", "image1.jpg", "image2.jpg", "image3.jpg", "image4.jpg",
"image5.jpg", "image6.jpg", "image7.jpg", "image8.jpg", "image9.jpg",
"image10.jpg", "image11.jpg", "image12.jpg", "image13.jpg", "image14.jpg");
_global.temp_arr = _global.image_arr.distinctShuffle();
trace("original array : " + _global.image_arr);
trace("shuffled array : " + _global.temp_arr);
_global.count = 0;
this.createEmptyMovieClip("holder0_mc", 1000);
this.holder0_mc._x = 0;
this.holder0_mc._y = 0;
this.createEmptyMovieClip("holder1_mc", 1100);
this.holder1_mc._x = 0;
this.holder1_mc._y = 0;
loadImage(this);
function loadImage(loc)
{
this = loc;
_global.count++;
clearInterval(rotate_iv);
if (_global.temp_arr.length < 1)
{
trace("We are at the end of the temp_arr...");
trace("We need to add new items into the array again...");
_global.temp_arr = _global.image_arr.distinctShuffle();
}
selectedItem = _global.temp_arr.shift();
trace(selectedItem + " " + _global.temp_arr.length);
if (_global.count % 2 == 1)
{
toLoad = 1;
toUnload = 0;
}
else if (_global.count % 2 == 0)
{
toLoad = 0;
toUnload = 1;
}
//trace("toLoad = " + toLoad + " toUnload = " + toUnload + " this = " + this);
this["holder" + toLoad + "_mc"]._x = 500;
this["holder" + toLoad + "_mc"]._alpha = 0;
this["holder" + toLoad + "_mc"].loadMovie(selectedItem);
this["holder" + toUnLoad + "_mc"].onEnterFrame = function ()
{
if (this._parent["holder" + toLoad + "_mc"]._width > 1)
{
this._parent["holder" + toUnLoad + "_mc"].swapDepth(9999);
this._parent["holder" + toLoad + "_mc"].swapDelth(8888);
this._parent["holder" + toLoad + "_mc"]._x = 0;
if (this._parent["holder" + toLoad + "_mc"]._alpha < 100)
{
this._parent["holder" + toUnLoad + "_mc"]._alpha -= 5;
this._parent["holder" + toLoad + "_mc"]._alpha += 5;
}
else
{
this._parent["holder" + toLoad + "_mc"]._alpha = 100;
delete this.onEnterFrame;
rotate_iv = setInterval(loadImage, 6000, loc);
}
}
}
}
I am pretty sure that you have to tweak something in here, but I dont know how. Any help appreciated. Thanks in advance.
Dynamic Text Scroller (text Crawler?) NOT WORKING?
Hi, I am trying to make a movie that gets text from an external text file, and then scrolls it horizontally across the screen. I made a function that takes the object (movie clip with text) and moves it across the screen. it works fine except if the text is more than the width of the text field, i get this nasty trailing effect. it really sucks!
does anyone know a good way to do this? i would also like to be able to have mulitple texts, following eachother, and then looping to start over.
any info would be greatly appriciated!
-matt
Vertical Text Scroller That Works From Dynamic Text.
found this which is handy:
http://www.scriptocean.com/
but does not allow for external txt files to feed the info to it.
can anyone help me with a version of this ticker but with the use of an external txt file.
I want the file to link to a txt or xml file that can feed the swf file animation.
Thanks
Vertical Text Scroller That Works From Dynamic Text.
Vertical Text scroller that works from dynamic text.
found this which is handy:
http://www.scriptocean.com/
but does not allow for external txt files to feed the info to it.
can anyone help me with a version of this ticker but with the use of an external txt file.
I want the file to link to a txt or xml file that can feed the swf file animation.
Thanks
Dynamic Text Scroller ...
I've got the scroll button working on my dynamic text box, but it only goes one line at a time ... how do I make it scroll as long as the button is pressed?? Here's the current code for the 'up' button ...
on (press) {
displaysupdates.scroll = displaysupdates.scroll-1;
}
Anyone?? Does it have something to do with the number of lines it's moving determined with the "-1" of line 2???
Thanks a million ... in advance ... hehehe.
greg
420
http://www.20202020.net
Dynamic Text Box Scroller
I am having issues making dynamic text change font colors. Here is the link to the site:
http://www.largelab.com/diplomatic/test/home.html
Click on links, and you will see the field I'm trying it on.
Here is the link to the .txt file if it helps. It is a long string, but at the end, where "The End" is, I have a font tag around it which isn't working.
http://www.largelab.com/diplomatic/t...data/links.txt
What am I missing?
Dynamic Text Scroller
Hi,
I got some text pulled out of a file and displayed in a dynamic text field which works fine. Is there a way to create a custom scroller for dynamic text so not the yuck default scroller I just want simple two buttons up down. The problem is once I create this using action script I discovered that dynamic text can't be masked out so my whole scroller is useless in this case. Is there a way to go around this ?
Cheers
Scroller And Dynamic Text Help
HI
i have flash mx2004 professional.
is there a way to change the color of the scrollbar and make the dynamic text box transparent. actually is there a scrollbar in this version cuz i can't seem to find it.
thanks
Need Some Help With A Dynamic Text Scroller
Hi I'm having some problems understanding the scripting in a file listed on this site, and also hope to make some modifications.
Here is the link to the file I am trying to figure out:
http://www.flashkit.com/movies/Scrip...5640/index.php
So everything works great, but if you run the file you can click on the top tab and you are able to drag the whole box around. I want to modify so that the text box is stationary.
The second thing I am looking to do is working with the location of the tab.. When the box is loaded, I want the box to stay in this spot, but when it is minimized, as you will see in the file, I want the tab to move itself to a new location. Then when the minimized tab is clicked to maximize, I want the text box to open in the original location.
Is this possible, and if so how do I modify the code? I'm a newbie, so please be gentle!
Thanks so much!
-patrick
Dynamic Text Scroller
Im working on adding a dynamic scrolling text area to a project and have been referencing these two tutorials.
http://www.flashkit.com/tutorials/I..._-640/more5.php
http://www.actionscript.org/resourc...-box/Page3.html
I am coming across a problem where my dynamic text box doesn't show up. Right now I have the main timeline with a movieclip containing the animation and content. Inside this movie clip, on its own layer is my containerMC with the text box, buttons and scripts. Any ideas or a different tutorial that may work better?
Thanks
Help For Dynamic Text Scroller
I am looking to create a good dynamic text scroller like the one that
is a component. Any one have information on how to make one it is
really appreciated.
Thanks
Randy
Scroller For Dynamic Text
I can make a scroller work for input text but when I do the same thing for dynamic it does not work ..whats the secrete or the action scripting I need to make my scroller work with the dynamic text box....I linked the scroller to the instance name of the text box and set the var to the txt file in the supporting yellow folder just like ya do for input any help here would be appreciated....
Dynamic Text Scroller
I've successfully created a dynamic text box which displays an external text file, and scrolls via up and down buttons that I created.
The problem I'm having is that on one of the text boxes, it displays the text, but when I go to scroll, it only scrolls about 2 clicks then just stops scrolling, when there are about four more paragraphs that are not showing up. It just won't scroll anymore.
And, the first scroll box that I have, it scrolls down with 4 or 5 clicks, and shows everything.
Any clue why the above mentioned scroll box would just stop scrolling when there is plenty more text to reveal.
Here's the actionscript I have on the first frame on that frame....
loadText = new loadVars();
loadText.load("exp.txt");
loadText.onLoad = function() {
expbox.text = this.exptext;
};
here's the actionscript on the down button:
on (press) {
expbox.scroll +=1;
}
Any help is greatly appreciated!!!!
Thanks!
Dynamic Text Scroller Box Help
Hi All,
I've been looking for a basic dynamic text scroll box - nothing fancy like the Flash default one, which I can customise.
I have several external .txt files which populate a dynamic text field in a movieClip based on the user selection. The movieClip needs to adjust the scroll bars according to the volume of text in the external file.
That's about the long and short of it. Thought this would be simple but it's driving me nuts.
I've searched many a flash web sites but no luck. I've even had a look at skinning the Flash one but it's way past my newbie experience.
Would greatly appreciate any help, suggestions, etc.
Thanks
T
Dynamic Text Scroller
So I've spent hours on this, and will be grateful beyond belief if someone can help me.
I followed this example, and the txt scroller bar is white with no controls. What am I doing wrong?
http://www.kirupa.com/developer/mx/dynamic_scroller.htm
Scroller And Dynamic Text
i am using the flash 8 scroller component with a dynamic text field.
The problem i am running into is that the xml takes longer to load than the scroller and the scroller does not seem to update itself once the dynamic text field is populated, any ideas?
Dynamic Text Scroller HELP
I'm trying to make a scroller just like in the attached image...
The text needs to be read from a .txt or xml file so I can easily update it outside of flash... and it must be right aligned too
I've been looking trough tons of other scrollers out there, but not one seams to be exactly what I'm looking for... It doesn't need easing or anything else fancy...
I'm sure some of the flash-experts in here know how to do this
Dynamic Text Scroller
Hello everyone!
I am having a problem that for the life of me I cannot figure out.
I have a text box that is being filled dynamically by some data being read from an XML file. That is working fine, but I want to make a custom scroll bar.
I have already created a slider like the one detailed in the Kirupa tutorial (here: http://www.kirupa.com/developer/mx/slider.htm), and that's what I want to use as my scoll bar... however I do not know where to go from here.
If anyone could give me a kick in the right direction it would be a great help. I have a deadline at work and I am going to lose my mind if I can't get this figured out.
Thanks,
--d
Scroller With Dynamic Text
I have been following this tutorial http://www.kirupa.com/developer/mx/textscroller.htm to create a scroller. I can get this to work when I just follow the tutorial and copy and paste the text directly into the text box, but I have been trying to load text from a .txt file and haven't been able to get the scroller to work. Originally before i included a scroller I was using this code to load my text into the dynamic text box: loadVariables("assets/Welcome_Home.txt", this); and had labeled the text box with a variable name of content. I'm not really sure how to get the text to load and the scroller to work. I can get the text to load from the txt file, but the scroller won't work. I've labled the instance of the dynamic text box as scroller. So basically I want to know what I need to do to get the scroller to work with loading dynamic text from the .txt file.
Scroller For Dynamic Text
I can make a scroller work for input text but when I do the same thing for dynamic it does not work ..whats the secrete or the action scripting I need to make my scroller work with the dynamic text box....I linked the scroller to the instance name of the text box and set the var to the txt file in the supporting yellow folder just like ya do for input any help here would be appreciated....
Dynamic Text Scroller
I've successfully created a dynamic text box which displays an external text file, and scrolls via up and down buttons that I created.
The problem I'm having is that on one of the text boxes, it displays the text, but when I go to scroll, it only scrolls about 2 clicks then just stops scrolling, when there are about four more paragraphs that are not showing up. It just won't scroll anymore.
And, the first scroll box that I have, it scrolls down with 4 or 5 clicks, and shows everything.
Any clue why the above mentioned scroll box would just stop scrolling when there is plenty more text to reveal.
Here's the actionscript I have on the first frame on that frame....
loadText = new loadVars();
loadText.load("exp.txt");
loadText.onLoad = function() {
expbox.text = this.exptext;
};
here's the actionscript on the down button:
on (press) {
expbox.scroll +=1;
}
Any help is greatly appreciated!!!!
Thanks!
Dynamic Text Scroller Help
I have a txt dynamic driven text reader that does display the text correctly in the dynamic text field however I am having trouble with the scroller. This is what i have so far.
this is the code I have in frame 1:
up_btn.onPress = function() {
text1.scroll += 1;
};
I have 2 arrows to move it, this is the code for the up arrow button:
on (press) {
text1.scroll = text1.scroll+10;
}
It isn;t working - can anyone advise on what I am doing wrong or am missing here??
thanks!
XML Dynamic Text Scroller
Ok just throwing it out there. Does anyone have a FLA to share that is an XML based dynamic text scroller. If it has easing that would be even better. The one Ive been using for last 2 years doesn't seem to agree with CS3. All good things must come to an end I suppose. Thanks
Can’t Make My CSS Code Work For My Dynamic Loaded XML Button Box
Hello there,
I’m a designer developing and drawing manly for web applications.
AS3 is completely new to me so I went trough a book to learn the basics and with some help from here and there I build my first clean coded and dynamic loaded Button Box. Everything worked fine until I tried to format the text with CSS.
I just can’t make it work! Please help, I spend so much time coding this and now I’m stuck!!!
I know, it’s a lot of code divided into 4 as-classes who communicates between each other.
Here you can see the latest example: http://www.ferylee.com/flash/
Here you can download the source files (ZIP): http://www.ferylee.com/flash/VisorImagenes.zip
and
Here the 3 classes including the code for the CCS:
1) Box_Buttons.as
Main box that loads all the content into it, also the CSS
Code:
package {
//
//------------------------------
//IMPORTAR CLASES DE FLASH
//------------------------------
//
import flash.display.MovieClip;
import flash.events.Event;
import flash.events.IOErrorEvent;
import flash.text.TextField;
import flash.text.StyleSheet;
import flash.net.URLLoader;
import flash.net.URLRequest;
import flash.utils.getDefinitionByName;
//
//importar de la biblioteca, las propiedades de los Iconos para "Button_Aqua_Icon"
import ZonaPersonal;
import Imprimir;
import DescargaPP;
import DescargaImagen;
import LupaMas;
import LupaMenos;
//
import Separador;
//
//----------------------------
//CREAR CLASE "Box_Buttons"
//----------------------------
//
public class Box_Buttons extends MovieClip {
//
//----------------------------
//DEFINIR VARIABLES
//----------------------------
//
//vars para la comprobación de carga de xml y css
private var _xmlLoaded:Boolean;
private var _cssLoaded:Boolean;
private var _started:Boolean;
//
//xml loader vars
private var _xmlLoader:URLLoader;
private var _xmlData:XML;
public var _xmlReq:URLRequest=new URLRequest("xml/flash_Box_Buttons.xml");
//
//css loader vars
private var _cssLoader:URLLoader;
private var _cssStyle:StyleSheet;
public var _cssReq:URLRequest=new URLRequest("css/flash_Visor.css");
//
//definir "Txt_Field_ButDisplay" y su posicionamiento
private var _butDisplay:Txt_Field_ButDisplay;
private var _butDisplayX:Number=6;
private var _butDisplayY:Number=12;
//
//definir "Button_Aqua_Icon" y su posicionamiento
private var _butAquaIco:Button_Aqua_Icon;
private var _butAquaIcoX:Number=5;
private var _butAquaIcoY:Number=36;
//
//definir "Separador" y su posicionamiento
private var _separador:Separador;
private var _separadorX:Number=8;
private var _separadorY:Number=82;
//
//lista de Iconos del XML para los "Button_Aqua_Icon's"
private var _listaIconos:XMLList;
//
//lista de textos del XML para visualos en el
//butDisplay al hacer rollOver en "Button_Aqua_Icon's"
private var _listaEtiquetas:XMLList;
//
//definir "Button_Aqua_Text" y su posicionamiento
private var _butAquaTxt:Button_Aqua_Text;
private var _butAquaTxtX:Number=5;
private var _butAquaTxtY:Number=94;
//
//lista de textos del XML para los "Button_Aqua_Texto's"
private var _listaTextos:XMLList;
//
//----------------------------
//CREAR FUNCIONES PUBLICAS(funciones que comunican con el exterior)
//----------------------------
//
public function Box_Buttons() {
//
//poner la carga del xml y css a false
_xmlLoaded=false;
_cssLoaded=false;
_started=false;
//
//load xml
_xmlLoader=new URLLoader ;
_xmlLoader.load(_xmlReq);
//
//load css
_cssLoader=new URLLoader ;
_cssLoader.load(_cssReq);
//
//crear XML and CSS EventListener para escuchar estado de evento
_xmlLoader.addEventListener(Event.COMPLETE,onXMLload);
_cssLoader.addEventListener(Event.COMPLETE,onCSSLoad);
_xmlLoader.addEventListener(IOErrorEvent.IO_ERROR,xmlLoadError);
_cssLoader.addEventListener(IOErrorEvent.IO_ERROR,cssLoadError);
//
}
//
//----------------------------
//CREAR FUNCIONES PRIVADAS(funciones internas)
//----------------------------
//
private function onXMLload(ev:Event):void {
//
//delegar las estiquetas del xml a los textos
_xmlData=new XML(ev.target.data);
_listaIconos=_xmlData.butAquaIcon.but.attributes();
_listaEtiquetas=_xmlData.butAquaIcon.but.txt.children();
_listaTextos=_xmlData.butAquaText.but.txt.children();
//
//comprovando que xml y css estén cargados a la vez
_xmlLoaded=true;
//
//si esta carago xml y css, hacemos visible los elementos "postLoad()"
if (_cssLoaded == true && _started == false) {
_started=true;
postLoad();
}
//trace(event.target.data);
//trace(_xmlData.butAquaIcon.but.attributes());
//trace(_xmlData.butAquaIcon.but.txt.children());
}
//
private function onCSSLoad(ev:Event):void {
//
//delegar las estiquetas del ccs a los textos
_cssStyle=new StyleSheet ;
_cssStyle.parseCSS(ev.target.data);
//
//comprovando que css y xml estén cargados a la vez
_cssLoaded=true;
//
//si esta carago css y xml, hacemos visible los elementos "postLoad()"
if (_xmlLoaded == true && _started == false) {
_started=true;
postLoad();
}
//trace(event.target.data);
}
//
private function xmlLoadError(event:IOErrorEvent):void {
trace("ERROR LOADING XML");
}
//
private function cssLoadError(event:IOErrorEvent):void {
trace("ERROR LOADING CSS");
}
//
private function postLoad() {
//situar objetos en el stage
cajaTitBox();
separa();
crearBotonesIconos();
crearBotonesTextos();
pos_CB();
}
//
private function cajaTitBox() {
//
//situar el "Txt_Field_ButDisplay" dentro del "Box_Buttons"
_butDisplay=new Txt_Field_ButDisplay ;
_butDisplay.setEstilo(_cssStyle);
this.addChild(_butDisplay);
//
//posicionar el "Txt_Field_ButDisplay"
_butDisplay.x=_butDisplayX;
_butDisplay.y=_butDisplayY;
}
//
private function crearBotonesIconos() {
//
for (var i:Number=0; i < _listaEtiquetas.length(); i++) {
//
//situar "Button_Aqua_Icon" dentro del "Box_Buttons"
_butAquaIco=new Button_Aqua_Icon ;
this.addChild(_butAquaIco);
//
//definir la "_listaEtiquetas" y la "_listaIconos" para la comunicación entre Clases
_butAquaIco.setIcono(_listaEtiquetas[i],string2object(_listaIconos[i]));
//
//comunicamos entre Clases
_butAquaIco.setIcoTitBox(_butDisplay);
//
//posicionar los "Button_Aqua_Icon's"
_butAquaIco.x=_butAquaIcoX;
_butAquaIco.y=_butAquaIcoY;
//
//offset de los "Button_Aqua_Icon's"
_butAquaIcoX+= _butAquaIco.width;
}
}
//
//función que convierte el texto(string) del XML a Objeto para poder utilizarlo como Clase
//esto sirve para incrustar los iconos de la libreria en los botones a traves del xml
private function string2object(nombre:String) {
var _classReference:Class=getDefinitionByName(nombre) as Class;
var _instance:Object=new _classReference ;
return _instance;
}
//
private function separa() {
//
//situar el "Separador" de la biblioteca dentro del "Box_Buttons"
_separador=new Separador ;
this.addChild(_separador);
//
//posicionar el "Separador"
_separador.x=_separadorX;
_separador.y=_separadorY;
}
//
private function crearBotonesTextos() {
//
for (var k:Number=0; k < _listaTextos.length(); k++) {
//
//situar "Button_Aqua_Text" dentro del "Box_Buttons"
_butAquaTxt=new Button_Aqua_Text ;
this.addChild(_butAquaTxt);
//
//definir la "_listaTextos" para la comunicación entre Clases
_butAquaTxt.setTexto(_listaTextos[k]);
_butAquaTxt.setEstilo(_cssStyle);
//
//posicionar los "Button_Aqua_Texto's"
_butAquaTxt.x=_butAquaTxtX;
_butAquaTxt.y=_butAquaTxtY;
//
//offset de los "Button_Aqua_Texto's"
_butAquaTxtY+= _butAquaTxt.height;
}
}
//
private function pos_CB() {
//
//definir el color de la "cajaBut"
this.cajaBut_mc.transform.colorTransform=_butAquaIco._BackColor;
this.cajaButFinal_mc.transform.colorTransform=_butAquaIco._BackColor;
//
if (_listaTextos == null || _listaTextos.length() == 0) {
//
//posicionamiento automatico de "cajaButFinal"
this.cajaButFinal_mc.y=this.cajaBut_mc.height;
//
//hacer invisible el "Separador"
_separador.visible=false;
} else {
//
//alargamiento automatico de "cajaBut"
this.cajaBut_mc.height=_butAquaTxtY;
//
//posicionamiento automatico de "cajaButFinal"
this.cajaButFinal_mc.y=this.cajaBut_mc.height;
}
}
}
}
2) Txt_Field_ButDisplay.as
Text display for the icon buttons (the CSS should be applied to the TextField “field_txt”)
Code:
package {
//
//------------------------------
//IMPORTAR CLASES DE FLASH
//------------------------------
//
import flash.display.MovieClip;
import flash.text.TextField;
import flash.text.StyleSheet;
import flash.text.TextFieldAutoSize;
//
//----------------------------
//CREAR CLASE "Txt_Field_ButDisplay"
//----------------------------
//
public class Txt_Field_ButDisplay extends MovieClip {
//
//----------------------------
//DEFINIR VARIABLES
//----------------------------
//
//el asterisco(*) se pone si aún esta por definir el contenido a cargar
private var _texto:*;
private var _cssStyle:StyleSheet;
//
//----------------------------
//CREAR FUNCIONES PUBLICAS(funciones que comunican con el exterior)
//----------------------------
//
public function setTexto(texto:*):void {
_texto = texto;
//trace(texto);
//
//aplicar las funciónes de las propiedades a la caja texto
this.TextSettings(this.field_txt);
}
//
public function setEstilo(cssStyle:StyleSheet) {
_cssStyle = cssStyle;
//trace(cssStyle);
}
//
//----------------------------
//CREAR FUNCIONES PRIVADAS(funciones internas)
//----------------------------
//
//properties for TextAreas
private function TextSettings(txtSet) {
//
txtSet.autoSize = TextFieldAutoSize.CENTER;
txtSet.selectable = false;
txtSet.wordWrap = false;
txtSet.condenseWhite = true;
txtSet.htmlText = _texto;
txtSet.styleSheet = _cssStyle;
}
}
}
3) Button_Aqua_Text.as
Vertical alignment of text buttons (the CSS should be applied to the TextField “field_txt”)
Code:
package {
//
//------------------------------
//IMPORTAR CLASES DE FLASH
//------------------------------
//
import flash.display.MovieClip;
import flash.events.MouseEvent;
import flash.filters.GlowFilter;
import flash.geom.ColorTransform;
import flash.text.TextField;
import flash.text.StyleSheet;
import flash.text.TextFieldAutoSize;
//
//----------------------------
//CREAR CLASE "Button_Aqua_Text"
//----------------------------
//
public class Button_Aqua_Text extends MovieClip {
//
//----------------------------
//DEFINIR VARIABLES
//----------------------------
//
//el asterisco(*) se pone si aún esta por definir el contenido a cargar
private var _texto:*;
private var _cssStyle:StyleSheet;
//
//filter effect vars
private var _myGlowFilter:GlowFilter = new GlowFilter(0xFFFFFF, 0.5, 7, 7, 3, 2, false,false);
private var _ButColor:ColorTransform = new ColorTransform(1, 1, 1, 1, -30, 0, 20, 0);
public var _BackColor:ColorTransform = new ColorTransform(0, 0, 0, 1, 51, 51, 51, 0);
//
//----------------------------
//CREAR FUNCIONES PUBLICAS(funciones que comunican con el exterior)
//----------------------------
//
public function setTexto(texto:*):void {
_texto = texto;
//trace(texto);
//
//aplicar las funciónes de las propiedades a la caja texto
TextSettings(this.field_txt);
}
//
public function setEstilo(cssStyle:StyleSheet) {
_cssStyle = cssStyle;
//trace(cssStyle);
}
//
public function Button_Aqua_Text() {
//
//propiedades del Button_Aqua_Text
this.back_mc.transform.colorTransform = _BackColor;
this.but_mc.transform.colorTransform = _ButColor;
//
//hacer cambiar el cursor a modo boton
this.buttonMode = true;
//
//crear EventListener para escuchar estado de evento
this.addEventListener(MouseEvent.ROLL_OVER, onOver);
this.addEventListener(MouseEvent.ROLL_OUT, onOut);
}
//
//----------------------------
//CREAR FUNCIONES PRIVADAS(funciones internas)
//----------------------------
//
//properties for TextAreas
private function TextSettings(txtSet) {
//
txtSet.autoSize = TextFieldAutoSize.CENTER;
txtSet.selectable = false;
txtSet.wordWrap = false;
txtSet.condenseWhite = true;
txtSet.htmlText = _texto;
txtSet.styleSheet = _cssStyle;
}
//
private function onOver(event:MouseEvent):void {
//
//aplicar filtro
this.shine_mc.filters = [_myGlowFilter];
//
//aplicar alpha
this.but_mc.alpha = 0.4;
//
//hacer que se ponga el objeto rollOver arriba de todo
this.parent.addChild(this);
}
//
private function onOut(event:MouseEvent):void {
//
//quitar filtro
this.shine_mc.filters = [];
//
//quitar alpha
this.but_mc.alpha = 1.0;
}
}
}
Thanks a lot in advance
Can’t Make My CSS Code Work For My Dynamic Loaded XML Button Box
Hello there,
I’m a designer developing and drawing manly for web applications.
AS3 is completely new to me so I went trough a book to learn the basics and with some help from here and there I build my first clean coded and dynamic loaded Button Box. Everything worked fine until I tried to format the text with CSS.
I just can’t make it work! Please help, I spend so much time coding this and now I’m stuck!!!
I know, it’s a lot of code divided into 4 as-classes who communicates between each other.
Here you can see the latest example: http://www.ferylee.com/flash/
Here you can download the source files (ZIP): http://www.ferylee.com/flash/VisorImagenes.zip
and
Here the 3 classes including the code for the CCS:
1) Box_Buttons.as
Main box that loads all the content into it, also the CSS
Code:
package {
//
//------------------------------
//IMPORTAR CLASES DE FLASH
//------------------------------
//
import flash.display.MovieClip;
import flash.events.Event;
import flash.events.IOErrorEvent;
import flash.text.TextField;
import flash.text.StyleSheet;
import flash.net.URLLoader;
import flash.net.URLRequest;
import flash.utils.getDefinitionByName;
//
//importar de la biblioteca, las propiedades de los Iconos para "Button_Aqua_Icon"
import ZonaPersonal;
import Imprimir;
import DescargaPP;
import DescargaImagen;
import LupaMas;
import LupaMenos;
//
import Separador;
//
//----------------------------
//CREAR CLASE "Box_Buttons"
//----------------------------
//
public class Box_Buttons extends MovieClip {
//
//----------------------------
//DEFINIR VARIABLES
//----------------------------
//
//vars para la comprobación de carga de xml y css
private var _xmlLoaded:Boolean;
private var _cssLoaded:Boolean;
private var _started:Boolean;
//
//xml loader vars
private var _xmlLoader:URLLoader;
private var _xmlData:XML;
public var _xmlReq:URLRequest=new URLRequest("xml/flash_Box_Buttons.xml");
//
//css loader vars
private var _cssLoader:URLLoader;
private var _cssStyle:StyleSheet;
public var _cssReq:URLRequest=new URLRequest("css/flash_Visor.css");
//
//definir "Txt_Field_ButDisplay" y su posicionamiento
private var _butDisplay:Txt_Field_ButDisplay;
private var _butDisplayX:Number=6;
private var _butDisplayY:Number=12;
//
//definir "Button_Aqua_Icon" y su posicionamiento
private var _butAquaIco:Button_Aqua_Icon;
private var _butAquaIcoX:Number=5;
private var _butAquaIcoY:Number=36;
//
//definir "Separador" y su posicionamiento
private var _separador:Separador;
private var _separadorX:Number=8;
private var _separadorY:Number=82;
//
//lista de Iconos del XML para los "Button_Aqua_Icon's"
private var _listaIconos:XMLList;
//
//lista de textos del XML para visualos en el
//butDisplay al hacer rollOver en "Button_Aqua_Icon's"
private var _listaEtiquetas:XMLList;
//
//definir "Button_Aqua_Text" y su posicionamiento
private var _butAquaTxt:Button_Aqua_Text;
private var _butAquaTxtX:Number=5;
private var _butAquaTxtY:Number=94;
//
//lista de textos del XML para los "Button_Aqua_Texto's"
private var _listaTextos:XMLList;
//
//----------------------------
//CREAR FUNCIONES PUBLICAS(funciones que comunican con el exterior)
//----------------------------
//
public function Box_Buttons() {
//
//poner la carga del xml y css a false
_xmlLoaded=false;
_cssLoaded=false;
_started=false;
//
//load xml
_xmlLoader=new URLLoader ;
_xmlLoader.load(_xmlReq);
//
//load css
_cssLoader=new URLLoader ;
_cssLoader.load(_cssReq);
//
//crear XML and CSS EventListener para escuchar estado de evento
_xmlLoader.addEventListener(Event.COMPLETE,onXMLload);
_cssLoader.addEventListener(Event.COMPLETE,onCSSLoad);
_xmlLoader.addEventListener(IOErrorEvent.IO_ERROR,xmlLoadError);
_cssLoader.addEventListener(IOErrorEvent.IO_ERROR,cssLoadError);
//
}
//
//----------------------------
//CREAR FUNCIONES PRIVADAS(funciones internas)
//----------------------------
//
private function onXMLload(ev:Event):void {
//
//delegar las estiquetas del xml a los textos
_xmlData=new XML(ev.target.data);
_listaIconos=_xmlData.butAquaIcon.but.attributes();
_listaEtiquetas=_xmlData.butAquaIcon.but.txt.children();
_listaTextos=_xmlData.butAquaText.but.txt.children();
//
//comprovando que xml y css estén cargados a la vez
_xmlLoaded=true;
//
//si esta carago xml y css, hacemos visible los elementos "postLoad()"
if (_cssLoaded == true && _started == false) {
_started=true;
postLoad();
}
//trace(event.target.data);
//trace(_xmlData.butAquaIcon.but.attributes());
//trace(_xmlData.butAquaIcon.but.txt.children());
}
//
private function onCSSLoad(ev:Event):void {
//
//delegar las estiquetas del ccs a los textos
_cssStyle=new StyleSheet ;
_cssStyle.parseCSS(ev.target.data);
//
//comprovando que css y xml estén cargados a la vez
_cssLoaded=true;
//
//si esta carago css y xml, hacemos visible los elementos "postLoad()"
if (_xmlLoaded == true && _started == false) {
_started=true;
postLoad();
}
//trace(event.target.data);
}
//
private function xmlLoadError(event:IOErrorEvent):void {
trace("ERROR LOADING XML");
}
//
private function cssLoadError(event:IOErrorEvent):void {
trace("ERROR LOADING CSS");
}
//
private function postLoad() {
//situar objetos en el stage
cajaTitBox();
separa();
crearBotonesIconos();
crearBotonesTextos();
pos_CB();
}
//
private function cajaTitBox() {
//
//situar el "Txt_Field_ButDisplay" dentro del "Box_Buttons"
_butDisplay=new Txt_Field_ButDisplay ;
_butDisplay.setEstilo(_cssStyle);
this.addChild(_butDisplay);
//
//posicionar el "Txt_Field_ButDisplay"
_butDisplay.x=_butDisplayX;
_butDisplay.y=_butDisplayY;
}
//
private function crearBotonesIconos() {
//
for (var i:Number=0; i < _listaEtiquetas.length(); i++) {
//
//situar "Button_Aqua_Icon" dentro del "Box_Buttons"
_butAquaIco=new Button_Aqua_Icon ;
this.addChild(_butAquaIco);
//
//definir la "_listaEtiquetas" y la "_listaIconos" para la comunicación entre Clases
_butAquaIco.setIcono(_listaEtiquetas[i],string2object(_listaIconos[i]));
//
//comunicamos entre Clases
_butAquaIco.setIcoTitBox(_butDisplay);
//
//posicionar los "Button_Aqua_Icon's"
_butAquaIco.x=_butAquaIcoX;
_butAquaIco.y=_butAquaIcoY;
//
//offset de los "Button_Aqua_Icon's"
_butAquaIcoX+= _butAquaIco.width;
}
}
//
//función que convierte el texto(string) del XML a Objeto para poder utilizarlo como Clase
//esto sirve para incrustar los iconos de la libreria en los botones a traves del xml
private function string2object(nombre:String) {
var _classReference:Class=getDefinitionByName(nombre) as Class;
var _instance:Object=new _classReference ;
return _instance;
}
//
private function separa() {
//
//situar el "Separador" de la biblioteca dentro del "Box_Buttons"
_separador=new Separador ;
this.addChild(_separador);
//
//posicionar el "Separador"
_separador.x=_separadorX;
_separador.y=_separadorY;
}
//
private function crearBotonesTextos() {
//
for (var k:Number=0; k < _listaTextos.length(); k++) {
//
//situar "Button_Aqua_Text" dentro del "Box_Buttons"
_butAquaTxt=new Button_Aqua_Text ;
this.addChild(_butAquaTxt);
//
//definir la "_listaTextos" para la comunicación entre Clases
_butAquaTxt.setTexto(_listaTextos[k]);
_butAquaTxt.setEstilo(_cssStyle);
//
//posicionar los "Button_Aqua_Texto's"
_butAquaTxt.x=_butAquaTxtX;
_butAquaTxt.y=_butAquaTxtY;
//
//offset de los "Button_Aqua_Texto's"
_butAquaTxtY+= _butAquaTxt.height;
}
}
//
private function pos_CB() {
//
//definir el color de la "cajaBut"
this.cajaBut_mc.transform.colorTransform=_butAquaIco._BackColor;
this.cajaButFinal_mc.transform.colorTransform=_butAquaIco._BackColor;
//
if (_listaTextos == null || _listaTextos.length() == 0) {
//
//posicionamiento automatico de "cajaButFinal"
this.cajaButFinal_mc.y=this.cajaBut_mc.height;
//
//hacer invisible el "Separador"
_separador.visible=false;
} else {
//
//alargamiento automatico de "cajaBut"
this.cajaBut_mc.height=_butAquaTxtY;
//
//posicionamiento automatico de "cajaButFinal"
this.cajaButFinal_mc.y=this.cajaBut_mc.height;
}
}
}
}
2) Txt_Field_ButDisplay.as
Text display for the icon buttons (the CSS should be applied to the TextField “field_txt”)
Code:
package {
//
//------------------------------
//IMPORTAR CLASES DE FLASH
//------------------------------
//
import flash.display.MovieClip;
import flash.text.TextField;
import flash.text.StyleSheet;
import flash.text.TextFieldAutoSize;
//
//----------------------------
//CREAR CLASE "Txt_Field_ButDisplay"
//----------------------------
//
public class Txt_Field_ButDisplay extends MovieClip {
//
//----------------------------
//DEFINIR VARIABLES
//----------------------------
//
//el asterisco(*) se pone si aún esta por definir el contenido a cargar
private var _texto:*;
private var _cssStyle:StyleSheet;
//
//----------------------------
//CREAR FUNCIONES PUBLICAS(funciones que comunican con el exterior)
//----------------------------
//
public function setTexto(texto:*):void {
_texto = texto;
//trace(texto);
//
//aplicar las funciónes de las propiedades a la caja texto
this.TextSettings(this.field_txt);
}
//
public function setEstilo(cssStyle:StyleSheet) {
_cssStyle = cssStyle;
//trace(cssStyle);
}
//
//----------------------------
//CREAR FUNCIONES PRIVADAS(funciones internas)
//----------------------------
//
//properties for TextAreas
private function TextSettings(txtSet) {
//
txtSet.autoSize = TextFieldAutoSize.CENTER;
txtSet.selectable = false;
txtSet.wordWrap = false;
txtSet.condenseWhite = true;
txtSet.htmlText = _texto;
txtSet.styleSheet = _cssStyle;
}
}
}
3) Button_Aqua_Text.as
Vertical alignment of text buttons (the CSS should be applied to the TextField “field_txt”)
Code:
package {
//
//------------------------------
//IMPORTAR CLASES DE FLASH
//------------------------------
//
import flash.display.MovieClip;
import flash.events.MouseEvent;
import flash.filters.GlowFilter;
import flash.geom.ColorTransform;
import flash.text.TextField;
import flash.text.StyleSheet;
import flash.text.TextFieldAutoSize;
//
//----------------------------
//CREAR CLASE "Button_Aqua_Text"
//----------------------------
//
public class Button_Aqua_Text extends MovieClip {
//
//----------------------------
//DEFINIR VARIABLES
//----------------------------
//
//el asterisco(*) se pone si aún esta por definir el contenido a cargar
private var _texto:*;
private var _cssStyle:StyleSheet;
//
//filter effect vars
private var _myGlowFilter:GlowFilter = new GlowFilter(0xFFFFFF, 0.5, 7, 7, 3, 2, false,false);
private var _ButColor:ColorTransform = new ColorTransform(1, 1, 1, 1, -30, 0, 20, 0);
public var _BackColor:ColorTransform = new ColorTransform(0, 0, 0, 1, 51, 51, 51, 0);
//
//----------------------------
//CREAR FUNCIONES PUBLICAS(funciones que comunican con el exterior)
//----------------------------
//
public function setTexto(texto:*):void {
_texto = texto;
//trace(texto);
//
//aplicar las funciónes de las propiedades a la caja texto
TextSettings(this.field_txt);
}
//
public function setEstilo(cssStyle:StyleSheet) {
_cssStyle = cssStyle;
//trace(cssStyle);
}
//
public function Button_Aqua_Text() {
//
//propiedades del Button_Aqua_Text
this.back_mc.transform.colorTransform = _BackColor;
this.but_mc.transform.colorTransform = _ButColor;
//
//hacer cambiar el cursor a modo boton
this.buttonMode = true;
//
//crear EventListener para escuchar estado de evento
this.addEventListener(MouseEvent.ROLL_OVER, onOver);
this.addEventListener(MouseEvent.ROLL_OUT, onOut);
}
//
//----------------------------
//CREAR FUNCIONES PRIVADAS(funciones internas)
//----------------------------
//
//properties for TextAreas
private function TextSettings(txtSet) {
//
txtSet.autoSize = TextFieldAutoSize.CENTER;
txtSet.selectable = false;
txtSet.wordWrap = false;
txtSet.condenseWhite = true;
txtSet.htmlText = _texto;
txtSet.styleSheet = _cssStyle;
}
//
private function onOver(event:MouseEvent):void {
//
//aplicar filtro
this.shine_mc.filters = [_myGlowFilter];
//
//aplicar alpha
this.but_mc.alpha = 0.4;
//
//hacer que se ponga el objeto rollOver arriba de todo
this.parent.addChild(this);
}
//
private function onOut(event:MouseEvent):void {
//
//quitar filtro
this.shine_mc.filters = [];
//
//quitar alpha
this.but_mc.alpha = 1.0;
}
}
}
Thanks a lot in advance
Can’t Make My CSS Code Work For My Dynamic Loaded XML Button Box
Hello there,
I’m a designer developing and drawing manly for web applications.
AS3 is completely new to me so I went trough a book to learn the basics and with some help from here and there I build my first clean coded and dynamic loaded Button Box. Everything worked fine until I tried to format the text with CSS.
I just can’t make it work! Please help, I spend so much time coding this and now I’m stuck!!!
I know, it’s a lot of code divided into 4 as-classes who communicates between each other.
Here you can see the latest example: http://www.ferylee.com/flash/
Here you can download the source files (ZIP): http://www.ferylee.com/flash/VisorImagenes.zip
and
Here the 3 classes including the code for the CCS:
1) Box_Buttons.as
Main box that loads all the content into it, also the CSS
Code:
package {
//
//------------------------------
//IMPORTAR CLASES DE FLASH
//------------------------------
//
import flash.display.MovieClip;
import flash.events.Event;
import flash.events.IOErrorEvent;
import flash.text.TextField;
import flash.text.StyleSheet;
import flash.net.URLLoader;
import flash.net.URLRequest;
import flash.utils.getDefinitionByName;
//
//importar de la biblioteca, las propiedades de los Iconos para "Button_Aqua_Icon"
import ZonaPersonal;
import Imprimir;
import DescargaPP;
import DescargaImagen;
import LupaMas;
import LupaMenos;
//
import Separador;
//
//----------------------------
//CREAR CLASE "Box_Buttons"
//----------------------------
//
public class Box_Buttons extends MovieClip {
//
//----------------------------
//DEFINIR VARIABLES
//----------------------------
//
//vars para la comprobación de carga de xml y css
private var _xmlLoaded:Boolean;
private var _cssLoaded:Boolean;
private var _started:Boolean;
//
//xml loader vars
private var _xmlLoader:URLLoader;
private var _xmlData:XML;
public var _xmlReq:URLRequest=new URLRequest("xml/flash_Box_Buttons.xml");
//
//css loader vars
private var _cssLoader:URLLoader;
private var _cssStyle:StyleSheet;
public var _cssReq:URLRequest=new URLRequest("css/flash_Visor.css");
//
//definir "Txt_Field_ButDisplay" y su posicionamiento
private var _butDisplay:Txt_Field_ButDisplay;
private var _butDisplayX:Number=6;
private var _butDisplayY:Number=12;
//
//definir "Button_Aqua_Icon" y su posicionamiento
private var _butAquaIco:Button_Aqua_Icon;
private var _butAquaIcoX:Number=5;
private var _butAquaIcoY:Number=36;
//
//definir "Separador" y su posicionamiento
private var _separador:Separador;
private var _separadorX:Number=8;
private var _separadorY:Number=82;
//
//lista de Iconos del XML para los "Button_Aqua_Icon's"
private var _listaIconos:XMLList;
//
//lista de textos del XML para visualos en el
//butDisplay al hacer rollOver en "Button_Aqua_Icon's"
private var _listaEtiquetas:XMLList;
//
//definir "Button_Aqua_Text" y su posicionamiento
private var _butAquaTxt:Button_Aqua_Text;
private var _butAquaTxtX:Number=5;
private var _butAquaTxtY:Number=94;
//
//lista de textos del XML para los "Button_Aqua_Texto's"
private var _listaTextos:XMLList;
//
//----------------------------
//CREAR FUNCIONES PUBLICAS(funciones que comunican con el exterior)
//----------------------------
//
public function Box_Buttons() {
//
//poner la carga del xml y css a false
_xmlLoaded=false;
_cssLoaded=false;
_started=false;
//
//load xml
_xmlLoader=new URLLoader ;
_xmlLoader.load(_xmlReq);
//
//load css
_cssLoader=new URLLoader ;
_cssLoader.load(_cssReq);
//
//crear XML and CSS EventListener para escuchar estado de evento
_xmlLoader.addEventListener(Event.COMPLETE,onXMLload);
_cssLoader.addEventListener(Event.COMPLETE,onCSSLoad);
_xmlLoader.addEventListener(IOErrorEvent.IO_ERROR,xmlLoadError);
_cssLoader.addEventListener(IOErrorEvent.IO_ERROR,cssLoadError);
//
}
//
//----------------------------
//CREAR FUNCIONES PRIVADAS(funciones internas)
//----------------------------
//
private function onXMLload(ev:Event):void {
//
//delegar las estiquetas del xml a los textos
_xmlData=new XML(ev.target.data);
_listaIconos=_xmlData.butAquaIcon.but.attributes();
_listaEtiquetas=_xmlData.butAquaIcon.but.txt.children();
_listaTextos=_xmlData.butAquaText.but.txt.children();
//
//comprovando que xml y css estén cargados a la vez
_xmlLoaded=true;
//
//si esta carago xml y css, hacemos visible los elementos "postLoad()"
if (_cssLoaded == true && _started == false) {
_started=true;
postLoad();
}
//trace(event.target.data);
//trace(_xmlData.butAquaIcon.but.attributes());
//trace(_xmlData.butAquaIcon.but.txt.children());
}
//
private function onCSSLoad(ev:Event):void {
//
//delegar las estiquetas del ccs a los textos
_cssStyle=new StyleSheet ;
_cssStyle.parseCSS(ev.target.data);
//
//comprovando que css y xml estén cargados a la vez
_cssLoaded=true;
//
//si esta carago css y xml, hacemos visible los elementos "postLoad()"
if (_xmlLoaded == true && _started == false) {
_started=true;
postLoad();
}
//trace(event.target.data);
}
//
private function xmlLoadError(event:IOErrorEvent):void {
trace("ERROR LOADING XML");
}
//
private function cssLoadError(event:IOErrorEvent):void {
trace("ERROR LOADING CSS");
}
//
private function postLoad() {
//situar objetos en el stage
cajaTitBox();
separa();
crearBotonesIconos();
crearBotonesTextos();
pos_CB();
}
//
private function cajaTitBox() {
//
//situar el "Txt_Field_ButDisplay" dentro del "Box_Buttons"
_butDisplay=new Txt_Field_ButDisplay ;
_butDisplay.setEstilo(_cssStyle);
this.addChild(_butDisplay);
//
//posicionar el "Txt_Field_ButDisplay"
_butDisplay.x=_butDisplayX;
_butDisplay.y=_butDisplayY;
}
//
private function crearBotonesIconos() {
//
for (var i:Number=0; i < _listaEtiquetas.length(); i++) {
//
//situar "Button_Aqua_Icon" dentro del "Box_Buttons"
_butAquaIco=new Button_Aqua_Icon ;
this.addChild(_butAquaIco);
//
//definir la "_listaEtiquetas" y la "_listaIconos" para la comunicación entre Clases
_butAquaIco.setIcono(_listaEtiquetas[i],string2object(_listaIconos[i]));
//
//comunicamos entre Clases
_butAquaIco.setIcoTitBox(_butDisplay);
//
//posicionar los "Button_Aqua_Icon's"
_butAquaIco.x=_butAquaIcoX;
_butAquaIco.y=_butAquaIcoY;
//
//offset de los "Button_Aqua_Icon's"
_butAquaIcoX+= _butAquaIco.width;
}
}
//
//función que convierte el texto(string) del XML a Objeto para poder utilizarlo como Clase
//esto sirve para incrustar los iconos de la libreria en los botones a traves del xml
private function string2object(nombre:String) {
var _classReference:Class=getDefinitionByName(nombre) as Class;
var _instance:Object=new _classReference ;
return _instance;
}
//
private function separa() {
//
//situar el "Separador" de la biblioteca dentro del "Box_Buttons"
_separador=new Separador ;
this.addChild(_separador);
//
//posicionar el "Separador"
_separador.x=_separadorX;
_separador.y=_separadorY;
}
//
private function crearBotonesTextos() {
//
for (var k:Number=0; k < _listaTextos.length(); k++) {
//
//situar "Button_Aqua_Text" dentro del "Box_Buttons"
_butAquaTxt=new Button_Aqua_Text ;
this.addChild(_butAquaTxt);
//
//definir la "_listaTextos" para la comunicación entre Clases
_butAquaTxt.setTexto(_listaTextos[k]);
_butAquaTxt.setEstilo(_cssStyle);
//
//posicionar los "Button_Aqua_Texto's"
_butAquaTxt.x=_butAquaTxtX;
_butAquaTxt.y=_butAquaTxtY;
//
//offset de los "Button_Aqua_Texto's"
_butAquaTxtY+= _butAquaTxt.height;
}
}
//
private function pos_CB() {
//
//definir el color de la "cajaBut"
this.cajaBut_mc.transform.colorTransform=_butAquaIco._BackColor;
this.cajaButFinal_mc.transform.colorTransform=_butAquaIco._BackColor;
//
if (_listaTextos == null || _listaTextos.length() == 0) {
//
//posicionamiento automatico de "cajaButFinal"
this.cajaButFinal_mc.y=this.cajaBut_mc.height;
//
//hacer invisible el "Separador"
_separador.visible=false;
} else {
//
//alargamiento automatico de "cajaBut"
this.cajaBut_mc.height=_butAquaTxtY;
//
//posicionamiento automatico de "cajaButFinal"
this.cajaButFinal_mc.y=this.cajaBut_mc.height;
}
}
}
}
2) Txt_Field_ButDisplay.as
Text display for the icon buttons (the CSS should be applied to the TextField “field_txt”)
Code:
package {
//
//------------------------------
//IMPORTAR CLASES DE FLASH
//------------------------------
//
import flash.display.MovieClip;
import flash.text.TextField;
import flash.text.StyleSheet;
import flash.text.TextFieldAutoSize;
//
//----------------------------
//CREAR CLASE "Txt_Field_ButDisplay"
//----------------------------
//
public class Txt_Field_ButDisplay extends MovieClip {
//
//----------------------------
//DEFINIR VARIABLES
//----------------------------
//
//el asterisco(*) se pone si aún esta por definir el contenido a cargar
private var _texto:*;
private var _cssStyle:StyleSheet;
//
//----------------------------
//CREAR FUNCIONES PUBLICAS(funciones que comunican con el exterior)
//----------------------------
//
public function setTexto(texto:*):void {
_texto = texto;
//trace(texto);
//
//aplicar las funciónes de las propiedades a la caja texto
this.TextSettings(this.field_txt);
}
//
public function setEstilo(cssStyle:StyleSheet) {
_cssStyle = cssStyle;
//trace(cssStyle);
}
//
//----------------------------
//CREAR FUNCIONES PRIVADAS(funciones internas)
//----------------------------
//
//properties for TextAreas
private function TextSettings(txtSet) {
//
txtSet.autoSize = TextFieldAutoSize.CENTER;
txtSet.selectable = false;
txtSet.wordWrap = false;
txtSet.condenseWhite = true;
txtSet.htmlText = _texto;
txtSet.styleSheet = _cssStyle;
}
}
}
3) Button_Aqua_Text.as
Vertical alignment of text buttons (the CSS should be applied to the TextField “field_txt”)
Code:
package {
//
//------------------------------
//IMPORTAR CLASES DE FLASH
//------------------------------
//
import flash.display.MovieClip;
import flash.events.MouseEvent;
import flash.filters.GlowFilter;
import flash.geom.ColorTransform;
import flash.text.TextField;
import flash.text.StyleSheet;
import flash.text.TextFieldAutoSize;
//
//----------------------------
//CREAR CLASE "Button_Aqua_Text"
//----------------------------
//
public class Button_Aqua_Text extends MovieClip {
//
//----------------------------
//DEFINIR VARIABLES
//----------------------------
//
//el asterisco(*) se pone si aún esta por definir el contenido a cargar
private var _texto:*;
private var _cssStyle:StyleSheet;
//
//filter effect vars
private var _myGlowFilter:GlowFilter = new GlowFilter(0xFFFFFF, 0.5, 7, 7, 3, 2, false,false);
private var _ButColor:ColorTransform = new ColorTransform(1, 1, 1, 1, -30, 0, 20, 0);
public var _BackColor:ColorTransform = new ColorTransform(0, 0, 0, 1, 51, 51, 51, 0);
//
//----------------------------
//CREAR FUNCIONES PUBLICAS(funciones que comunican con el exterior)
//----------------------------
//
public function setTexto(texto:*):void {
_texto = texto;
//trace(texto);
//
//aplicar las funciónes de las propiedades a la caja texto
TextSettings(this.field_txt);
}
//
public function setEstilo(cssStyle:StyleSheet) {
_cssStyle = cssStyle;
//trace(cssStyle);
}
//
public function Button_Aqua_Text() {
//
//propiedades del Button_Aqua_Text
this.back_mc.transform.colorTransform = _BackColor;
this.but_mc.transform.colorTransform = _ButColor;
//
//hacer cambiar el cursor a modo boton
this.buttonMode = true;
//
//crear EventListener para escuchar estado de evento
this.addEventListener(MouseEvent.ROLL_OVER, onOver);
this.addEventListener(MouseEvent.ROLL_OUT, onOut);
}
//
//----------------------------
//CREAR FUNCIONES PRIVADAS(funciones internas)
//----------------------------
//
//properties for TextAreas
private function TextSettings(txtSet) {
//
txtSet.autoSize = TextFieldAutoSize.CENTER;
txtSet.selectable = false;
txtSet.wordWrap = false;
txtSet.condenseWhite = true;
txtSet.htmlText = _texto;
txtSet.styleSheet = _cssStyle;
}
//
private function onOver(event:MouseEvent):void {
//
//aplicar filtro
this.shine_mc.filters = [_myGlowFilter];
//
//aplicar alpha
this.but_mc.alpha = 0.4;
//
//hacer que se ponga el objeto rollOver arriba de todo
this.parent.addChild(this);
}
//
private function onOut(event:MouseEvent):void {
//
//quitar filtro
this.shine_mc.filters = [];
//
//quitar alpha
this.but_mc.alpha = 1.0;
}
}
}
Thanks a lot in advance
Dynamic Text Scroller Like OS Scrollbars
Does anyone know of a good scroller that uses scroll bars but can be used for dynamic text from a database or text file and the text area is resizable? Thanks!
Dynamic Flash Text Scroller?
Hi, I need to create a text "scroller" for headlines on a website, that moves vertically (up and down) not horizontally (left to right) and brings in text dynamically from a text file. I know that dynamic text can be brought into a flash movie for a scroller horizontally, but can you create a text scroller box that moves Vertically? I can't seem to get it to work. Thanks!
Help With External Dynamic Text And Scroller
can anyone help me ?
here is my situation.
my client wants an external .txt file that he can update himself,
the problem i'm having is that the external file wont load into a mc with a scroll bar? it only works without a scroll bar...
any help would be great thanks!!!
~Zain
find_zain@hotmail.com
Text Scroller With Dynamic Buttons...
Hi all,
Newbie to the forum, sp excuse any vagueness. I'm trying to construct a text scroller that is populated by links that refer to an external file eg a PDF. I know how to do a standard text scroller, dynamically fed etc, but I am lost now trying to solve this one.
Any help would be greatly appreciated. FYI, it is for a cd based product brochure with the PDF's containing the product info.
Hope this is clear enough & thanks in advance.
The Crate
More Dynamic Text/scroller Probs
Hey guys,
Ok I posted a problem last week I was having with Flash MX and dynamic text interaction with text files. Now I thought I solved the problem, however I'm still having small problems I'm not understading. Now on the site, which is currently up (http://www.cesium137.com), when you enter the site and click on the news section it brings up the Dynamic text however the scroll bar doesnt function. Now when you hit refresh and reopen the page it works. Every section subsequently does this. Does anyone know why this is or how to fix it?
i.r.
|