Progress Bar Animation

I built a database reporting application in flex that's working fine. However, some of the datasets are large and the end user requested a progress bar for long loads.
No problem, right? I used <mx:ProgressBar> set the mode to manual, and as ActionScript processes the dataset, call showProgress() repeatedly.
Trouble is, the animation doesn't play. The Progress Bar just sits on the screen, empty, until the data is completely loaded, then jumps to 100% and disappears.
I tried switching the progress bar to "indeterminate" and something similar happens: The indeterminate bar appears, but the animation doesn't play until the data has populated the DataGrid, then the animation starts playing just before the bar disappears.
Can anyone help? A progress bar that doesn't sho progress is kinda worthless.
Thanks
-John

Hi,
Go through the example and comments, hope it might help.
I haven't worked with ProgressBar, thought might be useful.
http://blog.flexexamples.com/2008/02/16/setting-the-value-of-a-flex-progress-bar/#more-523

Similar Messages

Threaded Progress bar wont restart

I know that if i have a progress bar on a form and i wont it to increment on a button click, i must thread it so i did this
the Main class is "class Form" with variables
public static JProgressBar progress;
ThreadedProgress threadbar = new ThreadedProgress();
public void actionPerformed(ActionEvent e)
if (e.getActionCommand() == "Submit")
threadbar.start();
in the same file i made the a theard to increment the progress bar
class ThreadedProgress extends Thread
     int num = 0;
     ThreadedProgress()
          //setDaemon(true);
public void run ()
num = 0;
Form.progress.setValue(0); // progress bar in "class Form"
while (num <1001)
Form.progress.setValue(num);
try
Thread.sleep(10);
catch (InterruptedException e)
     JOptionPane.showMessageDialog(null,e);
num += 10;
if(num > 1001)
JOptionPane.showMessageDialog(null,"MessageSent");
When i click the "Submit" button once to increment the progress bar with the thread it works fine but when i click it a 2nd time, nothing happens...

Probably the easiest thing to do is to make an anonymous inner Thread class that is within your actionPerformed(ActionEvent e) method. This was a new Thread class could be made each time the button is clicked.
I gather that from your code, after a message has been sent, you want to show progress for a second. With Java 1.4 - it is possible to put the progress bar in indeterminate mode:
progressBar.setIndeterminate(true); // starts progress bar animation
progressBar.setIndeterminate(false); // stops progress bar animationhttp://java.sun.com/docs/books/tutorial/uiswing/components/progress.html
When you start sending your message, you could start the animation, and stop animation when the message is sent. You can reuse this method numerous time, as Java makes the required threads, etc. internally.
Good Luck!

Animated Progress Bar issues

I am working with the animated progress bar from the late Carl Backstrom's demo applicaiton but to my amazement, the bar refuses to animate unless the javascript is triggered from a button press. This is not really acceptable for my purposes as I need to have it fire and work though an onLoad on the body attributes. Any Sugestions? I know some people are going to probably say ExtJS and JQuery but our development rules here will not allow us include either of these libraries at this time.

It is actually an intermediate page with a PL/SQL process that runs on submit to cache database information from a remote db. I actually have a button on another page that routes into the page in question so that I can clear everything in the background to prevent people from being able to go to another page while loading process is under way. The way I have it setup now is you click a button to start a multistage process and you are taken to a loading page which basically takes away other links on the page and gives you a blank page with the progress bar. Once loading is finished, it branches the person to the next step.

Progress bar is animated in one direction in Indeterminate mode

Hello All:
How to make Progress bar being animated in one direction in Indeterminate mode, like what determinate mode does? For example, a horizontal progress bar is always animated from left to right.
And how to control animation speed in this mode?
Thank you very much.
Johnson

How to make Progress bar being animated in one direction in
Indeterminate mode, like what determinate mode does?Well the point of using indeterminate mode is that you don't know how long it will take. So what happens if the task takes longer than you think and the bar reaches the end? The user will think its frozen.
And how to control animation speed in this mode?
UIManager.put("ProgressBar.cycleTime", new Integer(3000)); // 3000 is the default

Progress bar for movieclip animations

Hello,
I have to create a presentation with audio and animation synced - it's about 5 minutes. It has 5 buttons at the bottom that the user can use to navigate to a particular subject of the presentation. But I was asked if there could be a progress bar for each subject so that the user could see how far they've gone. I'm thinking I could have something check to see how far along the audio is and have a bar move along as the audio moves along.
This seems like a project that's probably been done, if anyone could help that'd be great, thanks!

I don't deal with sound much, but you should be able to monitor the position property against the duration property much like CL mentioned using the frames. You would use the ratio of position/duration to determine how far along the playtime is (percent complete), and you can use that value to control the width of a progress bar.
A progress bar can be as simple as a rectangular strip whose normal width would be the 100% complete size. You control the width by using the percentage complete times that full width value. To make it more visually representative of when the end is coming, when you draw that rectangle, include a line border. But isolate the fill as as the progress bar movieclip. That way, the border lets you know what the full size is while the fill as a movieclip changes to fill up the outline. You can also include a textfield if you like to display the percent completion.

Progress bar for animation

I am trying to make a progress bar for my animation, similar
to the stock flv players that came with CS3.
I am controlling a swf file loaded into the 'container'
movieclip, and I can get the scroll bar to control the movieclip.
In other words, the animation will jump to the right frames when I
drag the bar. However, when I put in code to make the progress bar
follow the action (using a onEnterFrame event handler) It follows
the animation, but now I can't scroll.
Question: How do I make my scroll bar stop following the
action when you click on it to scroll somewhere else???
Thanks in advance for your help!

Ok, so i took another crack at it and fixed the action script issues which for some reason half disappeared when i loaded it back up ( Maybe it didn't properly register the change back to AS 3? I resolved the other ones that popped up in it's stead after staring at the code for a bit ). Next a related issue so i'm gonna post it here, but does anyone know how to get the image rotation loop to play while it loads?

Director 12 - progress bar

I need to add a progress bar to the splash screen of a Director 12 .dcr which is hosted on a website.
The progress bar doesn't have to show the exact time remaining before the main.dcr starts, it just gives the user a rough indication that "loading" is happening.
I was thinking of using an animated .gif for this, making the .gif visible when the user clicks the Start button, but I don't knon how to do this in Director.
Is there a standard way to make a loading-in-progress indicator in Director, for a web hosted .dcr?
Thank you.

Is this the kind of thing you are looking for?
-- **Drop this Behavior on your progress bar**
global gNetmovieID1
global gCurrentSprite
global gBarWidth
global gBarConverter
global gPercentText -- starts at 0% and ends at 100%
global gStatList
global gPercentDone
on beginSprite me
tellStreamStatus(TRUE) -- Turns on the stream status!!!
floatPrecision = 2
gCurrentSprite = me.spriteNum -- the current sprite "progress bar"
gBarWidth = (sprite gCurrentSprite).width
gBarConverter = (float(gBarWidth)) / 100
gNetmovieID1 = preLoadNetThing("http://www.website.com/filename.dcr?p=" & string(random(1000) ) ) -- preLoads your hosted .dcr file!!!
end
on exitFrame me
if Netdone(gNetmovieID1) = TRUE then
    gPercentText = "100%"
    PLAY MOVIE ( "http://www.website.com/filename.dcr" ) -- plays your hosted .dcr file!!!
    abort
else
    -- This checks the download status and updates the "progress bar" and the gPercentText
    gStatList = getStreamStatus(gNetmovieID1)
    if (gStatList.bytesSoFar > 0) then
      gPercentDone = (gStatList.bytesSoFar * 100.0001) / gStatList.bytesTotal
      (sprite gCurrentSprite).width = integer (gPercentDone * gBarConverter)
      gPercentText = string(integer(gPercentDone) & "%")
    else
      (sprite gCurrentSprite).width = 1
      gPercentText = "0%"
    end if
end if
end if

JavaFX progress bar with glow effect.

I am hoping someone can help me with this issue. I recently followed James Clarke example of a progress bar with glow effect and it helped with developing a progress bar for an application I was working on. But now, with the JavaFX sdk 1.2 update, the application does not fully work anymore. The progressbar.fx code is posted below:
ProgressBar.fx code:
import java.lang.Math;
import java.lang.Object;
import javafx.animation.Interpolator;
import javafx.animation.Timeline;
import javafx.scene.CustomNode;
import javafx.scene.effect.GaussianBlur;
import javafx.scene.Group;
import javafx.scene.Node;
import javafx.scene.paint.Color;
import javafx.scene.paint.Paint;
import javafx.scene.Scene;
import javafx.scene.shape.Ellipse;
import javafx.scene.shape.Rectangle;
import javafx.scene.text.Font;
import javafx.scene.text.Text;
import javafx.scene.text.TextOrigin;
import javafx.stage.Stage;
import javafx.scene.layout.Resizable;
public class ProgressBar extends CustomNode, Resizable{
public var min: Number;
public var max: Number = 100.0;
public var value: Number;
public var background: Paint = Color.rgb(118,149,178);
public var foreground: Paint = Color.rgb(216,219,225);
public var font = bind Font{name: "Courier Bold Italic" size: height - borderWidth * 8};
public var arcWidth: Number = 20;
public var arcHeight: Number = 50;
public var borderStroke: Color = Color.BLACK;
public var borderWidth: Number = 1;
public var fontPaint: Paint = Color.LIGHTGRAY;
public var showPercentage = true;
var progressText: Text;
var backgroundText: Text;
var progessBar: Rectangle;
var range = bind Math.abs(max - min);
var percentComplete: Number = bind if(max != 0) { (
value - min) / max
} // if
else {0.0;} // else;
var currentX = bind percentComplete * width;
var blurX: Number = 30;
var progressString: String = bind "%%{%.0f (percentComplete*100)}";
var progressValue = bind "{%.2f value}";
var progressHeight = bind height - borderWidth * 4;
var blurAnim = Timeline {
repeatCount: Timeline.INDEFINITE
autoReverse: true
keyFrames: [
at(0s) { blurX => 0.0 }
at(2s) { blurX =>
currentX - progressHeight / 2 tween Interpolator.EASEBOTH }
var playing = bind visible on replace{
if(playing) {
blurAnim.play();
}else {
blurAnim.stop();
public override function create(): Node {
return Group {
content: [
Rectangle { //background
width: bind width
height: bind height
fill: bind background
stroke: bind borderStroke
strokeWidth: bind borderWidth
arcWidth: bind arcWidth
arcHeight: bind arcHeight
cache: true
backgroundText = Text { // Text over Background
layoutX: bind (width - backgroundText.layoutBounds.width) / 2
layoutY: bind (height - backgroundText.layoutBounds.height) / 2
textOrigin: TextOrigin.TOP
font: bind font
fill: bind foreground
content: bind if(showPercentage) progressString else progressValue
cache: true
Group {
content: [
progessBar = Rectangle { // Progress
layoutX: bind borderWidth
layoutY: bind borderWidth * 2
width: bind currentX
height: bind progressHeight
fill: bind foreground
arcWidth: bind arcWidth
arcHeight: bind arcHeight
Ellipse {
centerX: bind blurX
centerY: bind height / 2
radiusX: bind progressHeight
radiusY: bind progressHeight / 2
fill: Color.rgb(255,255,255,.7)
effect: GaussianBlur{ radius: 30
Text { // Text Over Progress Bar, this has to be in progressBar coordinate space
x: bind (width - backgroundText.layoutBounds.width) / 2
y: bind (height - backgroundText.layoutBounds.height) / 2
textOrigin: TextOrigin.TOP
font: bind font
fill: bind background
content: bind if(showPercentage) progressString else progressValue
clip: bind progessBar
}, // Text
] // 2nd content
} // 2nd Group
] // 1st content
}; // 1st Group
} // public override function create(): Node
} // public abstract class ProgressBar extends CustomNode, Resizeable
function run(args:String[]):Void {
var stage: Stage = Stage {
title: "Progress Bar"
scene: Scene {
width: 925
height: 60
content: ProgressBar {
layoutX: 10
layoutY: 10
width: 890
height: 35
value: 80
} // content: ProgressBar
} // scene: Scene
} // var stage: Stage = Stage
} // function run(args:String[]):Void
I use RESTful ws to get the progress of the billing run, which is the loadProgressdata() method in the main.fx, and everything was working fine until we did the javafx sdk 1.2 update. With the update in place, I recompiled the project and found that "Resizable" in
the "public class ProgressBar extends CustomNode, Resizable" was throwing an error when the project was recompiled. I made some changes(mainly adding variables for height and width) but now when the program runs, the backing rectangle appears along with the
percentage of billing progress, but the progress part(2nd rectangle) does not appear with the glow effect. I have read about using "getPrefWidth()" and "getPrefHeight()" methods, but not really sure how I would use them. I can't make the public class ProgressBar extends CustomNode, Resizable abstract as I need to instantiate in the Main.fx.
Can anyone shed some light on what might need to be done to get this running correctly again. I don't need anyone the give me the exact code, but just to point me in the correct direction.

Can you post your code again between "{ code} ... {code }" tags ? Some symbols are missing if copy/pasted.
That said, your preferred width and height, simply return the width and height of your component. What I discovered recently is using LayoutInfo on controls to set the preferred width and height. These are the dimensions the surrounding container (VBox, HBox, Flow, ....) will use to arrange size and position of the enclosed components. So maybe you won't need Resizable any more. Simply fill in the layoutInfo property.
Edited by: Java.Artisan on Jun 26, 2009 11:25 AM
Edited by: Java.Artisan on Jun 26, 2009 11:26 AM

Progress bar to update as script runs

Hi, I'd like to have a progress bar being displayed as my script runs. I created a simple progress bar as follows:
var win = new Window("palette", "SnpCreateProgressBar", [150, 150, 600, 260]);
win.pnl = win.add("panel", [10, 10, 440, 100], "Script Progress");
win.pnl.progBar = win.pnl.add("progressbar", [20, 35, 410, 60], 0, 100);
win.pnl.progBarLabel = win.pnl.add("statictext", [20, 20, 320, 35], "0%");
win.show();
                    while(win.pnl.progBar.value < win.pnl.progBar.maxvalue)
                              // this is what causes the progress bar increase its progress
                              win.pnl.progBar.value++;
            win.pnl.progBarLabel.text = win.pnl.progBar.value+"%";
                              $.sleep(10);
    alert('Done!');
win.close();
Now, if I target the ExtendScript Toolkit, I can see the "animation" of the bar progressing. But If I target illustrator, I only see when it's at 0% and then it jump to 100%. Is there a way to update the information visually as the script progresses?
Thanks!
I'm running CS6 on mac.

Hi,
i was using the above code in my application but it is displaying the following message when i run it:
Can you please help me out.
Thanks
Harsh

Hanging overview progress bar?

Anyone encounter this?
Open an existing Logic session, several progress windows appear and disappear showing "creating overview for "xxxx.aif", but one window hangs and the progress bar stops animating.
Click on the arrange window and press spacebar to play. Sequence is audible but cursor does not scroll and performance is sluggish.
A temp fix is to delete the file that is named in the hanging progress window, then quit and reopen the session . This only works once - quitting and re-opening again results in a different file progress window hanging.
Closing the session does not remove the hanging progress window and opening a new session suffers the same malady. Only quitting Logic makes the window go away.
What I have tried:
Updating file information
initializing preferences
trashing preferences
Switching audio device between Built in and MBox2
Transfer entire session to another computer
None of these have worked.
Any ideas?

So, it's trying to create an overview to a file that is not in the bin?
Was the file successfully removed from the bin?
Try this: delete that file from the bin (if it's still there), from the file menu use "Save a Copy as", open the new copy. If it's still doing the same thing try cleaning everything from the bin (in the copy version), save and reopen.
This is also to try to isolate the problem.

The 'Publish' command's progress bar in FM11

Trying out Tech Communicator Suite 4, I just tried doing File > Publish on a FrameMaker book, and asking it to convert it into .CHM files.
It pops up a "Please wait..." dialog with a stripey animated progress bar that is a 100% right away. It's been sitting there like that for about 10 minutes now (whilst firing off Distiller in the background from time to time).
I appreciate that it may take a few mins to chomp through a big book and spit out the .chm,
but I was expecting a slightly better progress dialog than what I'm seeing!
Has anyone else on the forum used this workflow? Is this the way it always behaves? I was expecting the progress bar to at least, well, you know... show some progress

You'll need to create a project in RoboHelp first that has all your definitions set, then export your settings in a .isf file that FM uses to do the help generation. It's not a 1-stop process (at least initially). You also don't get the same degree of control over the output as you would in the normal FM to RH workflow.

Progress bar for query

Hi experts,
A customer has requested a onscreen progress bar to display when a query is being preformed. Any ideas on how to implement this?
Thanks!

See
Re: Long running process/query
That should get you started.
The "progress bar" will just be a animated gif like
<img src="http://www.devx.com/assets/articlefigs/9521.gif">
Hope this helps.

I don't know how to word this - "Progress bar" maybe???

Hi Everyone!
I've been a lurker here on occasion, but never posted. I'm sure this has been covered somewhere, but what I'm trying to do is place a "loading" page or progress bar that loads my pages before they're shown to the visitor...maybe an hourglass or a bar of some sort, y'know? I think it looks unprofessional to visit a site and watch each item as it loads. Know what I'm sayin'????

Hi -- Welcome to the discussions. They're called animated Flash "preloaders" which show a progress bar, e.g.
http://www.verticalmoon.com/products/swflockload/swflockload.htm
...but I'm not sure how practical it would be to use them for general web-page loading; perhaps another forum reader could chip in here.
If you decide to experiment, you could try integrating preloaders into your site via either of the following:
http://web.mac.com/cbrantly/iWeb/Software/iWeb%20Enhancer.html
or...
http://iweb.varkgirl.com
(Click on the first "tip" link in the list)

Want to download Defauld Progress Bar from Oralce Site

Hi,
I am trying to download Defauld Progress Bar From Oracle Site, but it is showing message
alt="Your browser understands the <APPLET> tag but isn't running the applet, for some reason." Your browser is completely ignoring the <APPLET> tag!
Please suggest and how can I use that progress bar on my existing 6i form .
thanks
mohan

then Applet will not work in any case....
For 6i there is online help available for Progress bar
To create a progress bar:
1     In the Layout Editor, click the Text Item tool. Drag to create a text item of the maximum size of the progress bar. For a raised style bar, set the Bevel property of the item to raised.
2     Click the Rectangle tool and create a rectangle slightly larger than the maximum size of the progress bar. For a flood style bar, set the Bevel property of the rectangle to Lowered.
3     Add trigger code to set the size of the progress bar as appropriate. Change the size by programmatically adjusting the Width property. Depending on your application you might do this within a PL/SQL loop, or in a WHEN-TIMER-EXPIRED trigger. For example, use the Set_Item_Property built-in:
     DECLARE
   x NUMBER := Set_Item_Property(‘PROGRESS.PLAIN’, WIDTH);
BEGIN
if x < 120 then
    Set_Item_Property(‘PROGRESS.PLAIN’, WIDTH, x+5);
else
    Delete_Timer(‘PROGRESS’);
end if;
END;
Tip: Form Builder does not normally update the display while a trigger is executing. To update the progress bar while a PL/SQL loop is executing, use the Synchronize built-in.
To create the spinning wheel animation:
1     Using a drawing tool such as Microsoft Paint, create an image file containing all of the different pictures, or frames, that you want to show for the animation. To create a smooth animation, use at least four and preferably six frames.
2     In the Layout Editor, display the content canvas where you want the animation to be displayed.
3     Click the Stacked Canvas tool in the tool palette. Click on the content canvas to create and position the stacked canvas.
4     In the Property Palette, under the Physical node, set the Width and Height of the stacked canvas to the size of the image or larger, and set the Viewport X Position on Canvas and Viewport Y Position on Canvas to show the initial frame. Under the Viewport node, set the Viewport Width and Viewport Height to the size of each frame.
5     In the Layout Editor, display the stacked canvas. Choose FileImport to import the image file. The image will appear in the upper left corner of the canvas.
     Tip: If you have boilerplate images that you use frequently, such as a company logo, add them to your object library by dragging the boilerplate image object from the Canvas node in the Object Navigator and dropping it on the appropriate page of the object library. To reuse a boilerplate image from an Object Library, simply drag it to the Object Navigator and drop it under the canvas where you want the image to appear. This is faster and simpler than importing a file. See the Gallery page in the DEMO20.OLB object library for an example.
6     Add trigger code to show each frame as appropriate. Depending on your application you might do this within a PL/SQL loop, or in a WHEN-TIMER-EXPIRED trigger. Change the frame by programmatically adjusting the Viewport X Position on Canvas and Viewport Y Position on Canvas properties to position the viewport visible on the content canvas over the desired frame.
if responses are helpful or correct please mark it
Baig,
http://baigsorcl.blogspot.com

Browser progress bar still in processing mode after loading the page

Hi all,
In my project ,I am facing one problem.
After completion of loading page the IE browser progress bar is still showing that loading is not yet done. That means progress bar is in still processing mode.
Can any one please tell me what is the reason behind it.
Sujan

Are you creating the pages dynamically with JavaScript? If you do a document.open() and then do document.write()s but forget to do a document.close(), the loading animation will continue to display.

Progress Bar Animation

Similar Messages

Maybe you are looking for