Need flash application gui architecture advice - actionscript-3

I need your advice on how to organize a GUI in flash application. See image:
http://dl.dropbox.com/u/32811/Screen%20Shot%202012-04-25%20at%2015.40.31%20.png
Application is video player. I have buttons group that must be hidden when the mouse is out of the player. I added a Sprite, and all my buttons i have added as a child of this sprite. In this case i hide the parent, rather than each button individually.
There are several problems:
When parent Sprite resize occurred, all of his children resizes with him.
I would like to position children relative to their container, but it is very difficult, because i can not set width and height of parent sprite.
I would like to set the width and height of the parent Sprite, position buttons inside, and any resizing in it will occur automatically.
The question is: I am using the wrong tools, or use them somehow wrong? Are there any GUI frameworks that can help with building layout?

write this line at Creation Complete Event or any where at beginning of code
fscommand("allowscale","true");
it will maintain aspect ratio of application so all children of application will resize and scale properly
try this it will work

Related

Skrollr only displays end keyframe unless I resize the window

Excuse me that I don't know much JavaScript since I'm a designer.
I have two animations in relative mode which, when you initially view them are displayed at their end keyframe even though they're supposed to be at their start keyframe (at that point in the scrolling). If you resize the browser window in any way, they assume their correct behavior and jump back to the start keyframe where they're supposed to be. However, if you refresh the page again they always load at the end keyframe, which makes me think that they're getting the wrong viewport size or scrolling position.
Here is the site: http://vostrocity.dreamhosters.com/#skills
For example, the following displays only its end keyframe unless I resize the window:
<div id="venn-prototyping" class="venn"
data-100-top-top="transform[swing]:translate(0px,0px);"
data--100-top-bottom="transform[swing]:translate(-290px,600px);">
<h2>Prototyping</h2>
</div>
I have one animation in absolute mode which works fine without resizing the browser window.
Make sure you initialize skrollr when all images, which affect layout, are loaded. For example inside of the examples element, there are images which affect the height of the parent and thus the position of your venn diagrams relative to the viewport (as soon as the images are loaded, your diagram moves down). Your diagram is actually animating, but before it enters the viewport, because of this offset.

As3 Movieclip background image size

I am working with box2d, and generating a few grounds of variable size (all rectangles). The image the grounds use is 500px by 200px, however, when I create and size my grounds, the background image stretches to fill the body. I am trying to have it aligned to top left and just tile with no resizing but am really unsure of how to control it.
I imported the image as a movieclip to my library, if it helps, and also have a basic empty class for it (EarthGround.as). I've been doing a little research but really haven't found anything definitive about manipulating the movieclips associated image.
You have to be specific with that. Maybe a screen shot would help.
Until then, possible causes could be:
Box2D uses real world values where 1 pixel = 1 meter. You have to
choose a scale factor.
Box2d uses the center of any object as its registration point. You
should always do the same with your flash sprite/movieclip, to keep
it simple.

on runtime paint the whole panels in the gui

I want to be able to change the background color of the gui form.
If I change the parent panel gui - i want all of its descenders to get the same color.
Is it possible to do it without iterating on all comonents?
10x.
If you want components within your parent container to have the same background color you might setOpacity to false for them (at least for JPanels and other containers).
If you want your complete application to look differently you might consider switching to another Look&Feel (http://download.oracle.com/javase/tutorial/uiswing/lookandfeel/plaf.html).

How to make an swf compatible with all screen resolutions?

I'm not really sure how to go about it, but I'd like to have the swf get as big as possible for each user without requiring scrolling. Of course it would stick to a certain ratio, currently I'm using 2:1 but that could be changed (maybe I should use 16:9 since it is the standard widescreen ratio).
I am only using Actionscript 3 for code and MXMLC for compiling.
Simply display the SWF (inside of the html) with 100% width and 100% height. That way it will use all the available space.
Then make sure you are setting Stage.scaleMode to no StageScaleMode.NO_SCALE and make sure that your content is able to redraw its layout based on the actual available space. In MXML you can do that by using Boxes and percental sizing and/or absolute margin positioning (by setting top/right/bottom/left to a fixed value on at least two sizes). If you are constructing the layout using code, you can make use of Stage.stageWidth and Stage.stageHeight to calculate the correct sizes of your elements and use the Event.RESIZE event to get notified when the movie changes it size for whatever reason.

How to embed an unobtrusive flash?

I have an embedded flash that is transparent so it looks like part of the background. I achieved that by setting wmode to transparent.
My problem is that the area underneath the flash becomes inaccessible, even though the flash is transparent. Therefore I cannot click on any links or buttons that are under the flash object.
How do I make the flash unobtrusive?
Clarifications:
- the flash is transparent but it has an animation that shows in the background.
- wmode set to transparent lets you click the contents underneath in IE but not Firefox.
The problem is that in your document, the object/embed that contains the Flash animation is on top of the elements you need to access. You need to put these elements on top of the Flash animation instead of the other way around.
The way to do this is to set the object's wmode to opaque, and use the CSS z-index property to set it to a z-index lower than the z-index of whatever elements you want to float over it -- you can do this in CSS or just with inline style="" attributes.
Here's an example using SWFObject to create the object/embed tags, but the same principle applies if you are just hardcoding these into your HTML.
I didn't know there could be such a thing as unobtrusive flash.
On a more serious note: what are you trying to accomplish with a layer of flash anyways?
I suggest taking a step back and looking at the page as a whole. If the things below the flash are needed, then make the flash go somewhere else or replace it with actual elements in the page to serve the same purpose.
What is the purpose of the Flash? If it doesn't do anything visible, then you can make it 1 pixel in size and/or put it in a div that is absolutely positioned off the screen.
I think I might have found the answer to my own question.
There is a javascript library called Unobtrusive Flash Objects (UFO), which got deprecated and now is swfobject.
I will give it a go and report back.