ActionScript 3 Flash Keyboard Event

Интересно, может кто-нибудь просветить меня о более простом способе решения этого кода. Я новичок во флэш и ActionScript.

Я хочу иметь текстовое поле, где пользователь вводит свое имя. Каждый раз, когда символ нажимается, и изображение этой буквы отображается под текстовым полем. Так например. Права пользователя Джон. Джон отображается в хороших изображениях ниже.

У меня это работает, но я должен создать поле ввода для каждого символа, поэтому я остаюсь с eg. 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);  
}
Источник

2 ответа

Решение

Я дам вам некоторый код и несколько советов, чтобы попытаться указать вам правильное направление.

Прежде всего, вам не нужен один отдельный класс для каждой буквы алфавита - это будет не менее 26 классов, или 52, если учитывать верхний / нижний регистр, и это совершенно не нужно, потому что каждый из них служит только одной цели - показать одну букву.

Вместо этого я хотел бы сделать один мувиклип с 26 различными кадрами (или 52, если прописные / строчные буквы) помечены от "а" до "z" (или от "А" до "z"). В каждом из этих кадров поместите рисунок одной буквы и одного 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);
   }

}

В этом коде все еще есть некоторые проблемы, такие как имена с не-буквенными символами, такими как пробелы, апострофы и т. Д., Но я думаю, что вы можете начать работать отсюда;)

Надеюсь на помощь, удачи!

Источник

Вы говорите: "Так, например. Права пользователя Джон. Джон отображается в виде красивых изображений ниже". Так что, если я вас правильно понимаю, вы хотите отобразить предварительно отрисованные растровые изображения символов, введенных пользователем?

Если это так, рассмотрите следующее:

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 может быть файлом.png в вашей библиотеке, который был настроен на экспорт как "ImageA".

Это простой пример, который может быть гораздо более оптимизирован, но он должен помочь вам начать правильный путь.

Источник
Другие вопросы по тегам