Этот быстрый совет покажет вам, как реализовать автоматическую вкладку между текстовыми полями. Это позволит установить фокус на следующее определенное текстовое поле, когда максимальное количество символов было введено в предыдущем. Давайте идти!
Окончательный результат предварительного просмотра
Давайте посмотрим на конечный результат, к которому мы будем стремиться:
Шаг 1: Краткий обзор
Ряд текстовых полей будет размещен на сцене, а также кнопка. Используя свойство length
мы проверим максимально допустимое количество символов в каждом поле и изменим активный TextField, используя свойство focus
. Кнопка будет скрыта по умолчанию и будет открыта после заполнения всех текстовых полей.
Шаг 2: Настройте файл Flash
Запустите Flash и создайте новый Flash-документ, установите размер сцены 400x200px и частоту кадров 24fps.
Шаг 3: Интерфейс
Это интерфейс, который мы будем использовать, он включает три поля ввода текста и кнопку. Текстовые поля имеют названия txt1, txt2 и txt3 слева направо, а кнопка называется okButton .
Чтобы код работал, вам нужно установить параметр Max Chars на панели свойств каждого TextField, в этом примере это 3, 3 и 4 соответственно.
Создайте интерфейс самостоятельно или используйте Source FLA.
Шаг 4: ActionScript
Создайте новый класс ActionScript (Cmd + N), сохраните файл как Main.as и начните писать:
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
|
package
{
import flash.display.Sprite;
import flash.events.KeyboardEvent;
public class Main extends Sprite
{
public function Main():void
{
okButton.visible = false;
stage.addEventListener(KeyboardEvent.KEY_UP, checkTextField);
}
private function autoTab(…textfields):void //Use the rest argument to include any number of textfields
{
var txtLen:int = textfields.length;
for (var i:int = 0; i < txtLen; i++)
{
if (textfields[i].length == textfields[i].maxChars)
{
stage.focus = textfields[i + 1];
}
if (textfields[txtLen — 1].length == textfields[txtLen — 1].maxChars) //checks for the last textfield in the array
{
okButton.visible = true;
}
}
}
private function checkTextField(e:KeyboardEvent):void
{
autoTab(txt1, txt2, txt3);
}
}
}
|
Этот код проверяет максимальное количество символов, допустимое в каждом текстовом поле, эти поля вводятся в функцию autoTab
качестве параметров, а затем фокус изменяется при достижении максимального числа. Если последнее текстовое поле в массиве параметров заполнено, открывается кнопка отправки.
Ключевой строкой является stage.focus = textfields[i + 1];
,
Опять же, не забудьте установить параметр Max Chars на панели свойств TextField.
Шаг 5: Класс документа
Не забудьте добавить имя класса в поле « Класс» в разделе « Публикация » на панели « Свойства» .
Вывод
Попробуйте демо-версию и экспериментируйте с использованием этой функции!
Надеюсь, вам понравился этот урок, спасибо за чтение!