Form elements do not appear in output - actionscript-3

I have created a Flex project in Flash Builder 4.5.
Next I added fl.controls libraries (and then mx.controls libraries) in the project.
I am adding a screenshot so you can see the setup and the code.
However when I run/debug it, nothing appears in there. Totally white.
I've worked with fl.controls before, I used Flash CS5 to compile the ActionScript project and they worked correctly.
Is there any particular reason why it does not work in Flash Builder?
UPDATE: When I add graphics to the text input, i.e.
ti.graphics.beginFill(0xFF0000);
ti.graphics.drawRect(0, 0, 100, 30);
ti.graphics.endFill();
I do see a red rectangle shape. But still no editable text input box. I tried setting ti.editable = true but no use.

Try this:
Create a new FLA in Flash Professional. Add the TextInput component to your library. Notice that not only does the TextInput class get added to the library, but also a folder of "Component Assets" - skins and such. Flash Professional components are not just code - they are code and graphics.
If you want to use fl.controls.TextInput in Flash Builder, you can publish that FLA you just created with the "export swc" option checked. Include that swc in your Flash Builder project, and you'll be able to instantiate the TextInput in your code. If you want to add other Flash components, add them to the library in the FLA and republish the swc.

I would prefer using Flex itself, it will speed up your development. It's simple and does a lot of work for you.
If you do not want to do this you should give your text some properties like width, height, textFormat or use a css document for the text format. You could also give your text a border ( it should be a property of the TextInput ).
Do not forget to set the text format, otherwise the TextField doesn't know which font to use.
Sample for TextInput ( Bottom of Page )
http://help.adobe.com/de_DE/FlashPlatform/reference/actionscript/3/fl/controls/TextInput.html
Sample for Flex
http://help.adobe.com/de_DE/FlashPlatform/reference/actionscript/3/spark/components/RichEditableText.html

You can try this code:
private var ti:TextField = new TextField();
public function FormText(){
//adds ti possibly underneath 'this': stage.addChild(ti);
//adds ti on top of 'this':
stage.addChildAt(ti,getChildIndex(this));
// makes the TextField editable:
ti.type = TextFieldType.INPUT;
}
This should not only make sure that the TextField exists when the class is instantiated, but also puts the form in front of the class.
But this also assumes that the class has been added to the stage; so it may be better to add it like this:
private var ti:TextField = new TextField();
public function FormText(){
addEventListener(Event.ADDED_TO_STAGE, addedHnd);
}
private function addedHnd(e:Event)
{
removeEventListener(Event.ADDED_TO_STAGE, addedHnd);
//adds ti possibly underneath 'this': stage.addChild(ti);
//adds ti on top of 'this':
stage.addChildAt(ti,getChildIndex(this));
// makes the TextField editable:
ti.type = TextFieldType.INPUT;
}
Please review the TextField docs, too.

Why do you add your control to the stage? You should just add it to your form. i.e. this.addChild(ti)

Related

Using a movieClip as a variable

Previously in my code, I had a Variable, Chip. Chip moved around the screen and everything was fine.
var chip:Shape= new Shape();
chip.graphics.lineStyle(0,0);
chip.graphics.beginFill(0x3333FF,0.8);
chip.graphics.drawCircle(0,0,10);
chip.graphics.endFill();
was the code to make chip. Now I've make a movieClip and I would like to use the movie clip instead, so I know I'd start with something like
var chip:movieClip;
but I'm lost after that. How would I be able to use him in place of making the shape?
So I'd guess that you are using Flash IDE and have created a movieclip for your Chip that is now in your library and you don't know how to add it to the stage :)
Right-click on your movieclip in the library and select "Properties". In the advanced section select the "Export for actionscript" checkbox and give your movieclip a linkage name in the "Class" Input field, for example "Chip". Leave the "Base name" as MovieClip.
Now your movieclip is accessible via actionscript and you could add it to your stage:
var chip:ChipMC = new ChipMC();
addChild(chip);
trace(chip.x, chip.y);

as3 creating a custom property in Emanuele Feronato's "Flash Game Development by Example"

I recently picked up Emanuele Feronato's Flash Game Development by Example to try and help expand my knowledge of game design and actionscript 3, and I'm stuck on the first chapter where we're building basically a memory match two game where you have ten sets of tiles and you try and match them up by clicking on them.
In the code I'm stuck on, Mr. Feronato is adding the tiles to the stage using a for loop and addChild, here's the code in particular:
// tile placing loop
for (i:uint=0; i<NUMBER_OF_TILES; i++) {
tile = new tile_movieclip();
addChild(tile);
tile.cardType=tiles[i];
tile.x=5+(tile.width+5)*(i%TILES_PER_ROW);
tile.y=5+(tile.height+5)*(Math.floor(i/TILES_PER_ROW));
tile.gotoAndStop(NUMBER_OF_TILES/2+1);
tile.buttonMode = true;
tile.addEventListener(MouseEvent.CLICK,onTileClicked);
}
// end of tile placing loop
In the 5th line, you can see that he creates a custom property of the tile variable called "cardType," but when I try and run the code I get the error "Access of possibly undefined property cardType through a reference with static type Tile." I have the class Tile extending MovieClip, and the main class extends Sprite, but as far as I can tell I've written the code exactly as in the book and can't get past this. I thought about just using a normal int variable cardType to hold tiles[i] but later on you use the cardType property on a mouse event so I'm a little stuck.
Has something changed in Flash that no longer allows you to create custom properties in this way? Or did I just do something stupid that I'm not catching.
As always, thank you so much for the help.
ActionScript supports dynamic classes, in which properties may be added during runtime. Without the dynamic keyword, a class is sealed, meaning its properties may not be altered.
MovieClip is an example of a dynamic class.
Instantiating a MovieClip from code (or MovieClip instance created in Flash Professional), adding this property would be supported:
var tile:MovieClip = new MovieClip();
tile.cardType = "custom value";
However from code, even if extending MovieClip you must add the dynamic keyword:
package {
import flash.display.MovieClip;
public dynamic class Tile extends MovieClip {
/* ... */
}
}
Now, you may add properties to your Tile instance:
var tile:Tile = new Tile();
tile.cardType = "custom value";

Unable to access children in movie clip

Inside flash cs6 I have drawn a flash movieclip in which I set export settings as abc.Gameboard. Inside gameboard I have a bunch of pieces (symbol:Piece) which I export as abc.Piece - both base class set to MovieClip and with class files. The piece has frame labels like hit, over etc.. My problem is accessing the pieces in code so I can eg. gotoAndPlay("mine") - at the moment the event only fires once which is the last piece on the board.
I can set the frame action on this last piece but would like to figure out how to do same for each piece.
I add a gameboard to the stage like so
var gb:Gameboard = new Gameboard();
gb.name = "gb001";
contextView.addChild(gb);
Then
contextView.addEventListener(Event.ADDED, thingAdded);
private function thingAdded(event:Event):void
{
var type:String = event.target.toString();
switch(type)
{
// this runs only once - i want it to run for each piece that is inside the symbol
case "[object Piece]":
var p:MovieClip = event.target as Piece;
p.gotoAndPlay("mine");
break;
}
}
or if there's a better way that would be great.. this looks pretty clunky
Edit: Bit more info about how I'm trying to build the gameboard
Draw a collection of shapes in illustrator - mask it (Gameboard region). Import into Flash as Graphic. Convert graphic to several movie clip symbols (So JSFL can drill down and access masked pieces) - run JSFL script & create 00's of pieces. Then I set export settings on Piece and Gameboard and add Gameboard to the contextView.
I actually wrote an entire article about this once. The ADDED event should fire once for every DisplayObject that gets added. Are you sure that you're not using ADDED_TO_STAGE, which does not bubble? If you're using ADDED_TO_STAGE, then you need to set the useCapture flag to true to get it to fire for all children.
If you want to involve RobotLegs in the process, probably the better way is to simply create a "marker" Class for each specific button that you want to have behave in a different way, then register a mediator for each Class that will manage the behvior. Robotlegs already has the hooks built in to listen for ADDED_TO_STAGE and do this.
However, you could also consider using the Flash IDE for what it's for, which is putting stuff on stage. In that case, your GameBoard instance will be ready in the constructor of your main document Class for you to do whatever you want with it.
MPO is that logic that is outside Gameboard shouldn't know or care how it works internally, and honestly it probably shouldn't even be GameBoard's responsibility to handle simple stuff like button over states and things. That should be up to the button itself. If the buttons don't need to toggle or anything beyond what SimpleButton handles, you can just declare the button instances as Button in the library instead of MovieClip and get all that stuff for free instead of coding it yourself.
Part of being a good coder is in being able to figure out ways not to code everything.
in their Gameboard inside Piece? I want know exactly your Gameboard Structure.
If you're right. try this:
function thingAdded(e:Event):void
{
if(!e.target is Gameboard) return;
var mc:Gameboard = Gameboard(e.target);
var i:int = 0;
while(i<mc.numChildren)
{
if( mc.getChildAt(i) is Piece)
{
var piece:Piece = Piece(mc.getChildAt(i));
piece.gotoAndStop(2);
}
i++;
}
}
Here is my Sample code: Gameboard

How could I compile the code for this Flash tutorial?

I started reading this tutorial: http://active.tutsplus.com/tutorials/actionscript/creating-a-reusable-flash-uploader-with-actionscript-3-0-and-php/
I'm using FlashDevelop, and I pasted the full code into an ActionScript file. The errors I'm receiving are like this:
C:\Users\tempus\Documents\uploaderas\Uploader.as(30): col: 4 Error: Access of undefined property select_btn.
select_btn.addEventListener( MouseEvent.CLICK, browse );
^
C:\Users\tempus\Documents\uploaderas\Uploader.as(31): col: 4 Error: Access of undefined property progress_mc.
progress_mc.bar.scaleX = 0;
...
I understand that the errors appear because the objects have not been declared ( and they appear to be instantiated from somewhere ), but I don't understand how/what should I include to declare them. Could you point me towards a solution?
It's because the buttons are created in the Flash IDE (as the tutorial was meant to be compiled using the Flash IDE). Since the buttons don't exist in the code aspect you get that error.
You can either create the elements yourself via code, or use the Flash IDE and export a swc/swf of the neccessary UI elements and include that in your flashDevelop project. I'm assuming you'll want to do the latter -
in the Flash IDE, open the .fla, open the library panel, find the progress asset, right click it and bring up the properties. Check the "Export For ActionScript" option, then in the 'Class' field give it a unique name like "SelectBtn". Do the same for the 'progress' asset (only a different class name like 'ProgressBar'). Go to the flash publish settings, and on the flash tab select 'export swc'. publish the file and place the published swc in your flash Develop project folder (traditionally the lib folder of your project).
In Flash Develop, right click your swc and choose 'Add To Library'. (You may need to right-click again and go to options and choose the include completely option). Now you can access those classes you setup in Flash. Then in your code, declare and initialize the display assets:
public var select_btn:SelectBtn = new SelectBtn();
public var progress_mc:ProgressBar = new ProgressBar();
You'll also need to do that textField too. It would be easiest just to do it in your code though.
public var label_txt:TextField = new TextField();
Keep in mind you'll need to manually position and use addChild on all three elements this way. If you want to keep the positioning that's in flash, just select all the elements on the stage and press F8 to convert them to a MovieClip. Then in the library setup linkage the same as the others and give it a class name of something like "DisplayAssets" and export a new swc. Then your code would look like this:
public var select_btn:Sprite;
public var progress_mc:Sprite;
public function Uploader(){
var displayAssets:DisplayAssets = new DisplayAssets();
addChild(displayAssets);
select_btn = displayAssets.select_btn;
progress_mc = displayAssets.progress_mc;
//the rest of the code
}

AS3: Making a SimpleButton from library sprites: Possible?

I'm working on a small project in AS3, and I need to make some interface buttons. I had them as separate classes at first, but then realized that it was probably overkill, and on top of that, figured out a way to simplify the event calls by making them buttons and assigning the event dispatches to their parent.
ANYWAY,
I tried remaking them using the SimpleButton class, but I can't figure out how to give the buttons any sort of design. Every tutorial on the web uses SimpleButton to make only the most bare-bones Actionscript graphics by actually drawing them with the code (why anybody would want to do that is beyond me), and my attempt at assigning a library item to the upState:
_deletebutton = new SimpleButton();
_deletebutton.upState = mc_deleteButtonUp; <--- exists in my library
doesn't do anything.
The Adobe docs say that the various states take DisplayObjects, which mean they take Sprites and MovieClips, so you should be able to do this. Does anyone know how?
THANK YOU
+1 weltraumpirat
the example in the doc generates the states by code but you can assign whatever displayObject to the different states of the button.
var btn:SimpleButton = new SimpleButton();
btn.downState = new clipFromLibDown();
btn.overState = new clipFromLibOver();
btn.upState = new clipFromLibUp();
btn.hitTestState = new clipFromLibHit();
btn.useHandCursor = true;
addChild( btn );
assuming you have 4 states called : clipFromLibDown, clipFromLibOver ... in your library, this works
You have to instantiate an item from your library in order to use it with ActionScript. To do this, click "Export for ActionScript" and assign a class or base class to mc_deleteButtonUp in the properties panel. Then use the new operator with the assigned class to instantiate it. You can start your button by using the example from Adobe's documentation, then change things to fit your own program.
You're probably not setting the hitTestState property of your SimpleButton instances. This property is a DisplayObject that defines where the user has to move the mouse to get mouse events on the SimpleButton. You will never see the DisplayObject that you set this to. I would suggest just using one of the DisplayObjects you are already using for another state.
http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/display/SimpleButton.html#hitTestState
Also you will need to use the new operator as weltraumpirat and nicoptere have already said.