Whats wrong with the code?

00george

  • Posts: 161
Hi I was looking online at how to code in a text field and I found some code someone made so I copied it into stencyl but it gives me errors. I put the code in a code block inside the when created block. The code is:
Code: [Select]
    //Creating the textfield object and naming it "myTextField" 
    var myTextField:TextField = new TextField(); 
     
    //Here we add the new textfield instance to the stage with addchild() 
    addChild(myTextField); 
     
    //Here we define some properties for our text field, starting with giving it some text to contain. 
    //A width, x and y coordinates. 
    myTextField.text = "some text here!"; 
    myTextField.width = 250; 
    myTextField.x = 25; 
    myTextField.y = 25; 
     
    //Here are some great properties to define, first one is to make sure the text is not selectable, then adding a border. 
    myTextField.selectable = false; 
    myTextField.border = true; 
     
    //This last property for our textfield is to make it autosize with the text, aligning to the left. 
    myTextField.autoSize = TextFieldAutoSize.LEFT; 
     
    //This is the section for our text styling, first we create a TextFormat instance naming it myFormat 
    var myFormat:TextFormat = new TextFormat(); 
     
    //Giving the format a hex decimal color code 
    myFormat.color = 0xAA0000;   
     
    //Adding some bigger text size 
    myFormat.size = 24; 
     
    //Last text style is to make it italic. 
    myFormat.italic = true; 
     
    //Now the most important thing for the textformat, we need to add it to the myTextField with setTextFormat. 
    myTextField.setTextFormat(myFormat); 
I also have the error.
Code: [Select]
Behavior: Design_0_0_TextField at line 37
Type was not found or was not a compile-time constant: TextField.
    var myTextField:TextField = new TextField(); 

Behavior: Design_0_0_TextField at line 57
Type was not found or was not a compile-time constant: TextFormat.
    var myFormat:TextFormat = new TextFormat(); 

Behavior: Design_0_0_TextField at line 37
Call to a possibly undefined method TextField.
    var myTextField:TextField = new TextField(); 

Behavior: Design_0_0_TextField at line 40
Call to a possibly undefined method addChild.
    addChild(myTextField); 

Behavior: Design_0_0_TextField at line 54
Access of undefined property TextFieldAutoSize.
    myTextField.autoSize = TextFieldAutoSize.LEFT; 

Behavior: Design_0_0_TextField at line 57
Call to a possibly undefined method TextFormat.
    var myFormat:TextFormat = new TextFormat(); 


coleislazy

  • *
  • Posts: 2607
The problem is you are trying to use the TextField and TextFormat classes, but they have not been imported. Adding these lines should make it work:
Code: [Select]
import flash.text.TextField;
import flash.text.TextFormat;
You'll also have to change "addChild(whatever)" to "FlxG.stage.addChild(whatever)".

but...

Stencyl is built on top of Flixel which bypasses the normal Flash display list and instead renders everything to a Bitmap screen buffer. You can add a text field, but its going to "float" on top of everything else, including the mouse cursor.

Alexin

  • *
  • Posts: 3132
You can still use a TextField. Don't add it to the stage and draw it on FlxG.buffer.
"Find the fun"
alexin@stencyl.com

coleislazy

  • *
  • Posts: 2607
Never would have thought of that!

DoctorMikeReddy

  • *
  • Posts: 180
That's just what I'm after, as it allows system fonts rather than converted bitmaps. How though do you use FlxG.buffer to render the TextField to screen, rather than adding it to the Scene? Forgive me if this is an obvious question.

DoctorMikeReddy

  • *
  • Posts: 180
Getting an error for this line:

myTextField.autoSize = TextFieldAutoSize.LEFT; 

which is fixed if you use the following import, rather than that suggested:

   import flash.text.*;

as the TextFieldAutoSize.LEFT is not defined otherwise.


DoctorMikeReddy

  • *
  • Posts: 180
Playing with this:

http://community.stencyl.com/index.php/topic,8665.0.html

and some AS3 code from here:

http://thierryzoghbi.co.uk/blog/2009/03/capturing-text-input-as3/

I've got the ability to input text that works with foreign keyboards, including Cyrillic characters, etc.
This is AWESOME for me, as it allows me to capture and render to screen non-latin characters, which has been an issue for some time in an EU project I am involved with. Not only does this allow characters outside the usual SW a-z, 0-9 plus some punctuation, it allows user configurable colours for text, background, style, etc, which is a God(dess) send for Children with Dyslexia for whom my games are being developed.

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/text/TextField.html has information on how to change background and border colours, etc,

Place the following in a script for a scene inside a code block in the When Created block:

Code: [Select]
import flash.text.*;

    //Creating the textfield object and naming it "myTextField" 
    var myTextField:TextField = new TextField(); 
     
    //Here we add the new textfield instance to the stage with addchild() 
    FlxG.stage.addChild(myTextField); 
     
    //Here we define some properties for our text field, starting with giving it some text to contain. 
    //A width, x and y coordinates.
    myTextField.type = TextFieldType.INPUT;
    myTextField.width = 250; 
    myTextField.x = 25; 
    myTextField.y = 25; 
    myTextField.background = true;
    //Here are some great properties to define, first one is to make sure the text is not selectable, then adding a border. 
    myTextField.selectable = true; 
    myTextField.border = true;
    // If you WANT to restrict input characters, here's how to do it!
    //myTextField.restrict = '1234567890,. QWERTYUIOPASDFGHJKLZXCVBNMqwertyuiopasdfghjklzxcvbnm';
    //myTextField.restrict = '1234567890'; woudl be for numbers only for example.
   
    //myTextField.multiline = true; // Causes RETURN characters (i.e. newlines) to be inserted into the text if the cursor is mid text
   // myTextField.wordWrap = true;  // Causes the auto size below not to work if enabled.
    //This last property for our textfield is to make it autosize with the text, aligning to the left. 
    myTextField.autoSize = TextFieldAutoSize.LEFT; 
   
    //This is the section for our text styling, first we create a TextFormat instance naming it myFormat 
    var myFormat:TextFormat = new TextFormat(); 
     
    //Giving the format a hex decimal color code 
    myFormat.color = 0xAA0000;   
     
    //Adding some bigger text size 
    myFormat.size = 24; 
     
    //Last text style is to make it italic. 
    myFormat.italic = true; 
 
    //Now the most important thing for the textformat, we need to add it to the myTextField with setTextFormat. 
    myTextField.defaultTextFormat = myFormat; 
    myTextField.text = "some text here!";
   
var OutputBox:TextField = new TextField();
OutputBox.background = false;
OutputBox.x = 25;
OutputBox.y = 200;
OutputBox.selectable = false; 
    OutputBox.border = false; 
     
    //This last property for our textfield is to make it autosize with the text, aligning to the left. 
    OutputBox.autoSize = TextFieldAutoSize.LEFT; 
     
FlxG.stage.addChild(OutputBox);
//Use OutputBox.text = "blah"; for standard text printing or OutputBox.htmlText for HTML formatted text. Note I cannot get the font colour to work :-(
OutputBox.htmlText = "<P ALIGN='LEFT'><FONT FACE='Ariel' SIZE='36' COLOR='00FF00' LETTERSPACING='0' KERNING='0'><b>Lorem ipsum dolor sit amet.</b></FONT></P>";

Then add a Keyboard event with the following inside a code block:

Code: [Select]
var str:String = myTextField.text;
OutputBox.text = str;
//myTextField.text = "Start again!"

and set the event to When enter IS released. It might be possible to use an AS3 event handler, but this seemed a better way to integrate into SW.

DoctorMikeReddy

  • *
  • Posts: 180
Now to get it working with Actors...

DoctorMikeReddy

  • *
  • Posts: 180
Still can't figure out how to use FlxG.buffer to allow mouse on top though...

coleislazy

  • *
  • Posts: 2607
You can't. You'll have to hide the Flixel mouse, add a Sprite or MovieClip to the stage, then add the appropriate cursor Bitmap to the Sprite or MovieClip, then update its position to the x/y coordinates of the mouse each update.

I can't check right now, but I think a CPMStar ad behavior I uploaded to StencylForge has an example of this.