Archive for the 'Tutorials' Category
BBS trashed, move to google group
iiley May 17th, 2011
Hi, please join our group: http://groups.google.com/group/aswing-discuss
Any AsWing related topics can be discussed here.
Thank you
AsWing 2.0 Beta Released
iiley March 11th, 2011
After a long time break, finally we get a time to make AsWing 2.0 finished. We first release it as beta, however, the core framework is stable in the svn for a long time, we are trying to get more feedbacks from this release.
The main change from 1.5 is the new default LookAndFeel, you can see there are many products already using the new features, such as AWSSOFT products, Postprint, this6 and some webgames etc. For more details of the new LookAndFeel features, see the Presentation.
Click here to download AsWing2.0beta all-in-one package.
changelog:
___________________________AsWing 2.0 beta_________________________
New default LookAndFeel
Added style tune feature
Added mideground color feature
Added JStepper — a Numeric Stepper component
Improved JAdjuster, state change event will fired when input changes
Fixed JComboBox selection change event bug
Improved JTable(
will not limit its maximize size,
added footer feature, it now can has a footer in its view,
improved show/hide grid methods, easier use than before)
Added DateChooser component
Added WeightBoxLayout
Many other little bugfixes
AsWing 3D experiment
iiley July 13th, 2009
From AWSSOFT’s Droower comments, i saw Srdjan has done some transform of AsWing components. There is a Rotated/Skewed text with scrollbar, so i guess maybe we can made 3D effects for user interface by just AsWing components, with some test, i first just rotate a JList with JFrame, sadly the text will not be shown when rotated(this should be a well-known flash feature), see this rotation. I guess Srdjan cached his text into a Bitmap, so his Rotated/Skewed text displays well.
Then, i tested the new properties from FP10, rotationX/Y/Z, it’s exciting that FP10 renders text very well in 3D transform. See this rotation_y. It’s almost a realy 3D user interface, currently everything is fine except the Drag function of JFrameTitleBar, maybe the drag() function doesn’t works with 3D transform.
Here’s the source code snip(it’s simple):
AsWingManager.initAsStandard(this);
var sprite:Sprite = new Sprite();
addChild(sprite);
var jf:JFrame = new JFrame(sprite, "Test JFrame");
var jlist:JList = new JList();
var model:VectorListModel = new VectorListModel();
for(var i:int=0; i<100; i++){
model.append(i + " uitem");
}
jlist.setModel(model);
jf.setContentPane(new JScrollPane(jlist));
jf.setSizeWH(300, 160);
jf.show();
sprite.x = sprite.y = 150;
sprite.rotation = -40;
Flash MiniBuilder: Online AS3 IDE
iiley July 8th, 2009
Maybe it is a old news, many guys already have seen the awesome stuff yesterday — Code and Edit and Compile then Run your ActionScript programme online. It is not a simple text editor and call backend compiler, it is powerful just like a real IDE! Great works, Victor!!
Flash MiniBuilder
The reason i post it here because it use AsWing, although it just used scrollbars buttons and combobox, not a heavy use of AsWing, but maybe we can never know the inside if the author does not tell us:
for quite a while, i’ve been looking for a component set that would suite my needs better than the bulky flex
one of the problems i couldn’t get flex to solve is editing big texts (like 6000 lines), where it becames very slow.
i tried to build my own text area and failed under flex, it’s still slow anything i do
but i managed to build a very fast one using aswing and viewportable interface.
the purpose of this component is editing actionscript code, and some class files are quite longusing aswing and viewportable, this component can manage pasting 6000 lines of code instantly and then
scroll with no delay at all. of course, it renders only the visible fragment of text.
This is not a defence or compares, it just says that AsWing can handle that flexible i even don’t know. Of course it is main because of the great implement of ScriptArea too.
How 2.0 will works with skins
iiley February 6th, 2009
Well, at the past, it’s hard to custom the skin of AsWing components.
With 2.0, we plan to improve this because there’s not many guys can make a new LookAndFeel, they want to change some basic properties directly by just call some methods.
Here it is, for example we have a normal button – “A Button”.(The first button in the picture, PS:this is not the final design of button look, it will be well designed when 2.0 released)
We want to change its color, just call button.setBackground(new ASColor(0xF4A0AA));, it will be looks like “Blue Button”, you can see it changes well, the gradient, border and shadow keep looks well, really a blue button.
How about a red button? Simple, setBackground(new ASColor(0xf4a0aa)); then it will looks like “Red Button”.
Want to make it flater? Yes you can, there’s StyleTune for every component, you can call button.setStyleTune(button.getStyleTune().sharpen(0.1));, then it will looks like “Flatten Button”, 0.1 times gradient; well same way to sharpen it call button.setStyleTune(button.getStyleTune().sharpen(2)); it becomes 2 times sharper than normal one like “Sharpen Button”
Also, you can change the round property of StyleTune to 10, you’ll get a button looks like “Round Button”.
All about StyleTune class, it has 5 major properties to affect the style of a component, you can read the asdoc to know it:
/**
* Gradient brightness range of content color [-1, 1]
*/
public var cGradient:Number;
/**
* The birightness offset for border color [-1, 1]
*/
public var bOffset:Number;
/**
* Gradient brightness range of border color [-1, 1]
*/
public var bGradient:Number;
/**
* Shadow alpha value [0, 1]
*/
public var shadowAlpha:Number;
/**
* The round rect radius, 0 means not round [0, +]
*/
public var round:Number;
private var mideAdjuster:StyleTune;
/**
* Create a UIColorAdjuster with specified params
* @param cg gradient brightness range of content color
* @param bo birightness offset for border color
* @param bg gradient brightness range of border color
* @param sa shadow alpha
* @param r the round rect radius, 0 means not round
*/
public function StyleTune(cg:Number=0.2, bo:Number=0.15, bg:Number=0.35, sa:Number=0.2, r:Number=0)
With a full customized StyleTune and background foreground set, you even can get a button like “Customed” button in the picture. Its StyleTune and colors are:
button.setStyleTune(new StyleTune(0.18, 0.05, 0.20, 0.20, 2));
button.setBackground(new ASColor(0x299083));
button.setForeground(new ASColor(0xFFFFFE));
Next time, i’ll introduce another feature about Component.setMideground()
How to make a Popup always on top?
iiley 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;
}
Create a AsWing’s NumericStepper
iiley November 5th, 2008
Although we have JAdjuster component for AsWing, but sometimes people ask us for NumericStepper, most time, we tell them just use JAdjuster, we know it’s different, but most time they are replacable.
Well, if you do want a NumericStepper component, it’s easy to create by your self, just combine with JTextField+2Button, with a BoundedRangeModel, a basic MVC NumericStepper component born.
Here’s a example implementation, see the demo screenshot below:
The test App source code:
package{
import flash.display.Sprite;
import flash.events.Event;
import org.aswing.*;
public class NumericStepperTest extends Sprite{
private var infoText:JTextArea;
private var ns:NumericStepper;
public function NumericStepperTest(){
super();
AsWingManager.initAsStandard(this);
var frame:JFrame = new JFrame(null, "NumericStepperTest");
var topPane:JPanel = new JPanel();
ns = new NumericStepper();
var button:JButton = new JButton("Reset");
topPane.appendAll(button, ns);
infoText = new JTextArea();
frame.getContentPane().append(topPane, BorderLayout.NORTH);
frame.getContentPane().append(
new JScrollPane(infoText), BorderLayout.CENTER);
frame.setSizeWH(300, 300);
frame.show();
ns.addStateListener(__nsStateChanged);
button.addActionListener(__resetValue);
}
private function __resetValue(e:Event):void{
ns.getModel().setValue(50);
}
private function __nsStateChanged(e:Event):void{
infoText.appendByReplace("value : " + ns.getModel().getValue()+"\n");
infoText.scrollToBottomLeft();
}
}
}
Well, for copyright reason, i can’t post all of the component codes, maybe after the book published, there will be a downloadable version.
But trust me, if you want, you can implement it easily by yourself, a Container with a BorderLayout, left is a JTextField(lost border and background), right is a Box contains two JButton with Arrow Icons, and with a BoundedRangeModel to hold the data(you can take JAdjuster as example), finally create a Border to your NumericStepper, it is!