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

Question

Цель этого компонента - проверить знания ученика по заданному предмету - в приведенном ниже примере это будет география. Студенту дается фрагмент текста с пропущенными словами. Он / она должен заполнить (ввести в данном случае) пропущенные слова - следовательно, этот вид теста / упражнения называется заполнением пробела. В упражнении может быть несколько предложений с несколькими пробелами - что-то похожее на это:

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

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

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

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

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

Answer 1

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

Answer 2

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

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

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

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

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

Answer 3

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

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