Discuss Anything: Scrolling Html Formatted Text In Flash - Discuss Anything

Jump to content


Welcome to KnowledgeSutra - Dear Guest , Please Register here to get Your own website. - Ask a Question / Express Opinion / Reply w/o Sign-Up!
Page 1 of 1

Scrolling Html Formatted Text In Flash Concerning ActionScript 3 in Flash CS 3 Rate Topic: -----

#1 User is offline   BlueInkAlchemist 

  • Member [Level 1]
  • PipPipPipPip
  • Group: Kontributors
  • Posts: 56
  • Joined: 08-May 08
  • Gender:Male
  • Location:Pennsylvania
  • myCENT:91.95
  • Current Mood: Current Mood: None Chosen

Posted 15 December 2008 - 03:36 PM

Greetings, all!

I'm using the techniques discussed in this thread on ActionScript.org to load formatted HTML text into flash. I also want to scroll said text, and for that purpose I'd like to use Flashscaper's scrollbar. I've run into a bit of a snag, however.

The text displays fine. However, the scrollbar does not appear when initiated and the mask (a red rectangle) can be seen on the right side of the content area; not the entire thing, just a red area about 5-10 pixels wide. The text can be scrolled using the mouse wheel, so the scrollbar functionality is intact. I think this has something to do with the transition within the ContentText function, but when I comment that out, the text doesn't display at all, nor does the scrollbar. Listed below are the three components to this project.

ContentText.as:
package
{
	import flash.display.MovieClip;
	import flash.text.*;
	import fl.transitions.*;
	import fl.transitions.easing.*;
	import flash.text.StyleSheet;
	import flash.net.URLLoader;
	import flash.net.URLRequest;
	import flash.events.*;
	
	
	public class ContentText extends MovieClip
	{
		private var myURLLoader:URLLoader;
		private var myURLRequest:URLRequest;
		private var bodyTextField:TextField;
		public var contentPage:String;
		public var myTransitionManager:TransitionManager;
		
		public function ContentText(paraString:String)
		{
			contentPage = paraString;
			myURLLoader = new URLLoader();
			myURLRequest = new URLRequest("data/styles.css");
			myURLLoader.addEventListener(Event.COMPLETE, onLoadCSS);
			myURLLoader.addEventListener(IOErrorEvent.IO_ERROR, ioErrorHandler);
			myURLLoader.load(myURLRequest);
		}
		private function ioErrorHandler(evt:IOErrorEvent):void
		{
			trace('download failed');
		}
		private function onLoadCSS(event:Event):void
		{
			bodyTextField = new TextField();
			var css:StyleSheet = new StyleSheet();
			css.parseCSS(event.target.data);
			
			myURLRequest = new URLRequest(contentPage);
			
			bodyTextField.x = 50;
			bodyTextField.y = 50;
			bodyTextField.width = 200;
			bodyTextField.height = 200;
			bodyTextField.multiline = true;
			bodyTextField.wordWrap = true;
			bodyTextField.autoSize = TextFieldAutoSize.LEFT;
			bodyTextField.selectable = false;
			bodyTextField.styleSheet = css;
			bodyTextField.condenseWhite = true;
			addChild(bodyTextField);
			myURLLoader.removeEventListener(Event.COMPLETE, onLoadCSS);
			myURLLoader.addEventListener(Event.COMPLETE, onHTMLLoaded);
			myURLLoader.load(myURLRequest);
		}
		private function onHTMLLoaded(evt:Event):void
		{
//		  trace(evt.target.data);
			bodyTextField.htmlText = evt.target.data;
			myTransitionManager = new TransitionManager(this);
			myTransitionManager.startTransition({type:Wipe, direction:Transition.IN, duration:5.5, easing:None.easeOut});
		}
	}
}


Scrollbar.as:
/**
	 * Flashscaper Scrollbar Component
	 * Customizable Scrollbar
	 *
	 * @author		Li Jiansheng
	 * @version		1.0.0
	 * @private
	 * @website	 [url="http://www.flashscaper"]http://www.flashscaper[/url]
	 */

package {
		
	import caurina.transitions.*;
	import flash.display.*;
	import flash.events.*;
	import flash.geom.*;

	public class Scrollbar extends MovieClip {

		private var target:MovieClip;
		private var top:Number;
		private var bottom:Number;
		private var dragBot:Number;
		private var range:Number;
		private var ratio:Number;
		private var sPos:Number;
		private var sRect:Rectangle;
		private var ctrl:Number;//This is to adapt to the target's position
		private var trans:String;
		private var timing:Number;
		private var isUp:Boolean;
		private var isDown:Boolean;
		private var isArrow:Boolean;
		private var arrowMove:Number;
		private var upArrowHt:Number;
		private var downArrowHt:Number;
		private var sBuffer:Number;
		
		public var scroller:MovieClip;
		public var track:MovieClip;
		public var downArrow:MovieClip;
		public var upArrow:MovieClip;

		public function Scrollbar():void {
			scroller.addEventListener(MouseEvent.MOUSE_DOWN, dragScroll);
		}
		//
		public function init(t:MovieClip, tr:String,tt:Number,sa:Boolean,b:Number):void {
			target = t;
			trans = tr;
			timing = tt;
			isArrow = sa;
			sBuffer = b;
			if (target.height <= track.height) {
				this.visible = false;
			}
			scroller.addEventListener(MouseEvent.MOUSE_OUT, stopScroll);
			scroller.addEventListener(MouseEvent.MOUSE_UP, stopScroll);			
			stage.addEventListener(MouseEvent.MOUSE_WHEEL,mouseWheelHandler);

			//
			upArrowHt = upArrow.height;
			downArrowHt = downArrow.height;
			if (isArrow) {
				top = scroller.y;
				dragBot = (scroller.y + track.height) - scroller.height;
				bottom = track.height - (scroller.height/sBuffer);

			} else {
				top = scroller.y;
				dragBot = (scroller.y + track.height) - scroller.height;
				bottom = track.height - (scroller.height/sBuffer);

				upArrowHt = 0;
				downArrowHt = 0;
				removeChild(upArrow);
				removeChild(downArrow);
			}
			range = bottom - top;
			sRect = new Rectangle(0,top,0,dragBot);
			ctrl = target.y;
			//set Mask
			isUp = false;
			isDown = false;
			arrowMove = 10;
			
			if (isArrow) {
				upArrow.addEventListener(Event.ENTER_FRAME, upArrowHandler);
				upArrow.addEventListener(MouseEvent.MOUSE_DOWN, upScroll);
				upArrow.addEventListener(MouseEvent.MOUSE_UP, stopScroll);
				//
				downArrow.addEventListener(Event.ENTER_FRAME, downArrowHandler);
				downArrow.addEventListener(MouseEvent.MOUSE_DOWN, downScroll);
				downArrow.addEventListener(MouseEvent.MOUSE_UP, stopScroll);
			}
			var square:Sprite = new Sprite();
			square.graphics.beginFill(0xFF0000);
			square.graphics.drawRect(target.x, target.y, target.width+5, (track.height+upArrowHt+downArrowHt));
			parent.addChild(square);			
			target.mask = square;
			
		}
		public function upScroll(event:MouseEvent):void {
			isUp = true;
		}
		public function downScroll(event:MouseEvent):void {
			isDown = true;
		}
		public function upArrowHandler(event:Event):void {
			if (isUp) {
				if (scroller.y > top) {
					scroller.y-=arrowMove;
					if (scroller.y < top) {
						scroller.y = top;
					}
					startScroll();
				}
			}
		}
		//
		public function downArrowHandler(event:Event):void {
			if (isDown) {
				if (scroller.y < dragBot) {
					scroller.y+=arrowMove;
					if (scroller.y > dragBot) {
						scroller.y = dragBot;
					}
					startScroll();
				}
			}
		}
		//
		public function dragScroll(event:MouseEvent):void {			
			scroller.startDrag(false, sRect);
			stage.addEventListener(MouseEvent.MOUSE_MOVE, moveScroll);
		}
		//
		public function mouseWheelHandler(event:MouseEvent):void {
			if (event.delta < 0) {
				if (scroller.y < dragBot) {
					scroller.y-=(event.delta*2);
					if (scroller.y > dragBot) {
						scroller.y = dragBot;
					}
					startScroll();
				}
			} else {
				if (scroller.y > top) {
					scroller.y-=(event.delta*2);
					if (scroller.y < top) {
						scroller.y = top;
					}
					startScroll();
				}
			}
		}
		//
		public function stopScroll(event:MouseEvent):void {
			isUp = false;
			isDown = false;
			scroller.stopDrag();

			stage.removeEventListener(MouseEvent.MOUSE_MOVE, moveScroll);
		}
		//
		public function moveScroll(event:MouseEvent):void {
			startScroll();

		}
		public function startScroll():void {
			ratio = (target.height - range)/range;
			sPos = (scroller.y * ratio)-ctrl;
			
			Tweener.addTween(target, {y:-sPos, time:timing, transition:trans});
		}
	}
}


texttext.fla:
import ContentText; 
var ct:ContentText; 
var sb:MovieClip;
ct = new ContentText("data/loremipsum.htm");
ct.x = 100.0;
ct.y = 50.0;
addChild(ct);
sb = new Scrollbar;
sb.x = 500.0;
sb.y = 50.0;
addChild(sb);
sb.init(ct,"easeOutSine",2,true,2);


I know it's a lot of code, but any help that you can provide would be greatly appreciated! :cool:
0


Page 1 of 1

Other Replies To This Topic

#2 User is offline   BlueInkAlchemist 

  • Member [Level 1]
  • PipPipPipPip
  • Group: Kontributors
  • Posts: 56
  • Joined: 08-May 08
  • Gender:Male
  • Location:Pennsylvania
  • myCENT:91.95
  • Current Mood: Current Mood: None Chosen

Posted 13 January 2009 - 03:27 PM

As an update, I did get this sort of working by adding a button that brings in the scrollbar as a separate function. This works after the text's transition has completed. Perhaps I can simply tie the scrollbar function to a timer that fires when the text begins to load?
0

#3 User is offline   iGuest 

  • Hail Caesar!
  • PipPipPipPipPipPipPipPipPipPipPipPipPipPipPipPipPipPipPipPipPip
  • Group: Kontributors
  • Posts: 5,876
  • Joined: 21-September 07
  • Interests:Trap17 Free Web Hosting, No Ads
  • Current Mood: Current Mood: None Chosen

Posted 09 March 2009 - 06:36 PM

Hi everyone!I am facing a terrible problem with the UIScrollBar component.The script is pretty simple. It works fine at local. When I publish it on line doesn´t work fine. The ScrollBar is invisible (it seems disable). I would really appreciate if someone could give some tip why it happens.I would really appreciate if someone help me.Thanks in advance

Attach Code

The as3 script is:Import flash.Net.URLLoader;Import flash.Display.Sprite;Import fl.Controls.UIScrollBar;Import flash.Events.Event;Var myTxt:TextField = new TextField();MyTxt.Border = true;MyTxt.Width = 713;MyTxt.Height = 425;MyTxt.Border = falseMyTxt.X = 3;MyTxt.Y = 55;AddChild(myTxt);//Scroll controllerVar mySb:UIScrollBar = new UIScrollBar();MySb.ScrollTarget = myTxt;MySb.Direction = "vertical";MySb.X = 730;MySb.Y = 60;MySb.Height = 410;AddChild(mySb);Var info:URLLoader = new URLLoader(); Var url:URLRequest = new URLRequest("disserta.Html");Info.DataFormat = URLLoaderDataFormat.TEXT;Info.Load(url);Info.AddEventListener(Event.COMPLETE, leiaHTML); Function leiaHTML(evento:Event):void{Var info:URLLoader = URLLoader(evento.Target);	myTxt.HtmlText = info.Data;	myTxt.Multiline = true;	myTxt.WordWrap= true;	myTxt.Background = true;	myTxt.BackgroundColor = 0xffffff;	myTxt.X = 3;	myTxt.Y = 55;	myTxt.Width = 730;	myTxt.Height = 425;}
Thanks

 


0

#4 User is offline   whiteee 

  • Newbie
  • Pip
  • Group: Kontributors
  • Posts: 1
  • Joined: 13-December 09
  • Current Mood: Current Mood:

Posted 13 December 2009 - 11:54 AM

View Post(G)Author Name - e.g. John, Mike, on Mar 9 2009, 10:36 PM, said:

Hi everyone!
I am facing a terrible problem with the UIScrollBar component.
The script is pretty simple. It works fine at local. When I publish it on line doesn´t work fine. The ScrollBar is invisible (it seems disable). I would really appreciate if someone could give some tip why it happens.
I would really appreciate if someone help me.

Thanks in advance

Attach Code

The as3 script is:

Import flash.Net.URLLoader;
Import flash.Display.Sprite;
Import fl.Controls.UIScrollBar;
Import flash.Events.Event;

Var myTxt:TextField = new TextField();
MyTxt.Border = true;
MyTxt.Width = 713;
MyTxt.Height = 425;
MyTxt.Border = false
MyTxt.X = 3;
MyTxt.Y = 55;
AddChild(myTxt);

//Scroll controller
Var mySb:UIScrollBar = new UIScrollBar();
MySb.ScrollTarget = myTxt;
MySb.Direction = "vertical";
MySb.X = 730;
MySb.Y = 60;
MySb.Height = 410;
AddChild(mySb);

Var info:URLLoader = new URLLoader();
Var url:URLRequest = new URLRequest("disserta.Html");
Info.DataFormat = URLLoaderDataFormat.TEXT;
Info.Load(url);
Info.AddEventListener(Event.COMPLETE, leiaHTML);

Function leiaHTML(evento:Event):void{
Var info:URLLoader = URLLoader(evento.Target);
myTxt.HtmlText = info.Data;
myTxt.Multiline = true;
myTxt.WordWrap= true;
myTxt.Background = true;
myTxt.BackgroundColor = 0xffffff;
myTxt.X = 3;
myTxt.Y = 55;
myTxt.Width = 730;
myTxt.Height = 425;
}
Thanks


did u figure it out?
0

Share this topic:


Page 1 of 1


Similar Topics Collapse

  Topic Forum Started By Stats Last Post Info
New Replies Icon Move The Movie Clip In Flash
Use the arrow key to move the Movie Clip.
Others flash4satheesh 
  • 2 Replies
  • 973 Views
New Replies Icon Burning Laser Flashlight Hack! Tutorials AshTheGamer 
  • 0 Replies
  • 784 Views
New Replies Icon [photoshop] Reflected Text Tutorial Tutorials Saint_Michael 
  • 11 Replies
  • 3,387 Views
*New Replies Icon my flash site doesn't work General Talk Guest_capitanroca_* 
  • 0 Replies
  • 686 Views
New Replies Icon Psp Flash Site Website Reviews Raptrex 
  • 7 Replies
  • 1,052 Views
New Replies Icon [question] How Can I Change The Appearence Of Text Link Qupis Free Hosting Forum Codemaster Snake 
  • 4 Replies
  • 975 Views
Locked Topic Icon Aol Im System Tray Icon Flashing
never noticed that before
Software BuffaloHelp 
  • 2 Replies
  • 1,208 Views
New Replies Icon Is It Possible To Align Text To The Center And Justify It?
Example inside!
CSS (Cascading Style Sheets) Dagoth Nereviar 
  • 7 Replies
  • 5,523 Views
New Replies Icon Top Quality Flash Games For Free....
www.miniclip.com
Gamers Arena theem 
  • 0 Replies
  • 1,176 Views
Locked Topic Icon Trap17 Flash Banner
Simple T17 banner
468x60 Banners [XNZ]Infection 
  • 2 Replies
  • 2,053 Views
New Replies Icon Check Out My Animation
FLaKes's Flash animation
Animation/Flash FLaKes 
  • 13 Replies
  • 3,180 Views
New Replies Icon Request - Flash Mp3 Player
Got possible design already. I am also able to fiddle with the end thi
Questions/Requests Jimmy 
  • 4 Replies
  • 1,084 Views
New Replies Icon Javascript Effect For Text Ads In Your Website
box effect in java script
Java, Java Servlets, Java Script, & JSP web_designer 
  • 0 Replies
  • 246 Views
New Replies Icon Any Free Fonts For Flash 3D/Large Pieces gbjack 
  • 2 Replies
  • 3,089 Views
New Replies Icon Adobe Committs Flash To The Iphones Mobility, Mobile Phones FlameX 
  • 3 Replies
  • 599 Views
New Replies Icon Pentagon Ban's Flash Drives North America Saint_Michael 
  • 5 Replies
  • 595 Views
New Replies Icon Wix: Flash Website Editor
"create professional and beautiful websites for free"
Freebie Stuff Fractured.Logic 
  • 12 Replies
  • 8,285 Views
New Replies Icon Making Money From Games
NOTE: This is for Flash Developers Only
Make Money Online Raidation 
  • 9 Replies
  • 636 Views
New Replies Icon Protect Your Cursor! (flash Game)
do not get your mouse stolen
Flash Animations snlildude87 
  • 3 Replies
  • 3,845 Views
New Replies Icon Digital Time
Create a Digital Time in flash.
Tutorials flash4satheesh 
  • 2 Replies
  • 913 Views

1 User(s) are reading this topic
0 members, 1 guests, 0 anonymous users


Google Fan :-) We Recommend Firefox.     Customize / Settings Connect Us on facebook