MJ
asked on
Have Text Fade in/out
Currently I have a movie that fades pics in and our based on some params in an inf file. Works great. My next step is to have the picture fade in as it currently does, stop, and then have text fade in over top the picture, and then have the text fade back out, and then have the picture fade back out. I want to know how I would change this exisitng Movie. Ideally like to have the text and timing of text fade, in the config file also.
Current movie:
1) picture fades in
2) picture fades out
Desired movie:
1) picture fades in
2) Stops
3)text fades in
4) text stops
4) text fades out
2) picture fades out
loops through all pics in config. file.
http://www.4shared.com/file/36253938/11fd147/fade.html
Current movie:
1) picture fades in
2) picture fades out
Desired movie:
1) picture fades in
2) Stops
3)text fades in
4) text stops
4) text fades out
2) picture fades out
loops through all pics in config. file.
http://www.4shared.com/file/36253938/11fd147/fade.html
Here is a good guide for parsing XML with Flash: http://www.darronschall.com/weblog/archives/000065.cfm
this application cannot be just modified. I took a look at your code and it needs to be rewritten, because the structure of what you need now is totally different from what you have.You need a chained animation flow , and what you have is a simple in out. It seems to me you got some code from internet. I think it will be difficult for someone to alter that code for you since it is all in AS 1.0 syntax (which is very old and boring ;) ). If you are interested in AS 3.0 or even AS 2.0 solution let me know. Although I spent some years of my life programming AS 1.0 , I really don't like it. So if you want just let me know.
ASKER
Hi Julianopolito... sure would appreciate the help! :0)
ok, so wait that I'm already doing it for you.
Here goes the swf file. It was made in AS3 using the caurina.transitions.Tweene r class for animation.
The code below is the class SlideShowText wich does everything. Made it in flex 2. But it should be easy to use it in flash cs 3 since I did not use nothing specific to flex, only it is important to embed the font in the flash cs3 library and export for action script so it can be faded.
The code below is the class SlideShowText wich does everything. Made it in flex 2. But it should be easy to use it in flash cs 3 since I did not use nothing specific to flex, only it is important to embed the font in the flash cs3 library and export for action script so it can be faded.
package{
import caurina.transitions.Tweener;
import flash.display.Loader;
import flash.display.Sprite;
import flash.events.Event;
import flash.events.IOErrorEvent;
import flash.net.URLLoader;
import flash.net.URLLoaderDataFormat;
import flash.net.URLRequest;
import flash.net.URLVariables;
import flash.text.Font;
import flash.text.TextField;
import flash.text.TextFormat;
public class SlideShowText extends Sprite{
private var images:XMLList;
private var texts:XMLList;
private var delay:Number = 0;
private var currentIndex:int = 0;
private var loader:Loader;
private var text:TextField;
private var xml:XML;
private var uloader:URLLoader;
[Embed(mimeType='application/x-font', source="arial.ttf", fontName="MyArial")]
private var uiArial:Class;
public function SlideShowText(){
uloader = new URLLoader();
uloader.addEventListener(Event.COMPLETE,onComplete);
uloader.load(new URLRequest("images.xml"));
loader = new Loader();
loader.contentLoaderInfo.addEventListener(Event.COMPLETE,imageComplete);
loader.addEventListener(IOErrorEvent.IO_ERROR,onError);
loader.alpha = 0;
loader.y = 15;
text = new TextField();
text.autoSize = "left";
trace(Font.enumerateFonts()[0].fontName);
var tf:TextFormat = new TextFormat("MyArial");
text.alpha = 0;
text.defaultTextFormat = tf;
text.embedFonts = true;
addChild(loader);
addChild(text);
}
private function onComplete(e:Event):void{
xml = new XML(uloader.data as String);
images = xml..image;
texts = xml..text;
delay = Number(xml.@delay);
initSlideShow();
}
private function onError(e:IOErrorEvent):void{
trace(e.text);
}
private function initSlideShow():void{
//First step - load first image and fade
loadImage(currentIndex);
}
private function loadImage(index:int):void{
var url:String = images[index].toString();
loader.load(new URLRequest(url));
}
public function imageComplete(e:Event):void{
text.text = texts[currentIndex];
imageIn();
}
public function imageIn():void{
Tweener.addTween(loader,{alpha:1.0,time:1,onComplete:textIn});
}
public function textIn():void{
Tweener.addTween(text,{alpha:1.0,time:1,onComplete:textOut});
}
public function textOut():void{
Tweener.addTween(text,{alpha:0.0,time:1,delay:3,onComplete:imageOut});
}
public function imageOut():void{
Tweener.addTween(loader,{alpha:0.0,time:1,onComplete:nextImage});
}
public function nextImage():void{
currentIndex++;
if(currentIndex >= images.length())currentIndex = 0;
loadImage(currentIndex);
}
}
}
slideshowtext.swf.pdf
also used a xml file. You need to put it in the same folder as the swf.
filename:images.xml
filename:images.xml
<?xml version="1.0" encoding="utf-8" ?>
<gallery delay="3000">
<item>
<image>images/km8030.jpg</image>
<text>text 1</text>
</item>
<item>
<image>images/bh750.jpg</image>
<text>text 2</text>
</item>
<item>
<image>images/km5050.jpg</image>
<text>text 3</text>
</item>
<item>
<image>images/bh650.jpg</image>
<text>text 4</text>
</item>
</gallery>
And about the "design", I did not bother about the look and feel. just made it functional so you can understand, and then create the look yourself.
ASKER
Hi Julian,
Thanks for all your help. Truly appreciate it! The question I still have is about the code you provided. Excuse my ignorance, it has been about 18 - 24 months since I've touched Flash and I was never any good at it! :0) But how do I use it? I've called external packages before but it was always as support to the main movie. Not sure how this fits in to Flash and using it would work???Do I just make my background and call the SlideShowText class? I'm assuming the package needs to be named also?
import ???.SlideShowText;
Thanks!
Thanks for all your help. Truly appreciate it! The question I still have is about the code you provided. Excuse my ignorance, it has been about 18 - 24 months since I've touched Flash and I was never any good at it! :0) But how do I use it? I've called external packages before but it was always as support to the main movie. Not sure how this fits in to Flash and using it would work???Do I just make my background and call the SlideShowText class? I'm assuming the package needs to be named also?
import ???.SlideShowText;
Thanks!
I'll make a flash cs3 version for you if you can wait till tonight. Then I explain some basics to you.ok?
ASKER
That would be incredible. Really appreciate the effort!
Thanks!
Thanks!
Here it goes. Unzip in the same folder. The fla document is in flash cs3 format. Change the extension to zip.
You 'll see I've commented all the code, so you can understand better. On stage you will find the textfield, so you can change color and font (don't forget to embed the font). The images must be 200x200 pixels (OR YOU CAN CHANGE STAGE SIZE in document properties - images will be scaled to the stage size - it is commented in the code). The xml contains the image paths and texts, and the delay (it is used for the text delay on the image)
Juliano Polito
You 'll see I've commented all the code, so you can understand better. On stage you will find the textfield, so you can change color and font (don't forget to embed the font). The images must be 200x200 pixels (OR YOU CAN CHANGE STAGE SIZE in document properties - images will be scaled to the stage size - it is commented in the code). The xml contains the image paths and texts, and the delay (it is used for the text delay on the image)
Juliano Polito
ASKER
Hi Juliano,
Thanks for all your help. The one issue is I don't see a link to the zip? :0)
Thanks,
Michael
Thanks for all your help. The one issue is I don't see a link to the zip? :0)
Thanks,
Michael
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Got it! :0) Another question. I noticed the swf blacks out when it tries to fade the picture out. IS that by design or is just because there is no background? I will look at the code tonight.
Thanks again Juliano!
Michael
Thanks again Juliano!
Michael
ASKER
ALso confused about the fla now that I look at it. I only see the loader and an "A" on a black background. Where is all the code contained?
Thanks!
Thanks!
the code is in the class .as. If you click the stage, take a look at the properties of the document. There is a field called Document Class, there i put the name of my class tha controls everything, the code is inside the as. The A in the stage is nothing, just need the textfield there so you can format as you want. After image fades out, it goes to black because there is no background.
ASKER
Much appreciated! I wish I could give you a million points! :0)
ASKER
Most impressive help I've ever gotten!
Take care!
Michael
Take care!
Michael
if you want just open another 100 posts saying thank you, and accept my welcome solution! LoL ... you are welcome, don't need million points for that. hope that helps, and anytime need help, just tell me. you can reach me sending a post to this question letting me know about your other posts
ASKER
Thanks again. I'm sure I'll be posting more questions soon!
take care!
take care!
ASKER
Sorry still confused. I clicked on the stage and the properties shows:
Document class: SlideShowText
But how do I see the code of the as file? If I click on the little pencil icon next to the textbox that says SlideShowText I get a dialog pop-up box that says "A definition for the document class could not be found in the classpath, so one will be automatically generated in the SWF file upon export". I also just upgraded from 8 to CS3 so this is the first time I've even used it.
I'll post another question with points for you.
Thanks,
Michael
Document class: SlideShowText
But how do I see the code of the as file? If I click on the little pencil icon next to the textbox that says SlideShowText I get a dialog pop-up box that says "A definition for the document class could not be found in the classpath, so one will be automatically generated in the SWF file upon export". I also just upgraded from 8 to CS3 so this is the first time I've even used it.
I'll post another question with points for you.
Thanks,
Michael
ASKER
NEw question here!
https://www.experts-exchange.com/questions/23131476/HOw-do-I-get-to-the-as-code-in-this-file.html
Thanks!
https://www.experts-exchange.com/questions/23131476/HOw-do-I-get-to-the-as-code-in-this-file.html
Thanks!
ASKER
Hi,
I'll post this question for you but is there a way to put a stroke (outline around the text? ?
Thanks!
I'll post this question for you but is there a way to put a stroke (outline around the text? ?
Thanks!
no man. the only way is to use an outlined font family like "HelveticaNeueLT Std Bold Outln" .
ASKER
Hi,
I put another question up concerning your code.
https://www.experts-exchange.com/questions/23167819/Transitioning-quicker-between-image-fadeout-and-next-image-fade-in.html
Thanks,
Michael
I put another question up concerning your code.
https://www.experts-exchange.com/questions/23167819/Transitioning-quicker-between-image-fadeout-and-next-image-fade-in.html
Thanks,
Michael
var textEntries:Array = new Array( new Array( value, timing ), .....);
Then I would use the setTimeout function within the startSlideshow function of your FLA to start the fade in of the text. Flash has built in a really cool class which will let you program a Tween, and you can find that here: http://www.kirupa.com/developer/actionscript/tween.htm.
Open in new window