Как создать собственный компонент Flex для упражнения по заполнению пробелов?

Question

Цель этого компонента — проверить знания ученика по заданному предмету — в примере ниже это география.Учащемуся дается фрагмент текста с пропущенными в нем словами.Он/она должен заполнить (в данном случае напечатать) пропущенные слова – поэтому такой тест/упражнение называется «заполнение пробелов». В упражнении может быть несколько предложений с несколькими пробелами – примерно так:

Лондон — ________ и крупнейший городской район _____________.История Лондона, важного поселения на протяжении двух тысячелетий, восходит к его основанию ___________.

Компонент должен иметь возможность отображать текст с «плавающими» пробелами внутри текста.Эти пробелы будут вести себя аналогично элементу управления TextInput.Как только учащийся отправит ответ, компонент вернет введенные слова, а затем они сравниваются с ожидаемыми ответами.

Компонент должен иметь возможность отображать текст, а пробелы динамически получать все необходимые параметры из текста.Положение пробелов может быть отмечено специальным токеном, например #10#, который будет обозначать положение пробела в тексте и его размер (количество символов).

Поэтому приведенный выше текст перед загрузкой в ​​компонент мог выглядеть следующим образом:

Лондон является №10# и крупнейшим городским районом в №15#.История Лондона, важного поселения на протяжении двух тысячелетий, восходит к его основанию под номером 8#.

Answer 1

Вам нужен контейнер, поддерживающий потоковую компоновку.Это не часть стандартной платформы Flex, но вы можете найти рабочую реализацию. здесь (часть превосходной библиотеки FlexLib) и здесь (автономная реализация).

Answer 2

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

Мне было интересно, есть ли элемент управления макетом, который может сделать это за вас, но я вижу только HBox и VBox, которые слишком ограничительны.Было бы полезно создать или найти универсальный элемент управления макетом автоматического переноса.

Answer 3

FlowBox — это то, что вам нужно.Вы можете использовать HorizontalGap для управления расстоянием между текстом и входными пробелами.

Что касается способов кодирования, у меня была версия на JavaScript, с которой вы можете ознакомиться. Рендеринг, Кодирование данных заполнения пробелов.Это была часть любимого проекта для универсальный генератор учебной деятельности.

С тех пор я перешел на Flex.Я предоставил образцы учебная деятельность в Flex.Вы не найдете там заполнения пробелов, но вы найдете «введите» свой ответ, который достаточно близок.

Все с открытым исходным кодом.Однако имейте в виду, что я написал это в то время, когда изучал Flex...это был повод изучить разнообразные техники.Код почти наверняка будет улучшен.

Если вы придумаете что-то изящное, подумайте о том, чтобы внести свой вклад в проект упражнений на eduforge