Resizing the stage

Hello all.
I animated this little talking head, but now come the end of
it, I'd prefer to have more background space behind him, ie; a
larger stage. But when I increase the stage size, it increases it
all in the bottom-right corner, making my talking head far from
center. I wouldn't mind this if I could center him, but since there
are tweens and lip-syncing and all sort of stuff, I can't move
everything in one foul swoop. I'll select all my layers and
whatnot, move them, but then as soon as I get to any new keyframe
in the timeline, any associated symbol will go back to their
original position. Needless to say, re-positioning every single
keyframe would be just as tedious as creating them in the first
place.
I doubt that's the only option, seeing as how Adobe MUST've
forseen this. So. Is there a way to really truly select everything
in timeline and move it all at once? Or is there a way to tell the
stage
where to increase its size, similar to adjusting the "canvas
size" in Photoshop?
Any help would be GREATLY appreciated.

there are two solutions to your problem here.
1) you can place all of the animation within a new MovieClip
symbol. select all layers and frames by right-click and 'select all
frames' - then right-click and 'copy frames'. now create a new
symbol and right-click the first frame and 'paste frames' - now
return to the main timeline and delete all the layers, create a new
layer and drag the new movieclip symbol from the Library - you will
now be able to position the MC wherever you would like.
2) you can use the 'edit multiple frames' function to move
everything at once. with the playhead in frame one, turn on onion
skinning (the button on the left on the bar just below the timeline
that looks like one 'full' box) with onion skinning turned on, drag
the 'viewing marker' on the right ('attached to' the playhead
marker) to the last frame of the timeline - then turn on the 'edit
multiple frames' button (the button on the right on the bar just
below the timeline that looks like two 'full' boxes) now click-drag
from the first layer-last frame - to the last layer-first frame to
select all of the timeline with the playhead ending up in the first
frame. now you will be able to position everything that is selected
all at once. however you will need to repeat this procedure for any
move and you will also 'see' everything at the same time, which can
make positioning difficult - but also handy.

Similar Messages

How to resize the stage from the top instead of the bottom?

Hi I am trying to resize the stage in Flash CS4 from the top instead of the bottom, as I left too much space at the top of the stage and don't need the stage to be so big. By default Flash resizes from the bottom.
So is there a way of resizing from the top?
Failing this, is there a way of moving all the symbols/objects in my project so that I don't create a motion tween but just move the objects for all of the frames in the project (i have quite a few tweens in the project)?
Thanks
Nick

the built in Stage class has two handy properties...
Stage.width and Stage.height

New tweens and resizing the stage: Help!

Hi all. I'm going nuts trying to figure this out.
I built an animation project at 630 pixels wide. Turns out the project needs to be 430 pixels wide. In CS3, using the classic tweens, I would simply resize the stage, Onion All, then resize everything on the stage at once. But with the new tween structure, it looks like I can't do a mass resize like that. Anything that's been tweened using the motion editor does not resize.
I know I can just create a new movie clip, paste all frames into it and then resize the MC, but I have some JPEGs of signatures that pixellate when they are resized that way.
So, can you onion skin the new tweens? Is there a workaround?
Thanks!

I'm afraid there isn't a good answer for this one - it's one of the present limitations that we're aware of. The problem is twofold: One instance per tween instead of two/more (Edit multiple frames is entirely based on multiple instances - a tween only has one), and auto-keyframing (usually making things easier, but for this, complicating things - if you change the scale at a location it automatically tweens the change, which you don't want in this use case).
For any motion paths, you need to select each and then scale them (you can use the Transform panel to enter a percentage. Mutliple selected motion paths will scale the instances instead (unfortunately for this case). You can try selecting multiple and using the Transform panel, but this doesn't work well yet.
If you haven't tweened the scale of your instances and they start at the same position, you're in a bit more luck. Put the playhead at the first frame of the span(s) and then scale the instances. If you have tweened the scale, then you'd need to move the scale tween up/down in the motion editor (press the Alt key while dragging the path in the graph).
In the even less likely chance the instances share the same tween, I'd do this for one instance, save it as a preset and then apply it to the rest.
I know this is a pain - I'm sorry it's not better for changing the size of the Stage. We didn't get the time to make Edit Mutliple Frames better for new motion in this release.

Resizing the stage around its center

I have done some animation work on a stage 320px X 320px. I
find that I must present the same work on a stage 240px X 320 px.
If I use the Property Inspector window, I can enter the new stage
size. Unfortunately, the window is resized with the left hand side
of the screen as its reference point, effectively cutting off a
large part of the right side of my work. I would expect to loose a
piece of my animation at the right and the left evenly. How can I
resize the stage around its center?
Thanks

well, I'm afraid that just the thing, you really can't.
However, you can reposition everything on the Stage at the same
time. First, with all layers unlocked, right click the timeline
(anywhere but the first frame) and use 'select all frames', then
use the 'edit multiple frames' button which the little 'box' like
symbol next to the fps indicator on the bar just below the
timeline, select 'onion all', now you can drag or nudge the entire
animation at one time.

How to resize the stage of .fla project

I would like to make a .fla project in high resolution (to
meet hires demand) but would also re-size the stage to lower
resolution to be able to publish at lower file size. Is there a way
to do it?
Changing the dimensions only changes the stage size but it
does not resize it.
Any help?

the built in Stage class has two handy properties...
Stage.width and Stage.height

The problem about the Stage's minWidth or minHeight property.

From the JavaFX 2.2 api, I see the minWidth or minHeight property, and then I attempt to use them to limit the contraction of stage when dragging. But it takes no effect. Are there some implications for using these properties?
I have finally to write some codes in the dragging listener of the stage to set manually width or height of the stage to achieve the minWidth or minHeight effect.

Hi, here is the test case: when we resize the stage UNDECORATED by dragging, we can minimize the stage size to zero even I set the minWidth and minHeight properties at first.
import javafx.animation.KeyFrame;
import javafx.animation.KeyValue;
import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.beans.binding.DoubleBinding;
import javafx.beans.property.ObjectProperty;
import javafx.beans.property.SimpleDoubleProperty;
import javafx.beans.property.SimpleObjectProperty;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.geometry.Bounds;
import javafx.geometry.Point2D;
import javafx.scene.Cursor;
import javafx.scene.Node;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.ScrollPane;
import javafx.scene.effect.DropShadow;
import javafx.scene.effect.Reflection;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.FlowPane;
import javafx.scene.layout.Pane;
import javafx.scene.paint.Color;
import javafx.stage.Stage;
import javafx.stage.StageStyle;
import javafx.stage.Window;
import javafx.util.Duration;
public class TestMinSizeStage extends Application {
private ScrollPane scrollPane;
private ObjectProperty<Point2D> anchor = new SimpleObjectProperty<Point2D>(null);
private SimpleDoubleProperty widthStage = new SimpleDoubleProperty();
private SimpleDoubleProperty heightStage = new SimpleDoubleProperty();
public static void main(String[] args) {
launch(args);
@Override
public void start(final Stage primaryStage) {
Pane mainContainer = initstage(primaryStage);
mainContainer.getChildren().addAll(
createButton());
primaryStage.show();// Show the primaryStage
private Pane initstage(Stage primaryStage) {
primaryStage.setTitle("Hello Java");
primaryStage.initStyle(StageStyle.TRANSPARENT);
/* The minWidth or minHeight is for the stage "DECORATED", it has on effect to the stage non "DECORATED". */
primaryStage.setMinWidth(600);
primaryStage.setMinHeight(400);
final FlowPane mainContainer = new FlowPane();
mainContainer.setStyle(
"-fx-background-color: white; " +
"-fx-background-radius: 10px; " +
"-fx-padding: 10px;" +
"-fx-hgap: 30px; " +
"-fx-vgap: 50px;");
scrollPane = new ScrollPane();
scrollPane.setStyle("-fx-background-radius: 10px;");
scrollPane.setContent(mainContainer);
scrollPane.setPannable(true);
mainContainer.prefWidthProperty().bind(new DoubleBinding() {
super.bind(scrollPane.viewportBoundsProperty());
@Override
protected double computeValue() {
Bounds bounds = scrollPane.getViewportBounds();
if (bounds == null) {
return 0;
} else {
return bounds.getWidth();
AnchorPane root = new AnchorPane();
root.setStyle(
"-fx-border-color: black; " +
"-fx-border-width: 1px; " +
"-fx-border-radius: 10px; " +
"-fx-background-color: rgba(0, 0, 0, 0); " +
"-fx-background-radius: 10px;");
DropShadow dropShadow = new DropShadow();
dropShadow.setRadius(20.0);
// dropShadow.setSpread(0.2);
root.setEffect(dropShadow);
enableDragging(root);
root.getChildren().add(scrollPane);
AnchorPane.setTopAnchor(scrollPane, 0.0);
AnchorPane.setRightAnchor(scrollPane, 10.0);
AnchorPane.setBottomAnchor(scrollPane, 10.0);
AnchorPane.setLeftAnchor(scrollPane, 10.0);
AnchorPane superRoot = new AnchorPane();
superRoot.getChildren().add(root);
AnchorPane.setTopAnchor(root, 10.0);
AnchorPane.setRightAnchor(root, 10.0);
AnchorPane.setBottomAnchor(root, 10.0);
AnchorPane.setLeftAnchor(root, 10.0);
Scene scene = new Scene(superRoot, 950, 650, Color.TRANSPARENT);
scene.getStylesheets().add(getClass().getResource("controls.css").toExternalForm());
primaryStage.setScene(scene);
return mainContainer;
* Enable the root node to be dragged. Realize some drag functions.
* @param root - the root node
private void enableDragging(final AnchorPane root) {
/* This mouse event is for resizing window. Define some specific cursor patterns. */
root.setOnMouseMoved(new EventHandler<MouseEvent>() {
public void handle(MouseEvent me) {
if ((me.getX() > root.getWidth() - 10 && me.getX() < root.getWidth() + 10)
&& (me.getY() > root.getHeight() - 10 && me.getY() < root.getHeight() + 10)) {
root.setCursor(Cursor.SE_RESIZE);
} else if (me.getX() > root.getWidth() - 5 && me.getX() < root.getWidth() + 5) {
root.setCursor(Cursor.H_RESIZE);
} else if (me.getY() > root.getHeight() - 5 && me.getY() < root.getHeight() + 5) {
root.setCursor(Cursor.V_RESIZE);
} else {
root.setCursor(Cursor.DEFAULT);
/* when mouse button is pressed, save the initial position of screen. */
root.setOnMousePressed(new EventHandler<MouseEvent>() {
public void handle(MouseEvent me) {
Window primaryStage = root.getScene().getWindow();
anchor.set(new Point2D(me.getScreenX() - primaryStage.getX(), me.getScreenY() - primaryStage.getY()));
widthStage.set(primaryStage.getWidth());
heightStage.set(primaryStage.getHeight());
/* when mouse button is released, clear the initial position of screen. */
root.setOnMouseReleased(new EventHandler<MouseEvent>() {
public void handle(MouseEvent me) {
anchor.set(null);
/* when screen is dragged, translate it accordingly. */
root.setOnMouseDragged(new EventHandler<MouseEvent>() {
public void handle(MouseEvent me) {
if (anchor.get() != null) {// The drag event on the root really takes place.
Window primaryStage = root.getScene().getWindow();
if (root.getCursor() == Cursor.H_RESIZE) {
primaryStage.setWidth(widthStage.get() + (me.getScreenX() - (anchor.get().getX() + primaryStage.getX())));
} else if (root.getCursor() == Cursor.V_RESIZE) {
primaryStage.setHeight(heightStage.get() + (me.getScreenY() - (anchor.get().getY() + primaryStage.getY())));
} else if (root.getCursor() == Cursor.SE_RESIZE) {
primaryStage.setWidth(widthStage.get() + (me.getScreenX() - (anchor.get().getX() + primaryStage.getX())));
primaryStage.setHeight(heightStage.get() + (me.getScreenY() - (anchor.get().getY() + primaryStage.getY())));
} else {// moving the stage
primaryStage.setX(me.getScreenX() - anchor.get().getX());
primaryStage.setY(me.getScreenY() - anchor.get().getY());
* Define a button
* @return a button
private Node createButton() {
Button button = new Button();
button.setEffect(new Reflection());
button.setText("Say 'Hello Java'");
button.setOnAction(new EventHandler<ActionEvent>() {
@Override
public void handle(ActionEvent event) {
System.out.println("Hello Java!");
/* add an animation effect */
Timeline timeline = new Timeline();
timeline.setCycleCount(Timeline.INDEFINITE);
timeline.setAutoReverse(true);
timeline.getKeyFrames().addAll(
new KeyFrame(Duration.ZERO, new KeyValue(button.opacityProperty(), 1.0)),
new KeyFrame(new Duration(5000), new KeyValue(button.opacityProperty(), 0.0)));
timeline.play();
/* set CSS style */
button.setStyle(
"-fx-font: 14px 'Cambria'; " +
"-fx-text-fill: #006464; " +
"-fx-background-color: #e79423; " +
"-fx-background-radius: 20.0; " +
"-fx-padding: 5.0;");
return button;

Items off the stage are showing up in the browser. How do I stop this?

When learning Flash, I was taught in the beginning that only items that appear on the stage actually show up in the final animation. Clearly, these people were wrong. I thought it would be easy to have some text move in from off the right side of the stage to the middle, but the text still shows up even before it enters the stage in the browser. I have tried to change this using various publishing options, HTML, and CSS, with no luck. I did have to resize the stage, and I'm not sure if that means anything. Can someone help me figure this out? Thank you.
-Chris

Here are a few things I noticed:
No DOCTYPE for the page:
http://www.w3schools.com/tags/tag_doctype.asp
then validate the code here:
http://validator.w3.org/
Next, your main container is 1000px wide (as per your CSS) but in your IE conditional you are placing a 1500 px wide .swf inside.
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="1500" height="217.....
so for course that won't work. In IE that results in a bottom scroll bar no matter how wide a monitor... it's never wide enough to display without scrollbar
FF is different because:

<object type="application/x-shockwave-flash" data="topbanner.swf" width="713" height="155">
You're using smaller dimensions....so set them both the same.
If your main container is 1000px wide, then the stage size of your .swf should be 1000px, not 1500, not 713. Then set the width/height of the <div> holding your .swf to the exact same size as the .swf. That should eliminate any off stage stuff from showing.
Best of luck!
Adninjastrator

How not to resize part of the stage?

Hello, I would like to know how to have a part of my website not resize with the browser window.
You can see what I want to achieve on the website...www.serialcut.com
They show their work as the page´s background which can be resize with the browser window, but their navigation always stays the same.
I know how to achieve the resizing effect, but it resizes the whole stage including navigation.
Any suggestions?
Thanks, Marcelo.
PS: I´m using flash CS3/A.S.2

It seems the protected ComboBoxEditor editor has as it's default editor component a JTextField.
I tried the following code snippet with a couple of other JComboBox constructers and came to the same result.
Hope this helps.
Symploximport java.awt.*;
import java.awt.event.*;
import javax.swing.*;
public class Combo extends JComboBox
   Combo()
      Component c = editor.getEditorComponent();
      System.out.println(c.getClass().getName());
      try{
         JTextField text = (JTextField)c;
      }catch(ClassCastException e)
         {System.out.println("Not a JTextField");}
   public static void main(String[] args)
      new Combo();
}

How to resize everything on the stage in all frames

Is it possible to resize everything on the stage in one (or a few) step? I know scaling the movie has the same result, but when working in Flash it's a lot easier when you see the actual size.

If you have done all your animations avoiding actionscript, then you can select multiple frames and layers via the timelines "edit multiple frames" icon

Resizing the wrapped swing component inside the javafx stage

I have a customized swing component & need to wrap it in javafx stage. But as & when the javafx scene resizes, I want to resize the swing component accordingly.
One way of resizing this is to scale the swing component. But is there any other way or layout to do it efficiently.
--Nitin Pokalwar

Hello
<p>Let's have a look at this Forms PJC/JavaBean site</p>
Francois

Resizing the text as stage resizes

I need to re size the text, as the stage re sizes. i.e scale the text depending on the stage width,height.
Tried to work on scaleX, scaleY properties. But didn't help.
Any references will be of great help.
--Nitin Pokalwar

Will it be possible to provide some sample code, so that requirement is a bit more clear..
You may try..
def text : Text = Text {
    content: "T"
    font: Font { size: 20 }
    textOrigin: TextOrigin.TOP
    transforms: Scale {
        x: bind (text.scene.width/text.layoutBounds.width)
        y: bind (text.scene.height/text.layoutBounds.height)
}

How to resize the Director stage

I need my programme to adjust the size of the Director stage
to one of 3 dimensions at startup 1024x768, 768x432 or 1280x720
acording to a variable it reads in from a ini file. How can this
best be achieved within a single Director movie (I don't want to
just have a stub movie that loads a relevantly pre-sized movie
file)?
Many thanks
Kevin

Ok, (the stage).rect and (the stage).drawRect work fine but
if what you want to do is a monitor resolution change, i recomend
to use the Enhancer Xtra is excellent about change monitors
resolutions and others things.

Z-index of the stage scrollbar

Hello,
I have some trouble with the stage scrollbar
I use an image that is 100% width & height and it overlap the scrollbar
to resolve that I tryed to modify the z-index of the stage, but the stage overlap the image
So my question is there a way to modify only the stage scrollbar z-index ?
something lie that :
sym.$("Stage.scrollbar").css("z-index","13");
thanks

I find a way by using the CSS:clip property like a mask
for exemple
sym.$("image").css("clip", "rect(0,150px, 150px, 0)");
but now I want to modify that when I resize the screen (but it doesn't work)
var largeur = '"rect(0,'+Number(stageWidth-17)+'px, '+stageHeight+'px, 0)"';
sym.$("image").css("clip", largeur);
if someone have a solution
thanks

Can't edit objects on the stage

Hi,
I'm stumped helping my colleague on the issue below so I'm logging this question.
Issue: My colleague is trying to edit a slide but can't edit any of the objects on the stage. However, it works fine when I open the same project on my machine. Is there a setting on her machine that's causing the issue?
In the screenshot below, check out Slide 2 (selected) notice how:
in the thumbnail there are multiple objects (white image on the left, blue text caption in the center) on the slide.
in the timeline multiple objects are available and selectable. All are set to be visible (the little "eye" isn't switched to off).
when you look at the stage, the only things that we see are the background and a single button.
The objects also appear fine in Preview.
On the stage, can "phatomly" select objects, but she can't change the characteristics of them (e.g., change text in a text caption, resize object, move object).
Screenshot:
OS: Windows 7
Captivate: v5.5 (running as Administrator)
Background info:
This project was initially created in an older Captivate version (4.0 or 5.0) and is now being edited/updated.
Last week, my colleague was trying to edit the same project (using v5.0). When she clicked play on the timeline, her audio wouldn't play. When she watched the Preview or tried to edit the audio, the audio would play just fine. Also, on my machine (running v5.5) it worked fine. This prompted me to suggest that she update to v5.5. Alas, it seems this fixed the audio issue, only to create this video issue.
Thanks,
- Dino

Here's a bigger/better quality image. I hope it helps.
Notice how the Text Caption is selected in the timeline and it's properties are visible on the right. Yet the item itself is nowhere to be seen on the stage. Also, now it seems to have disappeared from the thumbnail.

I can't obtain the stage's sizes

Situation:
I've got 2 swf files, 1 is a preloader which loads the 2nd swf file, my site.
Both of them, if started separately, work correctly.
Problem:
when I put the files together, linking the site's swf to the preloader, I get a null element error and the site loads not correctly.
What I've understood:
The preloader is ok, because I can remove the error message working on the site's swf AS code.
In the preloader's code I have some lines to center its animation on the stage, I do that like this:
import flash.display.Stage;
var myStage:Stage = this.stage;
then using myStage.stageWidth and myStage.stageHeight I calculate the clip position
Also on the site's code I do the same to center a movieclip using exactly the same code, but it doesn't work and I've found that the problem is the myStage variable, not because it has the same name as the variable on the other file (I've tried to name it myFrame).
It looks that on the site's swf the myStage variable can't be assigned and then results to be null.
Question:
How can I obtain the stage's height and width since
var myStage:Stage = this.stage;
doesn't work?

Hi Kumidan,
As far I have understood, you want to know the stage dimensions in order to center movie clips.
Whether on your preloader or your site SWF.
I am a beginner in AS3 but the way you create a new instance of the stage is weird.
Your movie can only have one stage.
Why dont you add a listener to the stage.
Here is something in AS3 :
stage.addEventListener(Event.RESIZE, resizeHandler);    // adding the listenener
resizeHandler (null);    // initializing value
function resizeHandler (event:Event):void
var sw:Number = stage.stageWidth;
var sh:Number = stage.stageHeight;
blahblahblah   // code that place your clips according to the stage dimensions sh and sw

Resizing the stage

Similar Messages

Maybe you are looking for