Actionscript 3 Flash 键盘事件

Question

我想知道有人能告诉我解决此代码的更简单方法。我是 flash 和 actionscript 的新手。

我想要一个文本框，用户可以在其中输入他们的姓名。每次按下一个字符，该字母的图像就会显示在文本框下方。举个例子。用户权限 约翰。约翰在下面的漂亮图片中显示。

我已经完成了这项工作，但我必须为每个字符创建一个输入框，所以我只剩下例如。每个姓名字母 6 个框，每个字母只能接受一个字符。这样做的原因是，我不能将图像一个接一个地放置，如果只使用一个文本框，它们会不断覆盖输入的第一个字符的位置。

我知道我要走很长的路，一定有更容易的事情。

这是代码，如果我必须走这条路，那将非常乏味。有人可以快速提示我解决此问题的正确方法。

谢谢 芬坦

////////////////111111////////////////////
firstname.addEventListener(KeyboardEvent.KEY_DOWN, key_pressed);
function key_pressed(event:KeyboardEvent):void {
if (event.charCode == 65) {
    var fl_MyInstance_2:LibrarySymbol = new LibrarySymbol();
        fl_MyInstance_2.x = 50
        fl_MyInstance_2.y = 200
        addChild(fl_MyInstance_2);

} else if (event.charCode == 66) {
    var fl_MyInstance_3:letterb = new letterb();
        fl_MyInstance_3.x = 50
        fl_MyInstance_3.y = 200
    addChild(fl_MyInstance_3);

} else if (event.charCode == 67) {
    var fl_MyInstance_4:letterc = new letterc();
        fl_MyInstance_4.x = 50
        fl_MyInstance_4.y = 200
    addChild(fl_MyInstance_4);

} else if (event.charCode == 68) {
    var fl_MyInstance_5:letterd = new letterd();
        fl_MyInstance_5.x = 50
        fl_MyInstance_5.y = 200
    addChild(fl_MyInstance_5);

} else if (event.charCode == 69) {
    var fl_MyInstance_6:letterd = new letterd();
        fl_MyInstance_6.x = 50
        fl_MyInstance_6.y = 200
    addChild(fl_MyInstance_6);  
}

Answer 1

您说“例如。用户权限 john。John 显示在下面的漂亮图片中。”因此，如果我理解正确，您希望显示用户输入的字符的预渲染位图图像？

如果是这种情况，请考虑以下事项：

private var _image:Sprite = new Sprite(); // a container to hold your bitmaps (jpgs/pngs)
private var _spacing:uint = 30; // some arbitrary value to space them apart //
myInputTextField.addEventListener(Event.CHANGE, onNameChange);

function onNameChange(e:Event):void
{
// first clear the image sprite to accommodate things like backspaces //
    while(_image.numChildren) _image.removeChildAt(0);
// get the current string in the input textfield //
    var s:String = myInputTextField.text;
// and then layout a series of pre-rendered bitmaps based on those characters //
    for (var i:uint=0; i<s.length; i++){
        var c:String = s.substr(i, 1); // one character //
        var b:Bitmap = getImageCharacter(c);
            b.x = _spacing * i;
        _image.addChild(b);
    }
}

以下帮助函数只是一个映射，它接受一个字符并将其映射到一个 BitmapData 对象，该对象可能在您的库中。

function getImageCharacter(s:String):Bitmap
{  
    switch(s){
        case a: return new Bitmap(new ImageA()); break;
        case b: return new Bitmap(new ImageB()); break;
        case c: return new Bitmap(new ImageC()); break;
    }
}

在这种情况下，ImageA 可能是您的库中设置为导出为“ImageA”的 .png 文件。

这只是一个简单的示例，可以进行更多优化，但这应该会让您走上正确的道路。

Answer 2

我会给你一些代码和一些提示，试图为你指明正确的方向。

首先，每个字母都不需要一个不同的类 - 如果考虑到大写/小写，至少需要 26 个类，或者 52 个，这完全没有必要，因为每个类都只有服务于一个目的 - 显示一封信。

我会做的是制作一个带有 26 个不同帧（或 52 个，如果大写/小写）标记为“a”到“z”（或“A”到“z”）的 MovieClip。在每一帧中，放置一个字母和一个stop();。仅将此 MovieClip 链接到一个类 - Letter 或其他。

然后，当用户在您的名字 TextField 上书写时，您必须小心，因为他/她可能会敲击其他非字母键 - 例如，del 键、后退箭头等可能会影响您的视觉效果表示。我认为确保正确显示所有内容的唯一方法是每次绘制文本字段的全部内容，如下所示：

//KEY UP EVENT
firstname.addEventListener(KeyboardEvent.KEY_UP, key_pressed);

//container (empty) movieclip
var container_mc:MovieClip = new MovieClip();
addChild(container_mc);

function key_pressed(e:KeyboardEvent):void 
{

  var offset:Number=0;

  //clear container to update visual representation
  while(container_mc.numChildren>0)
    container_mc.removeChildAt(0);

  var letterInstance:Letter; //your linked class

  for(var i:uint=0;i<firstname.text.length;i++)
  {  
     letterInstance = new Letter();

     //go to frame corresponding to the letter at position "i"
     //OR use your own system to choose the image for each letter!
     letterInstance.gotoAndStop(first_name.text.charAt(i));

     //postion: x (plus offset to avoid overwritting), y
     letterInstance.x = 50 + offset;
     offset+= letterInstance.width;
     letterInstance.y = 200;

     //add letter to container
     container_mc.addChild(letterInstance);
   }

}

这段代码仍然有一些问题，比如带有空格、撇号等非字母字符的名称，但我认为你可以从这里开始工作;)

希望对你有所帮助，祝你好运！