Текстовые поля как визуальные объекты

Как это ни удивительно, но клипы и текстовые поля типа Input и Dynamic — это ближайшие родственники. Точнее — текстовое поле Flash MX 2004 представляет собой текстовое поле Flash 5, помешенное в однокадровый клип так, что его верхний левый угол совпадает с точкой отсчета системы координат клипа. Зачем понадобилось разработчикам создавать столь необычный симбиоз9 Очень просто; таким образом удалось, нисколько не увеличив размер плейера, добавить многочисленные возможности по управлению видом текстового поля.

Начнем с самого простого. Текстовое поле можно перемешать, используя свойства _х и _у. Например:

this.createTextField("pole", 0, 0, 0, 80, 40);
// Поле Судет перемещаться, и его координаты будут в нем отображаться
this.onEnterFrame = function():Void {
pole._x+=2, pole._y+=3;
pole.text = "х="+pole._x+", "+"y="+pole._y;
};

Поворачивать поле вокруг его левого верхнего угла можно при помощи свойства _rotation. Однако тут имеется важная тонкость. Чтобы ее понять, наберите следующий код:

this.createTextField("pole", 0, 0, 0, 80, 40);
// Поле должно поворачиваться, отображая собственный угол поворота
this.onEnterFrame = function():Void {
pole=_rotation+=4;
pole.text = "rotation="+pole._rotation;
};

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


При всех остальных углах поворота поле невидимо.

Причина такого поведения текстового поля заключается в том, что для того, чтобы производить над текстом столь сложные преобразования, как поворот, плейер должен иметь описание всех используемых символов как векторных картинок. В случае статичных полей такое описание создается автоматически, поэтому их трансформации не вызывают подобных затруднений. В случае динамического поля, ввиду того что заранее неизвестно, какие символы будут в нем использоваться, для достижения того же эффекта пришлось бы сохранить описание всего шрифта. Это бы привело к увеличению веса swf-файла на 20-30 килобайтов, что не всегда оправданно. Поэтому используемые динамическими текстовыми полями шрифты автоматически в фильм не встраиваются. Однако если вам необходимо проводить над полем сложные трансформации, то необходимый шрифт можно включить в фильм явно. Например, чтобы встроить гарнитуру Arial Cyr, выполните следующие действия:

• Откройте библиотеку и в ее меню задействуйте команду New Font.

• В меню Font появившейся панели Font Symbol Properties выберите необходимый шрифт.

• Если будет использоваться жирное или курсивное начертание шрифта, поставьте флажок в окошко настройки Bold или Italic.

• Подобно тому, как задаются идентификаторы для программного экспорта клипов, пропишите идентификатор для символа-шрифта.


Для определенности пусть это будет ar_font.

Если теперь использовать шрифт Arial Cyr в текстовом поле, то над ним можно будет проводить любые преобразования, в том числе и поворот:

this.createTextField(pole", 0, 200, 200, 150, 40);
pole.embedFonts = true; // Активизируем использование встроенных шрифтов
this.onEnterFrame = function():Void {
pole._rotation += 4;
pole.text = "rotation="+pole._rotation;
// Обновленный текст в поле отображаем встроенным шрифтом 20-м кеглем
pole.setTextFormat(new TextFormat("ar_font",20));
};

Чтобы изменить масштаб текстового поля, нужно использовать свойства _xscale и _yscale. Например:

this.createTextField(pole", 0, 50, 50, 350, 40);
// Каждый новый кадр поле будет увеличиваться на 5%
this.onEnterFrame = function():Void {
pole._xseale=pole._yscale+=5;
pole.text= "Ширина="+pole._width + ", " + "Высота=" + pole._height;
};

Приведенный код позволяет менять масштаб текстового поля, но не его пропорции. Если вы попробуете, используя аналогичный подход, изменить соотношение высоты и ширины поля, то у вас ничего не получится.


Текстовое поле будет увеличиваться или уменьшаться в точности в соответствии со значениями свойств __xscalc и _yscale, но искажение текста при этом происходить не будет. Причина та же, что и в случае поворота поля. Решение — включить в фильм необходимый шрифт:

// Включаем в фильм шрифт Arial Cyr и присваиваем ему идентификатор экспорта
// "ar_font"
this.createTextField("pole", 0, 50, 50, 350, 40);
pole.embedFonts = true; // Активизируем использование встроенных шрифтов
// Поле будет быстро растягиваться по вертикали
this.onEnterFrame = function():Void {
pole._xscale += 1;
pole._yscale += 50;
pole.text = "Ширина="+роlе._width+", "+"Высота="+pole._height;
// Отображаем текст встроенным шрифтом
pole.setTextFormat(new TextFormat{"ar_font", 20));
};

Используемый шрифт необходимо встраивать, даже если поле искажается или поворачивается вручную, при помощи инструмента Free Transform. В противном случае при проигрывании фильма поле попросту не будет отображаться.

В отличие от полноценных клипов, у текстовых полей свойства _xscale, _yscale и _width, height отнюдь не идентичны.


Свойства _xscale и _yscale меняют масштаб системы координат поля, что сопровождается пропорциональным изменением и размеров символов текста. Свойства же _width и _height меняют непосредственно ширину и высоту поля, никак не влияя на отображаемый в нем текст. Таким образом, в отличие от остальных применимых к текстовым полям глобальных свойств, width и _height активизируют специфичный механизм, отличный от того, который запускается при попытке изменить высоту или ширину клипа. Например:

this.createTextField("pole", 0, 50, 50, 350, 40);
pole.border=true; // Включаем отображение рамки
this.onEnterFrame = function():Void { // Каждый кадр увеличиваем размер поля
pole._width += 10, pole._height += 5;
pole.text = "Ширина="+pole._width+", " + "Высота="+роlе._height;
};

Управлять можно и прозрачностью текстовых полей при помощи свойства _alpha. Правда, для этого полем должен использоваться встроенный в фильм шрифт:

// Встраиваем шрифт и присваиваем ему идентификатор экспорта "font"
this.createTextField("pole", 0, 50, 50, 350, 40);
pole.embedFonts=true; // Активизируем использование встроенных шрифтов
this.onEnterFrame = function():Void {
pole._alpha-=3; // Каждый кадр увеличиваем прозрачность на 3 %
pole.text="Прозрачность="+роle._alpha;
pole.setTextFormat(new TextFormat("ar_font",20));
};

Включать или отключать отображение поля можно, используя свойство _visible.


Например:

this.createTextField("pole", 0, 50, 50, 350, 40);
pole.text = "Поле должно быть невидимым";
pole._visible = false; // Поле будет невидимым

Применимы к текстовым полям и свойства _xmouse и _ymouse. Они позволяют узнать координаты указателя мыши относительно системы координат поля. Это может быть использовано, например, для определения того, располагается курсор над полем или же нет:

this.createTextField("pole", 0, 50, 50, 350, 40);
pole-border=true; // Активизируем отображение рамки
this.onMouseMove = function():Void {
// При движении мыши проверяем, где находится указатель и исходя из этого
// выводим в поле сообщение
if (pole._xmouse>0 && pole._xmouse0 &&
pole._ymouse pole.text = "Указатель находится над полем";
} else {
pole.text="Указатель находится вне поля";
}
updateAfterEvent();
};

Можно использовать по отношению к текстовым полям и остальные глобальные свойства. Исключение представляют только три из них: _currentframe, _framesloaded, _totalframes. В качестве примера приведем динамическое изменение имени поля:

this.createTextField(pole", 0,10 0,100, 60,30);
pole._name="pole1"; // Меняем имя поля с pole на pole1
trace(pole1); // Выводит: _level0.pole1

Так как текстовые поля Flash MX 2004 представляют собой текстовые поля Flash 5, помешенные в пустой клип, то их цветом, должно быть, можно управлять при помощи методов класса Color. Проверим это:

this.createTextField(pole", 0, 50, 50, 350, 40);
var col:Color = new Color(pole); // Создаем объект цвета, связанный
// с текстовым полем
// При щелчке мыши цвет текста будет меняться на другой
this.onMouseDown = function():Void {
col.setRGB(Math.random()*0xFFFFFF);
// Выводим код текущего цвета
pole.text = "0x"+col.getRGB().toString(16);
};

Наиболее впечатляющие возможности, которые можно открыть, поняв особенности реализации текстовых полей, связаны с использованием по отношению к ним методов и свойств класса MovieClip. Действительно, если текстовые поля находятся в оболочке из пустого клипа, то все присущие клипам инструменты должны быть применимы и к ним. Чтобы это проверить, изменим цепочку наследования объектов класса TextField. В нее мы включим прототип класса MovieClip — тогда все методы и свойства клипов будут наследоваться и текстовыми полями:

this.createTextField(pole", 0, 50, 50, 350, 40);
pole.text="Перемещаемое текстовое поле"; // Изменяем цепочку наследования
TextField.prototype.__proto__=MovieClip.prototype;

pole.startDrag(true); // Поле будет перемещаться вслед за указателем мыши

Приведенный код работает, поэтому сделанное нами и начале раздела предположение о том, что текстовые поля и клипы являются родственными структурами, истинно. Чтобы убедиться в этом окончательно, попробуем применить к текстовому полю еще какой-нибудь метод клипов. Например, попытаемся вложить в текстовое поле экземпляр клипа:

// Создайте клип в виде кружочка и присвойте ему идентификатор экспорта
// "ball"
this.createTextField(pole", 0, 50, 50, 350, 40);
pole.text="Поле, содержащее клип";
TextField.prototype.__proto__=MovieClip.prototype;
pole.attachMovie("ball","ball",0,{_x:100,_y:100}); // Кружок появится ниже
// и левее текста

Итак, оказывается, что текстовые поля обладают большинством методов и свойств клипов. Часть из них доступна по умолчанию, активация же другой части требует применения достаточно изощренного хода, связанного с изменением цепочки наследования. Так или иначе, но помещение текстовых полей в клип-оболочку однозначно сделало возможности по управлению ими куда более богатыми. Нам же остается только их осмыслить и найти им применение на практике.

Ввиду продемонстрированных выше особенностей текстовых полей кажется нонсенсом то, что оператор typeof относит их к типу данных object:

this.createTextField("pole",0, 0, 0, 10, 10);
trace(typeof pole); // Выводит: object

Текстовые поля создаются и удаляются, как клипы. Им присуще большинство методов и свойств клипов. У текстовых полей есть собственные имена. Абсолютно очевидно, что по особенностям реализации их нужно было бы отнести к типу данных movieclip, а не object (или, еще лучше, создать для них собственный тип данных), Кстати, то же самое можно сказать и о кнопках.

Оцените статью: (0 голосов)
0 5 0

Статьи из раздела Action Script на эту тему:
Автоматическое удаление пробелов. Свойство condenseWhite
Встраивание в фильм целого шрифта
Динамическая замена выделенного текста. Метод replaceSel()
Динамическое задание выделения. Метод setSelection()
Задание и извлечение текста поля

Вернуться в раздел: Action Script / 13. Работа с текстом