Archive for the tag 'Tip'

How to make a Popup always on top?

November 6th, 2008

Some guys asked me about this question for times, i thought i should make a post here since you want to know this too.:)

Well, all the Popups in AsWing, including JPopup and all its sub classes such as JWindow JFrame, has their owner — the first param of their constructor, for example new JFrame(owner, …), the owner specified where the popups create their assets. You can set a default owner for all popups by calling AsWingManager.init(defaultOwner, …) or AsWingManager.setRoot(defaultOwner), if there’s a default owner set, you can pass null to the popup constructors, null means to use default one.

So, how to make a popup on top of others? Yes, you already know, just make its owner on top of others, for example, there’s two sprite on your stage, sprite2 is on top of sprite1, if you call AsWingManager.setRoot(sprite1) to make sprite1 as default owner, then you created a popup with sprite2 as its owner for example topFrame = new JFrame(sprite2, …), then you’ll got topFrame always on top of other popups which created with default owner.

BTW, the owner can be a JPopup instance too, if a owner is a popup, the created popup will be its sub popup, always on top of parent popup and if parent popup hide or minimized the sub popup will be non-visible.

Here’s a demo:

public class TopPopup extends Sprite{

private var sprite1:Sprite;
private var sprite2:Sprite;

public function TopPopup(){
super();
sprite1 = new Sprite();
sprite2 = new Sprite();
addChild(sprite1);
addChild(sprite2);

AsWingManager.initAsStandard(sprite1);
createFrame(null, "Normal Frame1");
createFrame(null, "Normal Frame2");
createFrame(createFrame(null, "Parent"), "Sub").setSizeWH(100, 80);
createFrame(sprite2, "Top Frame").setSizeWH(200, 140);
}

private function createFrame(owner:*, title:String):JFrame{
var frame:JFrame = new JFrame(owner, title);
frame.setDragDirectly(true);
frame.setSizeWH(140, 100);
frame.setLocationXY(Math.random()*200, Math.random()*100);
frame.show();
return frame;
}

}

TopPopup
(Click here to run the SWF)

Tags:

Tip 2, Unregular Window, JWindow+GraphicsAsset

July 14th, 2008

Some times, our art designer prefer a unregular window, especially for a game UI or some cool application.

Well, here is a tip:


package{

import flash.display.DisplayObject;
import flash.display.Sprite;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.filters.DropShadowFilter;
import flash.geom.Rectangle;

import org.aswing.*;
import org.aswing.border.EmptyBorder;

public class UnregularWindow extends Sprite{

[Embed(source="windowbg.png")]
private var imgClass:Class;

private var window:JWindow;

public function UnregularWindow(){
super();

AsWingManager.initAsStandard(this);

window = new JWindow();
var img:DisplayObject = new imgClass() as DisplayObject;
img.filters = [new DropShadowFilter()];
//make some blank space leave to the img shadow
window.setBorder(new EmptyBorder(null, new Insets(0, 0, 4, 4)));
window.setBackgroundDecorator(new AssetBackground(img));
//or even you can directly call addChild to append a image
//window.addChild(img);

var buttonPane:JPanel = new JPanel(new FlowLayout(FlowLayout.CENTER));
buttonPane.appendAll(new JButton("OK"), new JButton("Cancel"));
window.getContentPane().append(buttonPane, BorderLayout.SOUTH);
window.getContentPane().append(new JLabel("This is a JWindow"), BorderLayout.CENTER);
window.setSizeWH(300, 300);
window.show();
//simplly make the window dragable
window.addEventListener(MouseEvent.MOUSE_DOWN, __mouseDown);
window.addEventListener(MouseEvent.MOUSE_UP, __mouseUp);
}

private function __mouseDown(e:Event):void{
window.startDrag(false, new Rectangle(0, 0, stage.stageWidth, stage.stageHeight));
}

private function __mouseUp(e:Event):void{
window.stopDrag();
}
}
}

unregular window
(Click here to run the swf)
It is simple, just add a Image to the background of the JWindow, we added a Picture in this demo, but you, you even can add a Movie to be the background. Or even a MovieClip with Shapes, Buttons created by Flash IDE…

Tags:

Tip 1: Use EmptyBorder to make gap

July 11th, 2008

Assume we have a dialog looks like below:
gap1
It is created by code(snippted):

AsWingManager.initAsStandard(this);
var okButton:JButton = new JButton("Conform");
var cancelButton:JButton = new JButton("Cancel");
var tipButton:JButton = new JButton("Tip");
var pane:JPanel = new JPanel(new FlowLayout(FlowLayout.RIGHT, 4, 4));
pane.appendAll(tipButton, okButton, cancelButton);

var window:JFrame = new JFrame(null, "Gap");
window.getContentPane().append(pane, BorderLayout.SOUTH);
window.setComBoundsXYWH(10, 10, 200, 200);
window.show();

The three button is layouted by a FlowLayout, they have same 4 pixel gap between each other. If i want to increase only the gap between Tip and Conform buttons, it’s not easy to do it with little change of above code except use a EmptyBorder.
If i add this setence below tipButton creating:
tipButton.setBorder(new EmptyBorder(null, new Insets(0, 0, 0, 20)));
The final dialog will be looks like this:
gap2
You see, it’s easy.

EmptyBorder performance a border with blank graphics. So it is usually used to create gaps. And depond on AsWing Border system, border can be nested, so you even can make a gap between two border of one component, for exampel.
yourCompnent.setBorder(new LineBorder(new EmptyBorder(new BevelBorder(), new Insets(…))));

Tags: