I'm in the process of designing a Flash application, and it requires either two or three pieces of data from the user. The third data element is only relevant if one of the other elements has changed from the default value.
In order to prevent the user from inputting information that would skew the calculations based on the input, how can I gray out the text input box if the default conditional is unchanged? I could embed a conditional to ignore the input from that particular box, but I know that some users will fill in all data fields regardless of on-screen instructions.
Just use the Event.CHANGE listener + handler to check the condition/state of elements. This event is fired every single time the user alters a component. For example, heres a text input doing this:
var tf:TextInput = new TextInput();
var someOtherObject:Button = new Button();
tf.x = 100;
tf.y = 100;
tf.width = 150;
stage.addChild(tf);
stage.addChild(someOtherObject);
tf.addEventListener(Event.CHANGE, onFormChanged);
private function onFormChanged(e:Event):void
{
switch(e.currentTarget){
case tf:
//Do your conditional checks here.
if(tf.text.toString().length < 10){
someOtherObject.enabled = false;
someOtherObject.text = "";
someOtherObject.maxChars = 0;
}else{
someOtherObject.maxChars = 100;
}
break;
case someOtherObject:
break;
}
}
So basically, as the user types into tf, I'm making sure they have entered at least 10 characters. If they were to meet the condition, and then erase a character, the event would be fired again, and the condition would not be met, so someOtherObject is disabled.
Related
In short, I have clickable objects with varying colours. I want these colours upon being clicked to appear in my placeholders (there will be 6). I currently have managed to code so that upon clicking any colour it is placed in the first placeholder.
In what way am I able to code to recognise that the first placeholder has been filled and that once filled, the second placeholder should become the target?
Preferably until the 6th has been filled and then stopped, so that the user can see all 6.
I am thinking something like a for loop would be fitting, but I am not sure how to go about it.
So far it's looking something like this:
//Placeholder
var placeHolder1:MovieClip = new MovieClip();
placeHolder1.x = 20;
placeHolder1.y = 245;
stage.addChild(placeHolder1);
//Placeholder2 (UNUSED CURRENTLY)
var placeHolder2:MovieClip = new MovieClip();
placeHolder2.x = 60;
placeHolder2.y = 245;
stage.addChild(placeHolder2);
//Click and select colours
var newBlue:cBlue = new cBlue();
numBlue.addEventListener(MouseEvent.CLICK, fBlue)
function fBlue(e:MouseEvent){
placeHolder1.addChild(newBlue);
}
var newRed:cRed = new cRed();
numRed.addEventListener(MouseEvent.CLICK, fRed)
function fRed(e:MouseEvent){
placeHolder1.addChild(newRed);
}
First, you probably want to learn about Arrays (or Vectors). Arrays/Vectors are lists, so you would put all your placeholders into an array:
var placeHolders:Array = [placeHolder1, placeHolder2];
Though, since there is a formula to your place holder creation, you probably would want to do this in a loop to make it DRYer (Don't Repeat Yourself)
This loop would create 10 place holders and add them to the array:
var placeholders:Array = new Array();
for(var i:int=0; i < 10; i++){
var placeHolder = new Sprite(); //if your not using timelines, just use Sprite instead of MovieClip as it's less overhead
placeHolder.x = 20 * (i + 1); //i starts at 0, and goes to 9
placeHolder1.y = 245;
stage.addChild(placeHolder); //add it to the display list
placeholders.push(placeHolder); //add it to the array
}
Now (continuing to be DRY), attached the same event listener to all your color buttons:
numBlue.addEventListener(MouseEvent.CLICK, selectColor);
numRed.addEventListener(MouseEvent.CLICK, selectColor);
In that event handler I've called 'selectColor' (see code comments)
function selectColor(e:Event):void {
//get the first element in the array
var placeHolder:Sprite = placeholders.shift(); //shift removes the first item from the array, and returns it
placeHolder.addChild(e.currentTarget); //e.currentTarget refers to item that you attached the event listener to, in this case either numBlue or numRed
}
So to summarize, this gets the first placeholder in the array, remove that item from the array, then adds color button that was clicked as a child of that placeholder.
I've been having trouble getting this button to work. I want it so that whenever you click it, a new text field pops up that you can type stuff in. This is supposed to be for a trivia-like game, where the user inputs their own questions and answers. Here's the code so far...
This is the text field's properties -
QuestionTextField = new TextField();
QuestionTextField.defaultTextFormat = SmallTextFormat;
QuestionTextField.textColor = 0x660000;
QuestionTextField.x = stage.stageWidth * 0.1;
QuestionTextField.y = 200;
QuestionTextField.width = stage.stageWidth * 0.8;
QuestionTextField.height = 20;
QuestionTextField.selectable = false;
QuestionTextField.type = TextFieldType.INPUT;
QuestionTextField.border = true;
QuestionTextField.multiline = true;
QuestionTextField.wordWrap = true;
And this is the function that is supposed to create a new text field every time the button is clicked-
private function AddQuestionButtonClicked(m:MouseEvent){
for(var i = Questions.length; i>=1; i--){
container_buttonsMC.addChild(QuestionTextField);
Questions.push(QuestionTextField);
QuestionTextField.y += 20
}
}
Notes : "Questions" is an array that holds the number of text fields there are, container_buttonsMC holds all of the buttons on that are on the game's main menu.
The problem is that whenever I click it, it 1. Doesn't actually create a new text field, but instead moves it a certain amount of pixels down, and 2. It sort of duplicates the text field's position...if that makes ANY sense at all. If I click on the button once, it will move the text field down by 20 pixels. If I click on it again, it will move it down by 40 pixels, then by 80, and so on...
I also traced the length of the array, and surprisingly enough, the number that appeared would double every time I clicked it. However, only one text field is visible (apparently). It probably has something to do with the for loop's action, but I don't know for sure. Does anyone have an idea as to what the problem is? (Thanks in advance, I'm still new to AS3 and programming in general)
First, each need to create a new textfield every time you click the button, rather than adding it to the stage. With what you have at the moment, you only created one text field.
Secondly, you only want to do add one more text field, right? So instead of using a loop, which will create multiple new text fields, just create one extra text field and add it to the list.
The code will look something like
private function AddQuestionButtonClicked(m:MouseEvent){
var QuestionTextField:TextField = new TextField()
QuestionTextField.defaultTextFormat = SmallTextFormat;
QuestionTextField.textColor = 0x660000;
QuestionTextField.x = stage.stageWidth * 0.1;
QuestionTextField.y = 200;
QuestionTextField.width = stage.stageWidth * 0.8;
QuestionTextField.height = 20;
QuestionTextField.selectable = false;
QuestionTextField.type = TextFieldType.INPUT;
QuestionTextField.border = true;
QuestionTextField.multiline = true;
QuestionTextField.wordWrap = true;
// You can adjust the 50 here to control the spacing between text fields
QuestionTextField.y += 50 * Questions.length
container_buttonsMC.addChild(QuestionTextField);
Questions.push(QuestionTextField);
}
I'm trying to create a new keyboard somehow, for educational purposes.
I've written this code using actionscript 3.I've created an input text field (named it t1) .when the user presses q button on keyboard(which has an ASCII aquals 81 ) I want the letter b to be printed out on the text field so i've written this code :
stage.addEventListener(KeyboardEvent.KEY_DOWN, pressing);
function pressing(event:KeyboardEvent):void
{
//trace(event.keyCode);
if(event.keyCode==81)
t1.replaceSelectedText("b");
}
the problem was that the method replaceSelectedText prints the tow letters on the screen(q&b) which method can i use instead?
Any help would be appreciated.
When using the replaceSelectedText method, you first need to select the text you want to replace. This can be done with the "setSelection" method. This from the adobe help website:
setSelection(beginIndex:int, endIndex:int):void
"Sets as selected the text designated by the index values of the first and last characters, which are specified with the beginIndex and endIndex parameters."
At the moment, since you don't have any text selected, it appears to just be adding the text "b" as it's replacing nothing. Therefore, you should try first selecting the "q".
Alternatively, you can just use a different method. from the adobe help website:
replaceText(beginIndex:int, endIndex:int, newText:String):void
"Replaces the range of characters that the beginIndex and endIndex parameters specify with the contents of the newText parameter."
This would cut out an extra line of code.
I haven't actually done this myself, so if that doesn't work, here's the link to the adobe help page for Text Fields: http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/text/TextField.html
I think that to do what you are looking for ( replace a char when it's typed ), a KeyboardEvent.KEY_DOWN is not enough, because when that event is fired, the text is not yet changed, so any change that you did in its handler to your text field will not cancel the insertion of the current typed char. Also, using KeyboardEvent.KEY_UP ( in addition to KeyboardEvent.KEY_DOWN ) will not resolve the problem, because you can fire n times a KeyboardEvent.KEY_DOWN event with the KeyboardEvent.KEY_UP event fired once !
So, I think that the best event that can do the job is the Event.CHANGE event which is fired every time the text of your text field is changed, so you can do like this :
// is there a char to replace ?
var replace_char:Boolean = false;
// the position of the char that we want to replace
var char_position:int = -1;
var text_input:TextField = new TextField();
text_input.type = 'input';
text_input.border = true;
text_input.addEventListener(Event.CHANGE, onTextChange);
function onTextChange(e:Event):void {
if(replace_char && char_position >= 0){
text_input.replaceText(char_position, char_position + 1, 'b');
replace_char = false;
}
}
addChild(text_input);
stage.addEventListener(KeyboardEvent.KEY_DOWN, _onKeyDown);
function _onKeyDown(e:KeyboardEvent):void {
if(e.keyCode == 81) {
replace_char = true;
char_position = text_input.selectionBeginIndex;
}
}
EDIT :
To use a list of keys and their equivalents, you can use an object to stock your keys like this :
// list of all keys (chars) and their equivalents
var chars:Object = {
81: 'b', // q => b
83: 'v', // s => v
68: 'c' // d => c
// other chars
}
var char_to_replace:int = -1;
// other instructions
function onTextChange(e:Event):void {
if(replace_char && char_position >= 0 && char_to_replace >= 0){
// get the equivalent of the pressed key from chars object using : chars[key_pressed]
text_input.replaceText(char_position, char_position + 1, chars[char_to_replace]);
replace_char = false;
}
}
// other instructions
function _onKeyDown(e:KeyboardEvent):void {
if(chars[e.keyCode]) {
replace_char = true;
// save the last pressed key to get its equivalent, or save this last one directly, to replace it next
char_to_replace = e.keyCode;
char_position = text_input.selectionBeginIndex;
}
}
Hope that can help.
im very new to as3 so i would appreciate any help.
Im trying to make a counter only using the command "for".
im counting on this from 1 to 1000 in steps of 20.
the next step i want to make is to display on the output tab
i already know i can make it with "trace();", but i also want this to be displayed on
the main .swf window, im trying using a dynamic text-field which i named "dyna"
The problem is that, it is only displaying the last number. "1000" or changing very fast that i barely notice, and the last one remains.
var i:int;
for (i = 1; i < 1001; i+=20)
{
trace(i);
//dyna is the name of my dynamic textfiled
dyna.text = i.toString();
//dinamico.text = String(i);
}
-Is there any way to record all the numbers on my dynamic textbox, something like [1,20,40,60,....] horizontally or vertically.
-Or maybe someway to run this from a button step by step.
like [click, 20; click, 40; click 60.....]
Thanks in advance
var i:int;
var str:String="1";
for (i = 20; i < 1001; i+=20)
{
str=str+","+i;
}
dyna.autoSize = TextFieldAutoSize.LEFT;
dyna.text=str;
Output
1,20,40,60,80,100,120,140,160...
Hope it helps
To run this from the button step by step you need a button, a listener attached to the button, a counter available to both button and text field, and a bit of code. The button has to be somewhere on the stage or in your asset, and named somehow, so you can address it by the name. Here it's named yourButton:
var counter:int=0;
yourButton.addEventListener(MouseEvent.CLICK,updateDyna);
function updateDyna(e:MouseEvent):void {
counter+=20;
if (counter>1000) counter=1000;
dyna.text=counter.toString();
}
Here you are, click - 20, click - 40, etc., up to 1000.
I'm making a dots and boxes game in flash using actionscript 3.
Currently I'm completely stuck as I want the player to click two buttons before a line is displayed. I planned to do something like this using the if statement
if button1 and button2 clicked
line1 visible = true
I've also tried adding eventlisteners with one function
function showLine(e:Event):void {
blue0001.visible = true
}
dot00.addEventListener(MouseEvent.CLICK, showLine);
But as far as I know this can only be used when you want to click one button. Is there anyway to have two eventlisteners satisfyed before the function is carried out?
Also how would I (if i can) use the if statements to carry out this?
You would probably do something like this, pseudo-code:
Assume all of the dots are in a dots array.
for (var i: Number = 0; i < dots.length; i++) {
dots.addEventListener(MouseEvent.CLICK, dotClicked, false, 0, true);
}
dotSelected = null;
function dotClicked(evt:MouseEvent):void {
if (dotSelected && isNeighbor(evt.target, dotSelected)) {
showLineConnecting(evt.target, dotSelected)
dotSelected = null;
} else if (!dotSelected) {
highlightDot(evt.target);
dotSelected = evt.target;
} else {
showError("You must click an adjacent dot");
}
}
At the request of the OP, this is what's going on.
for (var i: Number = 0; i < dots.length; i++) {
dots.addEventListener(MouseEvent.CLICK, dotClicked, false, 0, true);
}
Add an event listener to every dot. Here I am assuming you already have an array of dots defined. Each instance in the Array would be a MovieClip (likely), Sprite, or another DisplayObject.
dotSelected = null;
We will use a variable to keep track of any currently selected dot. Since no dot will be selected when the game starts, we set it to null.
function dotClicked(evt:MouseEvent):void {
if (dotSelected && isNeighbor(evt.target, dotSelected)) {
showLineConnecting(evt.target, dotSelected)
dotSelected = null;
} else if (!dotSelected) {
highlightDot(evt.target);
dotSelected = evt.target;
} else {
showError("You must click an adjacent dot");
}
}
This is the function that will get called when any dot is clicked. For explanation's sake, let's take the first click of the game. dotSelected is null, so the first if is false. The second if though is true, because (!dotSelected) is true. So, we run some function I called highlightDot with the dot as the argument. That function could look something like this:
function hightlightDot(dot:Dot):void {
dot.gotoAndStop("selected");
}
Now a second click is made. Now the first part of the first if, dotSelected, is true. The second part is now evaluated. Again I put in a made up function isNeighbor. The isNeighbor function takes two arguments, the dot that was just clicked and the dot that has already been clicked. This function needs to make sure the two dots are adjacent. This could be something like...
function isNeighbor(dot1:Dot, dot2:Dot):void {
return ((dot1.xGrid == dot2.xGrid && Math.abs(dot1.yGrid - dot2.yGrid) == 1) || (Math.abs(dot1.xGrid - dot2.xGrid) == 1) && dot1.yGrid == dot2.yGrid));
}
The above function assumes that the instances of Dot have some properties xGrid and yGrid which defines where in the playing board they sit. If they are in the same row and 1 column apart they are neighbors. If they are in the same column and 1 row apart they are neighbors.
The last thing that happens in a function showLineConnecting is called. That function will again take the two adjacent dots as arguments. It will then draw a line between them in whatever way you choose to do that. Finally, dotSelected is set back to null, allowing another set of dots to be selected.
One thing I just realized, it would probably be helpful to have an additional property that gets triggered on a Dot when it is connected to all of its neighbors so it could no longer be selected.
You will also need logic to handle knowing that a box has been created. For that you would likely just iterate the possibilities given the line that was just drawn. For each line drawn there are only two possible boxes that have been created. So check them both. Watch out for edges.